alt 텍스트는 이미지 하나만 떼어놓고 쓰는 것이 아니다.

본문이라는 흐름 안에 놓인 이미지를 설명하는 것이기 때문에
alt는 항상 본문 맥락 안에서 읽힌다는 사실을 염두에 두어야 한다.

스크린 리더를 사용하는 사람은 본문을 순서대로 읽다가
이미지가 나오는 순간 alt 텍스트를 듣게 된다.

그 사람의 귀에는 본문의 앞 문장과 alt가 자연스럽게 이어져야 한다.
그 연결이 매끄러울수록 좋은 alt다.

본문에서 이미 설명한 내용을 굳이 반복할 필요는 없다

alt를 쓸 때 가장 흔한 실수 중 하나는
본문에서 이미 한 설명을 alt에서 그대로 되풀이하는 것이다.

본문에 “워드프레스 미디어 라이브러리에 접근하려면
왼쪽 메뉴에서 미디어를 클릭하세요”라고 써놓고

alt에도 “워드프레스 미디어 라이브러리로
이동하는 방법을 보여주는 화면”이라고 쓰면

스크린 리더 사용자는 같은 내용을 두 번 듣게 된다.

이것은 정보 전달이 아니라 정보 과부하다.
alt는 본문이 하지 못한 이야기를 해야 한다.

이미지가 어떤 정보를 보완하는지에 집중하는 것이 맞다.

본문과 alt가 서로 보완하는 관계를 만든다

본문 예시:
“워드프레스에서 이미지를 업로드하려면
미디어 라이브러리로 이동해야 합니다.
왼쪽 메뉴에서 ‘미디어’를 클릭하세요.”

이미지 alt:
html
img alt=”워드프레스 관리자 메뉴에서 미디어 항목이 선택된 화면”

이 예시에서 본문은 해야 할 행동을 설명하고,
alt는 그 행동이 실제로 어떻게 보이는지를 설명한다.

본문은 “왼쪽 메뉴에서 미디어를 클릭하세요”라고 안내했고,
alt는 “미디어 항목이 선택된 화면”이라고
그 결과 상태를 구체적으로 묘사한다.

본문이 행동을 이끌고, alt가 그 결과를 확인시켜 주는 구조다.

이 두 가지가 짝을 이룰 때 텍스트와 이미지는
비로소 하나의 설명이 된다.

본문은 전체 흐름을 설명하고, alt는 이미지가 보여주는
구체적인 장면을 설명한다.

본문이 “왜”, “어떻게”를 담당한다면
alt는 “지금 화면에 무엇이 보이는가”를 담당한다.

이 역할 분담을 명확히 하면
중복도 줄어들고, 각각의 역할도 선명해진다.

중복을 피하되,
이미지만 봐도 이해할 수 있을 정도의 정보는 담아야 한다

여기서 균형이 중요하다.

본문과의 중복을 피하라는 원칙을 너무 과하게 적용하면
alt가 지나치게 짧거나 맥락 없는 문장이 되어버릴 수 있다.

alt는 이미지를 볼 수 없는 상황에서도
그 이미지가 무엇인지 파악할 수 있어야 한다.

본문을 함께 읽고 있는 사람뿐 아니라
이미지 검색을 통해 이 이미지를 단독으로 접하는 사람에게도

alt는 의미 있는 설명이 되어야 한다.

따라서 alt를 쓸 때는 이렇게 생각하면 좋다.

“본문 없이 이 alt만 읽었을 때, 이 이미지가
무엇을 보여주는지 알 수 있는가?”

그 질문에 “예”라고 답할 수 있으면서도
본문과 자연스럽게 이어지는 alt가 가장 좋은 alt다.

짧아도 되고, 길어도 된다.
기준은 글자 수가 아니라 정보의 완결성이다.

이미지가 전달하는 핵심 정보가 alt 안에 담겨 있다면
그것으로 충분하다.