티스토리 이미지 대체 텍스트 작성 방법｜alt 태그와 파일 이름을 구분해 이미지 SEO 관리하기

티스토리 블로그에 이미지를 넣을 때 대부분의 운영자는 이미지 크기와 화질부터 확인합니다.

그런데 이미지에는 눈에 보이는 사진이나 그림 외에도 확인해야 할 정보가 있습니다.

바로 이미지 대체 텍스트입니다.

블로그를 운영하다 보면 다음과 같은 궁금증이 생길 수 있습니다.

“이미지 대체 텍스트는 반드시 작성해야 할까?”

“alt 태그에 키워드를 넣으면 Google 검색 노출에 도움이 될까?”

“이미지 파일 이름과 대체 텍스트는 같은 의미일까?”

“화면 캡처 이미지에도 설명을 작성해야 할까?”

이미지 대체 텍스트는 단순히 검색엔진을 위한 설정이 아닙니다.

이미지를 볼 수 없는 환경에서도 이미지가 전달하는 정보를 이해할 수 있도록 돕는 중요한 요소입니다.

특히 티스토리에서 설정 방법이나 사용법을 설명하는 정보성 글을 작성한다면 화면 캡처와 설명 이미지의 대체 텍스트를 적절하게 관리하는 것이 좋습니다.

이번 글에서는 이미지 대체 텍스트의 의미부터 티스토리에서 확인하는 방법, 이미지 유형별 작성 기준, 파일 이름과의 차이, 기존 게시글을 점검하는 방법까지 정리하겠습니다.

✓ 1. 이미지 대체 텍스트란 무엇인가요?

이미지 대체 텍스트는 이미지가 전달하는 내용을 텍스트로 설명하는 정보입니다.

HTML에서는 일반적으로 이미지 요소의 alt 속성에 작성합니다.

예를 들어 티스토리 관리자 화면을 캡처한 이미지가 있다고 가정하겠습니다.

이 이미지에는 블로그 설정 메뉴와 여러 항목이 표시되어 있습니다.

이때 대체 텍스트를 다음과 같이 작성할 수 있습니다.

티스토리 관리자 화면의 블로그 설정 메뉴

이 설명은 이미지를 직접 확인하기 어려운 사용자에게 이미지의 의미를 전달하는 데 도움을 줍니다.

또한 검색엔진이 이미지의 내용을 이해할 때 참고할 수 있는 정보이기도 합니다.

다만 대체 텍스트만 작성했다고 이미지가 반드시 Google 이미지 검색에 노출되는 것은 아닙니다.

이미지 검색 노출에는 페이지 콘텐츠와 이미지 자체를 비롯한 여러 요소가 영향을 줄 수 있습니다.

✓ 2. 대체 텍스트가 중요한 이유

이미지 대체 텍스트는 크게 두 가지 측면에서 의미가 있습니다.

첫 번째는 접근성입니다.

화면 읽기 프로그램을 사용하는 방문자는 이미지의 대체 텍스트를 통해 이미지가 전달하는 내용을 이해할 수 있습니다.

두 번째는 이미지의 의미를 설명하는 역할입니다.

검색엔진은 이미지 주변의 본문 내용과 대체 텍스트 등을 참고해 이미지가 어떤 내용을 다루는지 이해할 수 있습니다.

예를 들어 단순히 ‘이미지1’이라고 작성하는 것보다 ‘티스토리 게시글 편집 화면의 이미지 삽입 메뉴’라고 작성하면 이미지의 내용을 더 구체적으로 전달할 수 있습니다.

하지만 모든 이미지에 긴 설명을 넣을 필요는 없습니다.

중요한 것은 해당 이미지가 글에서 어떤 역할을 하는지 파악하는 것입니다.

✓ 3. alt 태그와 대체 텍스트의 차이

블로그 관련 글을 읽다 보면 ‘alt 태그’라는 표현을 자주 볼 수 있습니다.

하지만 정확하게는 HTML 이미지 요소에 사용하는 alt 속성입니다.

일반적으로 말하는 alt 태그 설정은 이미지에 대체 텍스트를 작성하는 작업을 의미합니다.

따라서 블로그 운영자가 알아야 할 핵심은 복잡한 HTML 문법이 아닙니다.

이미지에 어떤 설명을 작성해야 하는지 이해하는 것이 더 중요합니다.

티스토리 편집기에서 대체 텍스트를 설정할 수 있다면 해당 기능을 활용할 수 있습니다.

