대체 텍스트Alt Text

업데이트 2026.10.31 · Qshop Growth Lab

한 줄 정의

대체 텍스트는 화면을 볼 수 없는 사람이나 검색엔진도 이미지 내용을 알 수 있도록, 이미지가 무엇을 담고 있는지 글로 적어 이미지 코드에 함께 넣어 두는 설명 문구예요.

쉽게 말하면

눈이 불편한 사람은 화면 읽기 프로그램(스크린 리더)이 소리로 읽어 주는 내용을 듣고 웹페이지를 이용해요. 이 프로그램은 사진을 볼 수 없어서, 이미지 자리에서는 이미지에 붙은 설명 글을 읽어 줘요. 이 설명 글이 대체 텍스트예요. 대체 텍스트는 이미지 코드 안에 들어가서 화면에는 보이지 않아요.

왜 넣나요

구글은 이미지가 무엇을 담고 있는지 이해할 때 대체 텍스트를 이미지 인식 기술, 페이지 본문과 함께 참고해요. 이미지에 링크를 걸었다면 대체 텍스트가 그 링크의 글 역할도 해요. 구글은 대체 텍스트가 이미지를 볼 수 없는 사람과 인터넷 연결이 느린 사람에게도 도움이 된다고 설명해요(구글 검색 센터).

잘 쓰려면

무엇이 보이는지 구체적으로 쓰기: 구글은 '강아지'보다 '공 던지기 놀이를 하는 달마시안 강아지'가 낫다는 예를 들어요
키워드를 늘어놓지 않기: 같은 낱말을 반복해 채우면 방문자 경험을 해치고, 사이트가 스팸처럼 보일 수 있어요
버튼이나 링크로 쓰인 이미지에는 생김새 대신 누르면 어디로 가는지, 무슨 일이 일어나는지 쓰기
꾸미기용 이미지는 비워 두기: 웹 접근성 지침을 만드는 W3C는 장식용 이미지나 바로 옆 글과 같은 내용을 담은 이미지에는 빈 대체 텍스트를 쓰라고 안내해요(W3C 대체 텍스트 결정 트리)

큐샵에서는

큐샵에서는 사이트에 넣는 이미지마다 대체 텍스트를 코딩 없이 바로 붙일 수 있어요.

헷갈리는 말

헷갈리는 말	뜻	대체 텍스트와 다른 점
이미지 캡션	이미지 아래에 화면에 보이게 붙이는 설명 글	캡션은 모든 방문자가 화면에서 읽고, 대체 텍스트는 화면에 보이지 않은 채 스크린 리더와 검색엔진이 읽어요