티스토리 블로그 이미지 Alt tag 설정은 필수 : 대체 텍스트

 

 

 

Alt tag (= 대체 텍스트)

 

Alt태그는 alternate text의 약어로 말 그대로 '대체 텍스트'를 말합니다. 

 

이미지를 HTML 구조로 변경해보면 정말 다양한 소스들이 걸려있는 것을 확인할 수 있는데, 그중에서 중요한 요소 하나가 Alt 태그입니다. Alt태그는 이미지를 텍스트로 읽게 해 줍니다. 그래서 사진을 볼 수 없는 시각장애인들도 대체 텍스트를 이용해 검색을 가능케 합니다. 웹 게시물에 첨부된 사진에 Alt 태그가 있으면 구글 검색 엔진을 돌아다니는 Googlebot(크롤러)은 해당 게시물을 사용자 친화적인 게시물로 판단하여 상위에 검색 결과를 노출해줍니다. 티스토리 블로그를 운영하는 데 있어 이미지를 어떻게 다루냐는 검색엔진 최적화에 필수 요소 입니다. 

 

기존 티스토리 버전에서 Alt태그를 입력하기 위해서는 HTML모드로 전환하여 HTML 태그 사이에 직접 마크업을 해야 했지만 업데이트된 버전에서는 간단히 Alt 태그를 입력할 수 있습니다. 

 

---

 

이미지 대체 텍스트 적용하는 법

 

 

새 글쓰기 > 왼쪽 상단 이미지 첨부 아이콘 클릭 > 사진 첨부 탭을 클릭합니다.

이미지 대체 텍스트 적용 예시 캡처 1

 

 

 

 

사진이 업로드되면, 사진 바로 위 상단에 도구모음이 보입니다. 도구 모음에서 맨 오른쪽 톱니바퀴 아이콘을 클릭합니다. 바로 아래에 대체 텍스트 입력하는 창이 나타납니다. 

이미지 대체 텍스트 적용 예시 캡처 2

 

 

 

 

사진과 관련된 내용이나 정보를 입력하고 확인을 누르면 됩니다. 이 때 키워드나 이슈가 아닌 사진 그대로를 표현하는 내용 이어야 합니다. 아래 사진에 간단히 썼지만 조금 더 자세히 써보면 '파란색-청바지를-입은-남성이-전문가용-카메라를-손에-든-사진' 정도로 설명 할 수 있습니다. 여기서 또 하나의 꿀팁은 띄어쓰기는 하이픈(-)을 넣어 공백을 없애주는 겁니다. 

 

이미지 대체 텍스트 적용 예시 캡처 3