다만 편집기 버전과 이미지 삽입 방식에 따라 메뉴 구성은 달라질 수 있습니다.

✓ 4. 티스토리에서 이미지 대체 텍스트 확인하는 방법

먼저 티스토리 관리자 화면에 접속합니다.

글쓰기 또는 기존 게시글 수정 화면을 엽니다.

본문에 삽입한 이미지를 선택합니다.

이미지 관련 편집 메뉴가 표시되는지 확인합니다.

이때 대체 텍스트를 입력할 수 있는 기능이 제공된다면 해당 항목을 이용합니다.

일반적인 확인 순서는 다음과 같습니다.

* 티스토리 글쓰기 화면을 엽니다.

* 이미지를 본문에 삽입합니다.

* 삽입한 이미지를 선택합니다.

* 이미지 관련 편집 메뉴를 확인합니다.

* 대체 텍스트 입력 기능이 있다면 설명을 작성합니다.

* 게시글을 저장합니다.

* 실제 게시글에서 이미지가 정상적으로 표시되는지 확인합니다.

편집기에서 해당 기능이 보이지 않는다면 사용 중인 편집 환경과 이미지 삽입 방식을 먼저 확인하는 것이 좋습니다.

특히 HTML을 직접 수정하는 경우에는 기존 이미지 설정을 잘못 변경하지 않도록 주의해야 합니다.

✓ 5. 좋은 대체 텍스트의 기본 기준

대체 텍스트는 길게 작성한다고 무조건 좋은 것이 아닙니다.

이미지가 전달하는 핵심 내용을 간결하고 정확하게 설명하는 것이 중요합니다.

예를 들어 Search Console의 URL 검사 결과 화면을 캡처했다고 가정하겠습니다.

적절하지 않은 예시

이미지

사진

구글 SEO 티스토리 SEO 검색 SEO

적절한 예시

Google Search Console의 URL 검사 결과 화면

이렇게 작성하면 이미지의 내용을 이해하는 데 도움이 됩니다.

대체 텍스트를 작성할 때는 다음 기준을 기억하면 좋습니다.

이미지에 실제로 보이는 내용을 설명합니다.

본문과 관련된 정보를 작성합니다.

불필요하게 긴 문장을 피합니다.

키워드를 반복하지 않습니다.

이미지에 없는 정보를 추가하지 않습니다.

중요한 것은 검색 키워드의 개수가 아니라 설명의 정확성입니다.

✓ 6. 화면 캡처 이미지에는 어떻게 작성할까요?

티스토리 정보성 블로그에서는 화면 캡처를 많이 사용합니다.

특히 설정 방법을 설명하는 글에서는 메뉴와 버튼 위치를 보여주는 이미지가 필요합니다.

이런 경우 대체 텍스트는 화면에 표시된 핵심 기능을 중심으로 작성하는 것이 좋습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

티스토리 관리자 화면의 콘텐츠 관리 메뉴

Google Search Console의 페이지 색인 생성 보고서

애드센스 자동 광고 설정 화면

GA4의 페이지 및 화면 보고서

다만 화면에 있는 모든 글자를 대체 텍스트에 그대로 옮길 필요는 없습니다.

이미지의 목적이 특정 버튼을 찾는 것이라면 버튼 이름과 위치를 중심으로 설명할 수 있습니다.

예를 들어 본문에서 ‘오른쪽 상단의 저장 버튼을 누릅니다’라고 설명하고 있다면 이미지 대체 텍스트도 해당 단계와 자연스럽게 연결되도록 작성하는 것이 좋습니다.

✓ 7. 사진 이미지에는 어떻게 작성할까요?

사진은 이미지에 실제로 보이는 대상을 설명하는 것이 기본입니다.

예를 들어 노트북으로 블로그를 작성하는 사진이 있다고 가정하겠습니다.

적절하지 않은 예시

블로그 SEO 애드센스 수익 티스토리 돈 버는 방법

적절한 예시

책상 위 노트북에 블로그 글쓰기 화면이 열린 모습

사진 속에 무엇이 있는지 설명하면 됩니다.

사진과 관련 없는 키워드를 넣거나 실제로 보이지 않는 내용을 작성할 필요는 없습니다.

특히 사진을 설명하기 위해 ‘사진입니다’, ‘이미지입니다’라는 표현을 반복하지 않아도 되는 경우가 많습니다.

대체 텍스트는 사진의 존재 자체보다 사진이 전달하는 내용을 설명하는 데 초점을 맞추는 것이 좋습니다.

✓ 8. 설명용 도표에는 어떤 내용을 작성할까요?

