상품 사진을 올렸는데, 설명도 따로 써야 할까?

KEY POINTS

핵심 내용

1. 01

   사진과 텍스트는 함께 해석됩니다 — 대체 텍스트인 alt는 이미지를 보지 못하는 상황에서도 뜻을 전달하는 HTML 속성입니다. HTML은 웹페이지의 구조를 나타내는 언어입니다. Google은 이미지 인식 기술뿐 아니라 alt와 페이지 내용도 함께 사용한다고 설명합니다. 사진을 분석할 수 있다는 이유로 설명을 생략하거나, 반대로 alt만 채우면 충분하다고 볼 수 없습니다.

2. 02

   화면에 보이는 방식과 이미지 발견은 다릅니다 — Google은 HTML의 img 요소에 있는 src 주소로 이미지를 찾으며, CSS로 넣은 이미지는 색인하지 않는다고 안내합니다. img는 이미지를 표시하는 요소, src는 파일 주소이고, CSS는 화면 모양을 정하는 방식입니다. 중요한 상품 사진이 배경 이미지로만 들어갔는지는 제작 담당자가 확인할 항목입니다.

3. 03

   모든 이미지에 같은 설명을 달지 않습니다 — W3C는 정보가 있는 사진에는 문맥에 맞는 짧은 설명을, 순수한 장식에는 빈 alt 값을 사용하도록 안내합니다. 빈 alt를 의도적으로 지정하는 것과 속성을 빠뜨리는 것은 구분해야 합니다. 이미지가 링크나 버튼이고 그것 없이는 용도가 불분명하다면, 외형보다 이동 목적지나 실행 기능을 설명해야 합니다.

4. 04

   도표의 핵심 정보는 짧은 alt에만 가두지 않습니다 — W3C는 복잡한 도표에 짧은 식별 설명과 핵심 정보를 전달하는 긴 설명을 함께 제공하도록 안내합니다. 순서도라면 단계를 글로 풀고, 비교표라면 비교 내용을 읽을 수 있게 제공하는 방식입니다. 긴 설명을 본문에서 모두가 볼 수 있게 두는 접근도 제시합니다.

5. 05

   검색어 나열은 설명을 대신하지 못합니다 — Google은 이미지 주변의 관련 본문과 캡션도 맥락을 이해하는 자료로 사용합니다. 캡션은 그림 옆에 보이는 설명입니다. alt에 검색어를 과도하게 반복하는 행위는 피하도록 안내합니다. 파일이나 설정 항목을 채우는 것보다 실제 사진과 페이지 내용이 맞는지 살피는 일이 우선입니다.