이미지 속 글자·자바스크립트 — AI가 읽지 못하는 것
요약
답변엔진이 근거로 쓸 수 있는 것은 결국 문서에서 텍스트로 꺼낼 수 있는 부분입니다. 가격표가 이미지 한 장이면 그 숫자는 인용되지 않고, 본문이 자바스크립트 실행 뒤에만 나타나면 수집 시점에 따라 빈 문서로 읽힐 수 있습니다. 구조화 데이터를 붙여도 화면에 없는 내용은 표시 자격이 없습니다. 먼저 텍스트로 존재하게 만든 다음에 표시를 다듬는 순서가 맞습니다.
근거로 쓰이는 것은 결국 텍스트입니다
답변엔진은 문서를 읽고 잘라 쓸 수 있는 문장을 찾습니다. 그래서 같은 정보라도 어디에 담겨 있느냐에 따라 인용 가능성이 달라집니다.
| 담긴 자리 | 인용 가능성 | 비고 |
|---|---|---|
| 본문 문단·목록 | 높음 | 가장 확실한 자리 |
표(<table>) | 높음 | 머리글이 있으면 관계까지 전달됨 |
| 이미지 속 글자 | 낮음 | 가격·기간 같은 값은 특히 위험 |
| 자바스크립트 실행 후에만 나타나는 본문 | 불확실 | 엔진·시점에 따라 갈림 |
| 로그인 뒤 문서 | 없음 | 수집 자체가 불가 |
자바스크립트: ‘되기도 한다’와 ‘믿을 수 있다’는 다릅니다
구글은 자바스크립트를 실행해 페이지를 렌더링합니다. 다만 공식 문서도 크롤 → 렌더 → 색인이 별도 단계이며 렌더가 뒤로 밀릴 수 있다고 설명합니다(자바스크립트 SEO 기본사항).
답변엔진 쪽은 여기서 한 겹 더 보수적으로 보는 편이 안전합니다. 엔진마다 수집기와 실행 능력이 다르고, 우리가 확인할 방법도 제한적이기 때문입니다. 판단 기준은 간단합니다 — 자바스크립트를 끈 상태에서 그 문장이 보이는가.
이미지: 보이는 것과 읽히는 것
가격표·비교표·절차도를 이미지 한 장으로 만드는 일이 흔합니다. 사람에게는 편하지만, 그 안의 숫자는 답변의 근거가 되지 못합니다. 이미지에는 대체 텍스트를 달되, 대체 텍스트로 본문을 대신하지 않습니다. 대체 텍스트는 이미지를 설명하는 자리이지 본문을 숨겨 두는 자리가 아닙니다.
구조화 데이터는 표시를 돕지, 보장하지 않습니다
구조화 데이터를 붙이면 인용된다는 기대가 많지만, 구글은 2023년 8월에 FAQ와 HowTo 리치 결과의 표시 범위를 크게 줄였습니다(공식 발표). 문법을 맞춰도 표시는 검색엔진이 정한다는 뜻입니다.
그리고 더 중요한 규칙이 있습니다. 화면에 없는 내용을 스키마에만 넣지 않습니다. 질문은 화면에 두고 답은 스키마에만 두는 것도 같은 위반입니다. 나비랑은 이 원칙을 검사 스크립트로 고정해 두었고, 기본 개념은 구조화 데이터 시작하기에 정리했습니다.
점검 순서
- 자바스크립트를 끄고 핵심 문장이 보이는지 본다
- 이미지 속 숫자를 본문 텍스트나 표로 옮긴다
- 표에 머리글을 달아 관계가 전달되게 한다
- 그다음에 구조화 데이터로 같은 사실을 다시 표시한다
순서를 바꾸면 헛수고가 됩니다. 스키마를 먼저 붙여도 근거가 될 텍스트가 없으면 인용할 것이 없습니다.
우리 페이지 중 어디가 이 함정에 걸려 있는지는 무료 AEO 진단에서 확인해 드립니다.
자주 묻는 질문
Q 이미지 안의 글자는 정말 읽히지 않나요?
A 이미지 인식이 발전했지만, 답변의 근거로 쓰이는 경로는 여전히 텍스트 쪽이 확실합니다. 가격·기간·조건처럼 인용될 값은 이미지가 아니라 본문 텍스트나 표에 두는 편이 안전합니다. 이미지에는 대체 텍스트를 달아 무엇을 보여 주는지 설명하되, 대체 텍스트를 본문 대신 쓰지는 않습니다.
Q 자바스크립트로 그리는 페이지는 색인이 안 되나요?
A 되지 않는다고 단정할 수는 없습니다. 구글은 렌더링을 하지만 렌더링은 크롤과 별도 단계이고 시점이 늦을 수 있으며, 엔진마다 실행 능력이 다릅니다. 답변엔진 쪽은 더 보수적으로 보는 편이 안전합니다. 핵심 본문은 HTML 응답 자체에 들어 있게 하고, 자바스크립트는 보조 기능에 쓰는 것이 위험이 적습니다.
Q 구조화 데이터를 붙이면 AI가 인용하나요?
A 구조화 데이터는 내용을 기계가 이해하기 쉽게 표시하는 문법이지 인용을 보장하는 장치가 아닙니다. 구글도 2023년에 FAQ·HowTo 리치 결과의 표시 범위를 크게 줄였습니다. 게다가 화면에 없는 내용을 스키마에만 넣는 것은 정책 위반입니다. 먼저 화면에 사실을 두고, 그 사실을 스키마로 다시 표시하는 순서를 지켜야 합니다.
함께 읽으면 좋은 글
- 정석성형외과 — 기계가 읽을 수 있는 사이트로 다시 만든 기록 정석성형외과 기존 사이트는 사람에게는 정상으로 보였지만 홈 문서 498바이트에 읽히는 글자가 0자였고, 하위 페이지에서 추출되는 400자 안팎은 전부 좌측 메뉴였습니다. 본문은 2000×4792 픽셀 JPEG 안에 있었습니다. 나비랑이 그 사이트를 다시 만들면서 기계가 읽는 층에 무엇을 넣고 무엇을 뺐는지 적은 기록입니다. 성과 수치는 없습니다 — 측정이 시작되지 않았습니다.
- AI가 우리 브랜드 정보를 틀리게 답합니다. 어떻게 고치나요? 가격·서비스·연혁이 사실과 다르게 답변되는 문제를 다룹니다. 원인은 대개 공신력 있는 출처에 정확한 정보가 없거나 오래된 정보가 더 잘 참조되는 것이고, AI 에 직접 정정을 요청하는 방법은 없습니다. 정정 근거가 될 페이지를 만들고 재인용까지 추적하는 절차를 정리했습니다.
- 구조화 데이터, 어디부터 넣어야 하나요? JSON-LD 스키마를 처음 도입할 때의 우선순위를 정리했습니다. Organization 부터 넣고 BreadcrumbList·FAQPage 순으로 넓히되, 종류를 늘리는 것보다 화면에 보이는 사실과 값이 정확히 일치하는 것이 훨씬 중요합니다. 실무에서 자주 나오는 실수도 함께 담았습니다.