설명용 도표는 사진보다 더 많은 정보를 포함할 수 있습니다.

예를 들어 이미지 압축 전후의 파일 용량을 비교하는 도표가 있다고 가정하겠습니다.

원본 이미지 3.2MB

압축 이미지 420KB

이 경우 대체 텍스트를 다음과 같이 작성할 수 있습니다.

이미지 압축 전 3.2MB에서 압축 후 420KB로 파일 용량이 감소한 비교 그림

이렇게 작성하면 이미지에 담긴 핵심 정보를 전달할 수 있습니다.

다만 도표에 여러 수치와 복잡한 내용이 포함되어 있다면 짧은 대체 텍스트만으로 모든 정보를 설명하기 어려울 수 있습니다.

이 경우 중요한 내용을 본문에도 텍스트로 제공하는 것이 좋습니다.

대체 텍스트는 본문 설명을 완전히 대신하는 수단이 아닙니다.

✓ 9. 장식용 이미지에는 어떻게 해야 할까요?

모든 이미지에 자세한 대체 텍스트를 작성해야 하는 것은 아닙니다.

예를 들어 문단 사이에 넣은 단순한 구분선이나 장식용 아이콘처럼 별도의 정보를 전달하지 않는 이미지가 있을 수 있습니다.

이러한 이미지는 화면 읽기 프로그램이 불필요한 설명을 반복하지 않도록 빈 대체 텍스트로 처리하는 것이 적절할 수 있습니다.

중요한 것은 대체 텍스트를 작성하지 않은 상태와 의도적으로 빈 대체 텍스트를 설정한 상태가 기술적으로 같지 않을 수 있다는 점입니다.

따라서 장식용 이미지라고 해서 무조건 입력 항목을 비워두면 된다고 생각해서는 안 됩니다.

티스토리 편집 환경에서 어떤 HTML이 생성되는지 확인할 필요가 있습니다.

정보를 전달하는 이미지는 설명을 작성하고, 순수한 장식용 이미지는 이미지의 역할에 맞게 처리하는 것이 좋습니다.

✓ 10. 이미지 파일 이름과 대체 텍스트의 차이

이미지 파일 이름과 대체 텍스트는 서로 다른 정보입니다.

파일 이름은 이미지를 저장할 때 사용하는 이름입니다.

예를 들어 다음과 같습니다.

search-console-url-inspection.png

반면 대체 텍스트는 이미지가 전달하는 내용을 설명하는 문장입니다.

예를 들어 다음과 같이 작성할 수 있습니다.

Google Search Console에서 게시글 URL을 검사한 결과 화면

두 정보는 서로 관련이 있지만 같은 역할을 하는 것은 아닙니다.

파일 이름은 이미지 관리와 내용 식별에 도움이 될 수 있습니다.

대체 텍스트는 이미지가 전달하는 의미를 설명하는 데 사용됩니다.

따라서 파일 이름을 잘 작성했다고 대체 텍스트를 생략해도 된다고 생각하지 않는 것이 좋습니다.

반대로 대체 텍스트를 작성했다고 파일 이름을 반드시 길게 만들 필요도 없습니다.

✓ 11. 파일 이름에 키워드를 반복할 필요는 없습니다

이미지 SEO를 위해 파일 이름에 검색 키워드를 많이 넣어야 한다고 생각하는 경우가 있습니다.

하지만 키워드를 반복한다고 검색 노출이 보장되는 것은 아닙니다.

예를 들어 다음과 같은 파일 이름은 피하는 것이 좋습니다.

tistory-seo-google-seo-blog-seo-adsense-seo-image.png

반면 다음처럼 이미지 내용을 구분할 수 있는 이름은 관리하기 편리합니다.

tistory-alt-text-setting.png

search-console-indexing-report.png

중요한 것은 파일 이름만으로 어떤 이미지인지 구분할 수 있도록 작성하는 것입니다.

또한 티스토리에 업로드한 뒤 실제 제공되는 이미지 URL이나 파일 이름이 원본과 다르게 처리될 수 있다는 점도 고려해야 합니다.

따라서 원본 파일 이름을 설정한 것만으로 검색엔진에 동일한 이름이 전달된다고 단정할 수 없습니다.

✓ 12. 대체 텍스트에 검색 키워드를 넣어도 될까요?

대체 텍스트에 검색 키워드가 포함되는 것 자체가 문제는 아닙니다.

다만 이미지의 실제 내용을 설명하는 과정에서 자연스럽게 포함되어야 합니다.

