메뉴와 가격을 텍스트로 적는 법
요점
- 네이버는 「검색로봇은 이미지 속 텍스트를 인식하기 어려우므로」 핵심 정보는 가급적 텍스트로 쓰라고 안내한다.
- 메뉴판 사진은 지우지 않는다. 사진 곁에 메뉴 이름과 가격을 짝지은 텍스트 목록을 붙이고, 목록 제목에 가게 이름과 기준일을 적는다.
- 대체 텍스트(alt)는 사진에 무엇이 찍혔는지 한 문장으로 적는다. 구글은 alt에 키워드를 채우면 스팸으로 볼 수 있다고, 네이버는 지나치게 긴 글자열은 스팸으로 오인될 수 있다고 적었다.
- 구글은 CSS 배경으로 넣은 이미지는 색인하지 않는다. 사진은
<img>요소로 넣는다.
사진 속 가격은 파일에 없다
가게 홈페이지의 메뉴 페이지가 메뉴판 사진 한 장뿐인 경우가 있다. 손글씨나 특정 서체로 만든 메뉴판은 사진으로 올려야 보기 좋다. 카페는 메뉴판이 디자인의 일부이고, 삼겹살집은 부위별 가격과 중량이 메뉴판 사진 안에만 있곤 하다.
이런 페이지의 HTML 파일에는 사진 주소만 있고 「아메리카노 4,500원」 같은 글자는 없다. 네이버 서치어드바이저는 「검색로봇은 이미지 속 텍스트를 인식하기 어려우므로」 사이트의 핵심 정보는 가급적 텍스트로 작성하라고 안내한다. 구글은 이미지의 주제를 파악할 때 대체 텍스트와 컴퓨터 비전 알고리즘과 페이지 콘텐츠를 함께 쓴다고 적었지만, 메뉴판 사진에서 이름과 가격을 읽어 검색 결과나 답에 쓴다고 밝힌 문서는 없다. 챗지피티와 클로드의 검색 로봇이 받아 가는 것도 HTML 파일이다.
인원과 예산으로 가게를 찾는 손님, 「1만 원대 냉면」처럼 가격을 넣어 묻는 손님에게 가게가 닿으려면 그 숫자가 텍스트로 있어야 한다.
메뉴 목록 쓰는 법
- 메뉴판 사진은 그대로 둔다.
- 사진 바로 위나 아래에 텍스트 목록을 붙인다. 이름과 가격이 한 줄에 짝을 이루게 쓴다.
- 목록 제목에 가게 이름과 기준일을 넣는다. 「○○면옥 메뉴와 가격(2026년 9월 기준)」처럼 쓰면 목록의 한 줄이 떨어져 나가도 어느 가게의 언제 가격인지 남는다.
- 양이 가격을 가르는 메뉴는 양을 함께 적는다. 「삼겹살 1인분 180g」처럼 쓴다.
- 계절 메뉴는 파는 기간을 적는다. 「콩국수(6월~8월)」처럼 쓴다.
- 설명은 한 줄로 쓴다. 재료, 조리법, 맵기처럼 손님이 고를 때 따지는 것을 적는다.
HTML로 쓰면 이런 꼴이다.
<h2>○○면옥 메뉴와 가격(2026년 9월 기준)</h2>
<ul>
<li>물냉면 12,000원 - 한우 양지와 사태로 낸 육수, 메밀 70퍼센트 면</li>
<li>비빔냉면 12,000원</li>
</ul>
<img src="/images/oo-myeonok-mulnaengmyeon.jpg"
alt="○○면옥 물냉면, 놋그릇에 담은 모습" width="800" height="600">
제작 도구를 쓰는 홈페이지라면 사진 블록 옆에 글 블록을 하나 더 넣어 같은 내용을 적는다. 글 블록의 내용이 로봇이 받는 파일에 실제로 담겼는지는 빈 종이 확인의 방법으로 확인한다.
대체 텍스트와 파일 이름
사진에 붙이는 설명 한 줄, 곧 대체 텍스트(alt)는 여러 곳에 쓰인다. 화면 읽기 도구를 쓰는 사람에게는 사진을 대신하고, 검색엔진에게는 사진이 무엇인지 알려 주며, 이미지 검색에서 사진이 발견될 길을 연다.
- 무엇이 찍혔는지 한 문장으로. 「○○면옥 물냉면, 놋그릇에 담은 모습」처럼 쓴다. 가게 이름과 음식 이름을 넣는다.
- 키워드를 늘어놓지 않는다. 구글 이미지 안내서는 alt 속성을 키워드로 채우면 사용자 경험에 나쁘고 스팸 사이트로 간주될 수 있다고 적었다. 네이버도 지나치게 긴 글자열은 스팸으로 오인될 수 있다고 적었다.
- 메뉴판 전체를 alt에 옮기지 않는다. 메뉴판 사진의 alt는 「○○면옥 메뉴판 사진」 정도로 두고, 메뉴와 가격은 페이지 본문의 목록에 적는다.
- 파일 이름도 설명이 되게. 구글 문서는 파일 이름도 이미지 주제를 파악하는 데 쓰인다며 짧지만 충분한 설명이 담긴 이름을 권한다.
IMG_0001.jpg대신oo-myeonok-mulnaengmyeon.jpg처럼 짓는다. - 사진은 관련 글 가까이. 구글은 이미지를 관련 텍스트 근처와 주제가 맞는 페이지에 두라고 권한다.
<img>요소로 넣는다. 구글은<img>요소의src속성에 있는 이미지를 찾으며, CSS로 넣은 이미지는 색인하지 않는다고 적었다.
대체 텍스트는 사진을 올릴 때 함께 적는다. 나중에 몰아서 하려면 어느 사진이 무엇이었는지 기억나지 않는다.
가격이 바뀌면
가격을 고칠 때는 메뉴 목록, 메뉴판 사진, 구조화된 데이터, 구글 비즈니스 프로필, 네이버 스마트플레이스, 배달 앱의 가격을 같은 날 고친다. 목록 제목의 기준일도 바꾼다. 「2026년 9월 기준 물냉면 12,000원」이라고 적어 두면 값이 오른 뒤에도 손님과 기계가 언제 가격인지 안다.
메뉴를 구조화된 데이터로 적는 방법은 가게 정보를 구조화된 데이터로 적는 법에 정리했다.