블로그에 이미지를 올릴 때 대체텍스트(alt 텍스트) 입력란을 비워 두거나 이미지 파일명을 그대로 사용하는 경우가 있습니다. 하지만 대체텍스트는 단순히 이미지에 이름을 붙이는 기능이 아니라, 이미지가 전달하는 정보나 역할을 글로 설명하는 데 활용할 수 있습니다.
저는 이미지를 올릴 때 이미지의 역할 정하기 → 글 맥락과 함께 AI에 초안 요청하기 → 소리 내어 읽어 보기 순서로 대체텍스트를 작성합니다. 이번 글에서는 이 과정을 바탕으로 접근성과 검색을 함께 고려하면서 자연스러운 대체텍스트를 만드는 방법을 정리해 보겠습니다.
목차
1. 대체텍스트는 '이미지를 대신 읽어 주는 글'입니다
W3C 웹 접근성 이니셔티브(WAI)의 이미지 튜토리얼은 이미지에 그 이미지가 담은 정보나 기능을 설명하는 텍스트 대안이 있어야 한다고 설명합니다. 이를 통해 화면을 직접 볼 수 없는 사람도 이미지가 전달하려는 내용이나 역할을 이해할 수 있습니다.
같은 튜토리얼에서는 클릭 가능한 이미지의 경우 이미지 자체의 모양보다는 링크의 목적이나 이동 위치를 설명해야 한다고 안내합니다. 이미지가 단순히 무엇처럼 보이는지를 적는 것과, 그 이미지가 페이지에서 어떤 역할을 하는지를 설명하는 것은 다를 수 있다는 의미입니다.
구글 역시 대체텍스트를 작성할 때 유용하고 정보가 풍부한 내용으로, 페이지 내용의 맥락에 맞게 키워드를 적절히 사용하라고 안내합니다. 따라서 접근성과 검색을 완전히 별개의 작업으로 생각하기보다는, 먼저 이미지의 내용을 정확하게 설명하는 데 초점을 맞추는 것이 좋습니다.
2. 먼저 이미지의 역할을 정하세요
W3C의 'alt 결정 트리'는 이미지를 용도에 따라 나누어 생각하도록 안내합니다. 이미지에 글자가 들어 있는지, 장식인지, 링크나 기능을 하는지, 그래프처럼 복잡한 정보를 담고 있는지에 따라 대체텍스트를 작성하는 방법도 달라집니다.
또한 W3C 자료에서는 이미지가 정보를 전달하는지 장식인지 판단할 때 그 이미지를 페이지에 넣은 이유를 기준으로 생각하도록 설명합니다. 같은 사진이라도 어떤 글에 어떤 목적으로 사용했는지에 따라 대체텍스트가 달라질 수 있는 이유입니다.
대표적인 경우를 나누어 보면 다음과 같습니다.
- 정보를 전달하는 이미지: 이미지가 무엇을 보여 주는지 간결하게 설명합니다.
- 장식 이미지: 정보를 추가하지 않는 이미지라면 빈 대체텍스트(alt="")로 두어 화면 낭독기가 건너뛰게 합니다. 다만
alt속성 자체는 항상 있어야 하고, 장식 이미지일 때만 값을 비워 둡니다(GitHub Primer 접근성 가이드). - 링크나 버튼 이미지: 이미지가 무엇인지보다 눌렀을 때 어떤 일이 일어나는지를 설명합니다.
- 그래프·인포그래픽: 짧은 대체텍스트를 작성하고, 이미지가 담고 있는 구체적인 정보는 본문에 별도로 풀어 씁니다.
결국 중요한 것은 모든 이미지에 똑같은 방식으로 설명을 붙이는 것이 아니라, 이미지가 글에서 어떤 역할을 하는지 먼저 판단하는 것입니다.
3. AI에게 초안을 맡길 때의 순서
대체텍스트를 직접 작성하다 보면 이미지에 보이는 요소를 어디까지 설명해야 할지 고민될 수 있습니다. 이럴 때는 AI를 초안 작성 도구로 활용할 수 있습니다. 다만 AI가 작성한 문장을 그대로 사용하는 것보다는 이미지와 글의 맥락을 함께 제공하고, 마지막에 직접 확인하는 과정이 필요합니다.
1) 이미지와 함께 글의 맥락을 알려주기
AI에 이미지만 올리면 눈에 보이는 요소를 단순하게 나열한 설명이 나오기 쉽습니다.
그래서 다음과 같이 이미지가 글에서 어떤 용도로 사용되는지 함께 알려 줍니다.
"이 이미지는 '대체텍스트 작성법' 글에서 대체텍스트 입력 화면을 보여 주는 용도야. 이 맥락에서 쓸 대체텍스트를 써줘."
이처럼 글의 주제와 이미지를 넣은 이유를 함께 전달하면 단순히 사물의 목록을 만드는 것보다 글의 맥락에 맞는 초안을 만들기 쉽습니다.
2) 후보를 짧은 버전과 설명 버전으로 받기
한 가지 문장만 요청하기보다는 길이가 다른 후보를 받아 비교하는 방법도 있습니다.
예를 들어 다음과 같이 요청할 수 있습니다.
"짧은 버전 1개, 조금 더 설명하는 버전 1개를 한 문장씩 써줘. 키워드를 억지로 넣지 말고, 이미지에 보이지 않는 내용은 추측해서 쓰지 마."
구글도 대체텍스트를 키워드로 채우는 것, 즉 키워드 스터핑은 사용자 경험을 해치고 사이트가 스팸으로 보일 수 있다고 안내합니다. 따라서 AI에게 초안을 요청할 때부터 불필요한 키워드 반복이나 이미지에 없는 정보의 추측을 피하도록 조건을 붙이는 것이 좋습니다.
3) 이미지 속 글자는 따로 확인하기
이미지 위에 한글 문구가 들어간 경우에는 AI가 글자를 잘못 읽을 수 있으므로 직접 확인하는 과정이 필요합니다.
이 시리즈의 이미지처럼 한글 문구가 얹힌 이미지라면 실제 이미지에 적힌 문구와 AI가 제안한 설명이 일치하는지 살펴보세요.
W3C 결정 트리에 따르면 이미지 속 글자가 근처에 실제 텍스트로 이미 제공되어 있다면 빈 대체텍스트를 사용하는 경우가 있습니다. 반대로 이미지에만 존재하고 그 내용이 중요하다면 대체텍스트나 본문에 해당 내용을 담는 방식으로 정리할 수 있습니다.
4) 소리 내어 읽어 보기
대체텍스트를 작성한 뒤에는 이미지 없이 문장만 소리 내어 읽어 보는 것도 도움이 됩니다.
문장을 들었을 때 이미지가 글에서 어떤 역할을 하는지 이해할 수 있는지 확인해 보세요. 같은 단어가 지나치게 반복되거나 문장이 어색하다면 다시 다듬습니다.
4. 비교표로 보는 대체텍스트 예시
아래 문장은 이해를 돕기 위해 제가 만든 예시입니다.
| 구분 | 예시 | 판단 |
|---|---|---|
| 키워드 나열 | "AI 이미지 AI 대체텍스트 AI 블로그 AI 활용" | 설명이 아니라 키워드 목록이라 피하는 것이 좋음 |
| 너무 짧고 일반적 | "노트북" | 틀리진 않지만 글에서의 역할이 보이지 않음 |
| 맥락이 담긴 설명 | "블로그 편집기에서 이미지 아래 대체텍스트를 입력하는 화면" | 보이는 내용과 글에서의 역할이 함께 담김 |
| 장식 이미지 | alt="" | 정보를 더하지 않는 이미지에만 사용 |
AI가 만든 대체텍스트는 한 번 더 확인하기
AI가 작성한 대체텍스트에는 이미지에 없는 내용이 섞이거나, 사람의 이름·직업 같은 추측이 들어갈 수 있습니다.
따라서 AI가 만들어 준 문장을 그대로 사용하는 것보다 실제 이미지와 대조하면서 불필요한 내용을 걷어내는 과정이 중요합니다. 이미지에 실제로 보이는 내용만 남기고, 개인 정보가 드러나는 이미지라면 AI에 올리기 전에 한 번 더 확인하세요.
5. 인포그래픽과 복잡한 이미지는 본문이 함께 일해야 합니다
그래프처럼 복잡한 정보가 담긴 이미지는 짧은 대체텍스트 하나만으로 모든 내용을 전달하기 어려울 수 있습니다.
W3C 결정 트리는 그래프처럼 복잡한 정보가 담긴 이미지의 경우 그 정보를 페이지의 다른 곳에도 포함하도록 안내합니다.
예를 들어 인포그래픽이라면 대체텍스트에는
"네 단계로 나뉜 정리 순서를 보여 주는 인포그래픽"
처럼 이미지의 성격을 짧게 설명하고, 각 단계의 구체적인 내용은 본문에서 글로 풀어쓰는 방식입니다.
이렇게 하면 대체텍스트 하나에 너무 많은 정보를 넣지 않으면서도 이미지가 전달하는 중요한 내용을 본문에서 확인할 수 있습니다.
다만 이미지의 성격과 사용하는 블로그 도구에 따라 적합한 방법은 달라질 수 있습니다. 모든 이미지에 같은 형식을 적용하기보다는 이미지를 왜 사용했는지, 이미지가 전달하는 정보가 무엇인지를 기준으로 필요한 부분을 적용해 보세요.
마무리
대체텍스트를 작성할 때 가장 먼저 생각할 것은 검색 키워드가 아니라 이 이미지가 글에서 어떤 역할을 하는가입니다.
정보를 전달하는 이미지인지, 장식인지, 링크나 버튼 역할을 하는지, 복잡한 정보를 담은 인포그래픽인지 먼저 구분하면 작성 방향을 정하기가 훨씬 쉬워집니다.
AI를 활용할 때도 마찬가지입니다. 이미지만 보여 주기보다 글의 주제와 이미지의 사용 목적을 함께 알려 주고, 짧은 후보와 설명이 조금 더 담긴 후보를 비교해 보세요. 마지막에는 실제 이미지와 문장을 대조하고 소리 내어 읽어 보면서 불필요한 표현이나 추측을 덜어내면 됩니다.
특히 이미지에 없는 정보를 AI가 임의로 추가하지 않았는지 확인하는 과정은 빼놓지 않는 것이 좋습니다. 대체텍스트는 길게 쓰는 것보다 이미지의 역할과 필요한 정보를 정확하게 전달하는 것이 중요하기 때문입니다.
FAQ
Q1. 모든 이미지에 대체텍스트를 꼭 써야 하나요?
A. 정보를 전달하는 이미지에는 대체텍스트를 쓰고, 장식 이미지는 빈 값으로 두는 방식이 일반적으로 안내됩니다. 어떤 방식이 적합한지는 이미지를 페이지에 넣은 이유에 따라 달라집니다.
Q2. 대체텍스트에 키워드를 넣으면 검색에 유리한가요?
A. 구글은 페이지 맥락에 맞는 키워드를 적절히 쓰는 것은 권하지만 키워드로 채우는 것은 피하라고 안내합니다. 이미지의 내용을 정확하게 설명하는 과정에서 자연스럽게 키워드가 들어갈 때만 사용하는 것이 좋습니다.
Q3. 이미 올린 이미지가 많은데 어떻게 고치나요?
A. 글의 핵심 이미지부터 하나씩 고치는 것이 현실적입니다. 이미지와 글의 맥락을 함께 AI에 주고 초안을 받은 뒤, 실제 이미지와 대조하고 소리 내어 읽어 확인하는 순서로 반복하면 됩니다.
다음에 이미지를 올릴 때는 업로드한 직후, 그 이미지를 글에 넣은 이유를 한 문장으로 먼저 적어 보세요. 그 문장이 대체텍스트를 작성할 때 참고할 수 있는 뼈대가 됩니다.
여러분은 대체텍스트를 작성할 때 어떤 이미지가 가장 막막하셨나요?
함께 보면 좋은 글
- AI 블로그 이미지 만드는 방법, 저작권과 이용 조건까지 확인하기 (2026-08-14)
- AI 인포그래픽 만드는 방법, 복잡한 정보를 한눈에 정리하기 (2026-08-17)
참고 자료
- W3C WAI, 이미지 튜토리얼(이미지는 정보나 기능을 설명하는 텍스트 대안이 필요)
- W3C WAI, alt 결정 트리(글자가 있는 이미지, 장식 이미지, 복잡한 이미지별 처리)
- W3C, 정보 전달 이미지 방법(이미지를 넣은 이유로 판단)
- GitHub Primer, 이미지 대체텍스트 접근성 가이드(alt 속성은 항상 있어야 하며 장식 이미지는 비움)
- Google 이미지 SEO 모범 사례
- Search Engine Journal, 구글 이미지 문서의 '대체텍스트' 안내 인용(키워드 스터핑 주의)
본 포스팅은 정보 제공을 목적으로 작성되었습니다. 사용하는 블로그 플랫폼과 이미지 용도에 따라 적합한 방법이 다를 수 있으니 참고 자료로만 활용하시기 바랍니다.
'AI 생활연구소' 카테고리의 다른 글
| AI 임상시험 참여자 매칭: 나에게 맞는 연구를 찾는 새로운 방법 (0) | 2026.10.26 |
|---|---|
| AI 개인 원칙 만들기: 바쁠수록 지키고 싶은 일과 기준을 문장으로 정리하기 (0) | 2026.10.25 |
| AI 역할별 이메일 초안: 고객·동료·상사에게 다르게 전달하는 문장 설계 (0) | 2026.10.25 |
| AI로 미술관 관람 질문 만들기: 작품을 보고 '좋다' 이상으로 말하는 법 (0) | 2026.10.24 |
| AI 자기평가의 기술: 잘한 일과 개선할 일을 공정하게 보는 법 (0) | 2026.10.24 |