예를 들어 티스토리 이미지 압축 과정을 보여주는 이미지라면 다음과 같이 작성할 수 있습니다.

티스토리 게시글에 사용할 이미지의 압축 전후 파일 크기 비교

이 문장에는 ‘티스토리’, ‘이미지’, ‘압축’이라는 관련 단어가 포함되어 있습니다.

하지만 이미지의 실제 내용을 설명하고 있으므로 자연스럽습니다.

반대로 이미지와 관련 없는 검색어를 반복하는 것은 피하는 것이 좋습니다.

대체 텍스트를 검색 순위 상승을 위한 키워드 입력란으로 생각하지 않는 것이 중요합니다.

✓ 13. 기존 게시글의 대체 텍스트도 수정해야 할까요?

이미 발행한 게시글에 대체 텍스트가 없다면 점검할 수 있습니다.

다만 모든 게시글의 이미지를 한꺼번에 수정할 필요는 없습니다.

먼저 다음과 같은 글부터 확인하는 것이 좋습니다.

검색 유입이 있는 게시글

화면 캡처가 많은 게시글

설정 방법을 단계별로 설명하는 게시글

도표에 중요한 정보가 포함된 게시글

이미지 설명이 부족한 게시글

특히 이미지에만 중요한 정보가 있고 본문에는 해당 내용이 설명되어 있지 않다면 우선적으로 개선할 가치가 있습니다.

기존 게시글을 수정할 때는 대체 텍스트만 확인하지 말고 이미지가 정상적으로 표시되는지도 함께 살펴보는 것이 좋습니다.

✓ 14. 대체 텍스트 작성 후 확인할 것

대체 텍스트를 작성했다면 실제 게시글을 확인하는 것이 좋습니다.

특히 다음 내용을 살펴봅니다.

이미지가 정상적으로 표시되는가?

이미지와 대체 텍스트의 내용이 일치하는가?

중요한 정보가 빠져 있지는 않은가?

불필요한 키워드를 반복하지 않았는가?

이미지와 본문 설명이 서로 모순되지 않는가?

필요하다면 브라우저의 개발자 도구나 페이지 소스에서 이미지의 alt 속성을 확인할 수 있습니다.

다만 티스토리의 이미지 삽입 방식과 HTML 구조는 환경에 따라 다를 수 있습니다.

따라서 대체 텍스트를 입력했다는 사실만으로 실제 HTML에 원하는 형태로 반영되었다고 단정하지 않는 것이 좋습니다.

✓ 15. 실제 상황별로 판단해 봅니다

A 사례｜Search Console 화면 캡처

게시글에서 Search Console의 URL 검사 방법을 설명하고 있습니다.

본문에는 URL 검사 결과 화면이 삽입되어 있습니다.

이 경우 다음처럼 작성할 수 있습니다.

Google Search Console의 URL 검사 결과 화면

이미지에 표시된 핵심 내용을 설명하면 됩니다.

B 사례｜이미지 압축 전후 비교 그림

게시글에서 이미지 용량을 줄이는 방법을 설명하고 있습니다.

그림에는 압축 전후 파일 크기가 표시되어 있습니다.

이 경우 다음처럼 작성할 수 있습니다.

이미지 압축 전 3.2MB와 압축 후 420KB를 비교한 그림

핵심 수치를 함께 설명하면 이미지를 직접 보지 않아도 내용을 이해하는 데 도움이 됩니다.

C 사례｜장식용 구분 이미지

게시글의 문단을 구분하기 위해 단순한 장식 이미지를 사용했습니다.

이미지에는 별도의 정보가 없습니다.

이 경우 불필요한 설명을 작성하기보다 장식용 이미지에 적합한 대체 텍스트 처리를 검토하는 것이 좋습니다.

D 사례｜키워드를 반복한 대체 텍스트

게시글에 노트북 사진을 넣었습니다.

그런데 대체 텍스트에는 ‘티스토리 SEO 애드센스 수익 블로그 수익화’처럼 여러 키워드만 반복되어 있습니다.

이 경우 이미지에 실제로 보이는 내용을 설명하도록 수정하는 것이 좋습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

책상 위 노트북에 블로그 글쓰기 화면이 열린 모습

✓ 16. 이미지 대체 텍스트 최종 체크리스트

□ 이미지 대체 텍스트의 역할을 이해했다.

□ alt 속성과 이미지 파일 이름의 차이를 구분했다.

□ 이미지에 실제로 보이는 내용을 설명했다.

□ 화면 캡처의 핵심 기능을 정확하게 작성했다.

