이미지 Alt 텍스트, 어디까지 써봤니 이미지 alt 텍스트를 대하는 태도는 둘 중 하나로 갈린다. 아예 없는 것으로 취급하거나, 그 안에 소설을 쓰거나. 방치와 집착은 반대말처럼 보이지만 결과는 같다. 둘 다 alt 텍스트 본연의 목적, 즉 접근성을 배신한다. 이미지 Alt 텍스트 방치파: 있으나 마나 가장 흔한 경우다. alt 속성 자체가 비어 있거나, IMG_20240611_final2.jpg 같은 파일명이 그대로 들어가 있다. 이미지를 보지 못하는 사용자에게 스크린 리더가 읽어주는 정보가 "이미지, 이백사십일점제이피지"라면, 그건 정보가 아니라 소음이다. 방치파의 논리는 단순하다. "어차피 아무도 안 보는데." 그런데 alt 텍스트는 원래 아무도 안 볼 사람을 위해 쓰는 것이다. 그 전제를 잊으면 애초에 왜 쓰는지도 잊는다. 이미지 Alt 텍스트 집착파: 사과 하나에 소설 한 편 문제는 반대쪽에서 더 흥미롭게 벌어진다. 접근성을 잘 알고, 심지어 열심히 챙기겠다는 고객사일수록 이 함정에 빠진다. 사과 이미지 하나가 있다고 하자. 필요한 alt는 이 정도면 충분하다. 빨간 사과 한 개 그런데 실제로는 이렇게 나온다. 당도 높고 아삭한 식감을 자랑하는 프리미엄 우리동네 거시기 사과, 신선함과 건강함을 한 번에 담은 이 계절 최고의 선물 이건 alt 텍스트가 아니라 상세페이지 카피가 이미지 속성 칸에 잘못 배달된 것이다. 스크린 리더 사용자는 사과를 보러 온 것이지, 사과 예찬을 듣기 위해 방문한 게 아니다. 이 정도로 늘어지면 발생하는 문제는 세 가지다. 1. 접근성 훼손 스크린 리더는 이 문장을 처음부터 끝까지 읽는다. 사용자는 "사과"라는 정보 하나를 얻기 위해 광고 문구 한 문단을 통과해야 한다. 배려로 시작한 일이 인내를 요구하는 일이 된다. 2. 가이드라인 위반 alt 텍스트는 150자 이내가 권장선이다. 그 이상 필요한 설명은 alt가 아니라 본문이나 캡션으로 가야 한다. alt는 사과 하나를...
이미지 Alt 텍스트, 어디까지 써봤니
이미지 alt 텍스트를 대하는 태도는 둘 중 하나로 갈린다. 아예 없는 것으로 취급하거나, 그 안에 소설을 쓰거나. 방치와 집착은 반대말처럼 보이지만 결과는 같다. 둘 다 alt 텍스트 본연의 목적, 즉 접근성을 배신한다.
이미지 Alt 텍스트 방치파: 있으나 마나
가장 흔한 경우다. alt 속성 자체가 비어 있거나, IMG_20240611_final2.jpg 같은 파일명이 그대로 들어가 있다. 이미지를 보지 못하는 사용자에게 스크린 리더가 읽어주는 정보가 "이미지, 이백사십일점제이피지"라면, 그건 정보가 아니라 소음이다. 방치파의 논리는 단순하다. "어차피 아무도 안 보는데." 그런데 alt 텍스트는 원래 아무도 안 볼 사람을 위해 쓰는 것이다. 그 전제를 잊으면 애초에 왜 쓰는지도 잊는다.
이미지 Alt 텍스트 집착파: 사과 하나에 소설 한 편
문제는 반대쪽에서 더 흥미롭게 벌어진다. 접근성을 잘 알고, 심지어 열심히 챙기겠다는 고객사일수록 이 함정에 빠진다. 사과 이미지 하나가 있다고 하자. 필요한 alt는 이 정도면 충분하다.
빨간 사과 한 개
그런데 실제로는 이렇게 나온다.
당도 높고 아삭한 식감을 자랑하는 프리미엄 우리동네 거시기 사과, 신선함과 건강함을 한 번에 담은 이 계절 최고의 선물
이건 alt 텍스트가 아니라 상세페이지 카피가 이미지 속성 칸에 잘못 배달된 것이다. 스크린 리더 사용자는 사과를 보러 온 것이지, 사과 예찬을 듣기 위해 방문한 게 아니다. 이 정도로 늘어지면 발생하는 문제는 세 가지다.
1. 접근성 훼손
스크린 리더는 이 문장을 처음부터 끝까지 읽는다. 사용자는 "사과"라는 정보 하나를 얻기 위해 광고 문구 한 문단을 통과해야 한다. 배려로 시작한 일이 인내를 요구하는 일이 된다.
2. 가이드라인 위반
alt 텍스트는 150자 이내가 권장선이다. 그 이상 필요한 설명은 alt가 아니라 본문이나 캡션으로 가야 한다. alt는 사과 하나를 가리키는 손가락이지, 사과 농장 브로슈어가 아니다.
3. 신뢰성 저하
검색엔진과 생성엔진 입장에서도 마찬가지다. alt에 과장된 홍보성 수식어가 반복되면 이미지와 텍스트의 관계 자체가 신뢰를 잃는다. 모든 이미지에 프리미엄, 최고의 같은 형용사가 붙어 있으면, 그건 설명이 아니라 어뷰징으로 읽힌다.
집착파는 alt 텍스트를 또 하나의 광고 지면으로 여긴다. 그런데 alt는 지면이 아니라 통로다. 통로를 상품 진열대로 바꾸면 지나가야 할 사람이 못 지나간다.
적정선: 사라졌을 때 무엇을 잃는가
방치와 과잉 사이의 기준은 첨부된 가이드에서 이미 명확히 제시된다.
- 의미를 전달하는 이미지에는 반드시 alt를 채운다. 방치파에 대한 반박이다.
- 순수 장식용 이미지는 alt="" 로 명시적으로 비운다. 굳이 없는 의미를 지어내지 말라는 뜻이다.
- "이미지", "사진"처럼 이미 스크린 리더가 알려주는 말로 시작하지 않는다. 대신 그림, 사진, 도표처럼 종류를 구체화한다.
- 길이는 150자 이내를 넘기지 않는다. 넘어갈 만큼 복잡한 이미지라면 alt가 아니라 주변 텍스트나 링크로 분산시킨다.
- 캡션과 alt가 같은 말을 반복하지 않는다. 같은 정보를 두 번 말하는 것은 배려가 아니라 낭비다.
- 버튼, 링크 이미지는 생김새가 아니라 기능을 설명한다. 톱니바퀴 아이콘은 톱니바퀴 그림이 아니라 "설정 열기"다.
이 기준을 관통하는 질문은 하나다. 이 이미지가 사라지면 사용자는 정확히 무엇을 잃는가. 사과 사진이 사라지면 사용자는 "사과가 있었다"는 사실을 잃는다. 그 이상도 이하도 아니다. 사과의 당도와 아삭함은 이미지만 보고는 애초에 전달되지 않는 정보다. 사진 한 장으로 당도를 가늠할 수 있는 사람은 없다. 그런데도 그 문장이 alt에 들어가는 이유는 접근성이 아니라 "혹시 검색엔진이 좋아하지 않을까"라는 오해 때문인 경우가 많다. alt는 검색엔진을 설득하는 카피가 아니라, 이미지가 없는 사람에게 그 이미지가 있었다는 사실과 그 의미를 정확히 전달하는 문장이다. 그 이상을 채우는 순간, 목적은 접근성에서 광고로 슬쩍 바뀐다.
방치파는 아무것도 안 써서 문제고, 집착파는 너무 많이 써서 문제다. 정답은 그 중간 지점을 찾는 게 아니라, 애초에 서로 다른 함정에 빠져 있다는 사실을 각자 인지하는 데 있다. 사과는 사과라고 쓰면 된다.
참고 : https://learn.microsoft.com/en-us/style-guide/accessibility/alternative-text
댓글
댓글 쓰기