□ 도표에 포함된 중요한 정보를 설명했다.

□ 장식용 이미지와 정보 전달용 이미지를 구분했다.

□ 불필요한 검색 키워드를 반복하지 않았다.

□ 이미지 파일 이름을 알아보기 쉽게 정리했다.

□ 기존 게시글의 중요한 이미지를 점검했다.

□ 대체 텍스트가 실제 게시글에 정상적으로 반영되었는지 확인했다.

자주 묻는 질문

Q1. 티스토리 이미지마다 대체 텍스트를 반드시 작성해야 하나요?

정보를 전달하는 이미지라면 적절한 대체 텍스트를 제공하는 것이 좋습니다. 다만 순수한 장식용 이미지는 빈 대체 텍스트로 처리하는 것이 적절할 수 있습니다. 이미지의 역할에 따라 판단해야 합니다.

Q2. 대체 텍스트에 키워드를 넣으면 Google 검색 순위가 올라가나요?

대체 텍스트는 검색엔진이 이미지의 내용을 이해하는 데 참고할 수 있지만 키워드를 넣었다는 이유만으로 검색 순위 상승이 보장되는 것은 아닙니다. 이미지의 실제 내용을 정확하게 설명하는 것이 중요합니다.

Q3. 이미지 파일 이름과 대체 텍스트를 똑같이 작성해야 하나요?

그럴 필요는 없습니다. 파일 이름은 이미지를 구분하는 용도이고 대체 텍스트는 이미지가 전달하는 내용을 설명하는 정보입니다. 각각의 역할에 맞게 작성하면 됩니다.

Q4. 화면 캡처에 있는 글자를 모두 대체 텍스트에 적어야 하나요?

반드시 그럴 필요는 없습니다. 이미지가 전달하는 핵심 내용을 중심으로 설명하는 것이 좋습니다. 복잡한 화면에 중요한 정보가 많다면 본문에서도 해당 내용을 설명하는 것이 도움이 됩니다.

Q5. 대체 텍스트가 없으면 애드센스 승인이 거절되나요?

대체 텍스트가 없다는 사실 하나만으로 애드센스 승인 여부를 판단할 수 없습니다. 다만 이미지 접근성과 콘텐츠 이해도를 높이는 데 도움이 되므로 중요한 정보성 이미지부터 적절하게 관리하는 것이 좋습니다.

마무리｜대체 텍스트는 검색 키워드보다 이미지 설명이 우선입니다

티스토리 이미지 대체 텍스트는 단순히 SEO를 위해 키워드를 입력하는 공간이 아닙니다.

이미지를 직접 확인하기 어려운 방문자에게 이미지가 전달하는 내용을 설명하는 중요한 정보입니다.

특히 티스토리 정보성 블로그에서는 화면 캡처와 설명 이미지가 자주 사용됩니다.

따라서 이미지가 어떤 기능이나 내용을 보여주는지 정확하게 작성하는 것이 좋습니다.

사진은 실제로 보이는 대상을 설명합니다.

화면 캡처는 핵심 메뉴와 기능을 설명합니다.

도표는 중요한 수치와 비교 내용을 전달합니다.

장식용 이미지는 불필요한 설명을 반복하지 않도록 이미지의 역할에 맞게 처리합니다.

또한 이미지 파일 이름과 대체 텍스트는 서로 다른 역할을 한다는 점을 기억해야 합니다.

파일 이름은 이미지를 관리하고 구분하는 데 도움이 됩니다.

대체 텍스트는 이미지의 의미를 전달하는 데 사용됩니다.

기존 게시글을 점검할 때도 모든 이미지를 무조건 수정하기보다 중요한 정보를 담고 있는 이미지부터 확인하는 것이 좋습니다.

이미지 SEO 관리의 핵심은 검색 키워드를 많이 넣는 것이 아닙니다.

이미지가 전달하는 정보를 방문자와 검색엔진이 더 정확하게 이해할 수 있도록 만드는 것입니다.

함께 보면 좋은 글

티스토리 이미지 용량 줄이는 방법｜화질 유지하면서 모바일 로딩 속도 개선하기

티스토리 이미지 용량 줄이는 방법｜화질 유지하면서 모바일 로딩 속도 개선하기

다음 글 예고

티스토리 이미지 검색 유입 확인하는 방법｜Search Console에서 이미지 검색 클릭수·노출수 분석하기

다음 글에서는 Google Search Console에서 이미지 검색 유입을 확인하는 방법을 알아보겠습니다.