본문 바로가기
일상

티스토리 자동 alt태그 기능 대체텍스트

by 밍밍E 2021. 11. 15.
반응형

블로그에 글을 쓰는 사람들은 글의 이해도를 높이기 위해 사진첨부를 한다. 여러 블로그 사이트들이 있지만 그중 대표적인 네이버 블로그, 그리고 다음카카오의 티스토리 블로그가 있다. 그중 티스토리 블로그 같은 경우 사진을 첨부하고 HTML모드에서 alt태그를 삽입하여 사진에 추가적인 부연설명을 넣어줘야 하는 불편함이 있었다. 물론 alt태그가 필수적인 요소는 아니지만 구글 애드센스 및 여러 광고수익을 창출하기 위해서는 아무래도 추가해주는 게 좋은 요소였다. 하지만 최근 티스토리는 업데이트를 통해 alt태그를 자동으로 삽입할 수 있는 대체 텍스트 삽입 기능이 추가됨으로써 더 이상 alt태그를 불편하게 삽입해야 할 필요가 없어졌다. 오늘은 그 대체 텍스트 삽입 기능을 알아보도록 하자.


alt태그란?

alt태그는 시각장애우를 위한 태그로 이미지에 alt태그를 설정함으로써 부연설명을 해주는 태그이다. 특정 이미지에 alt태그를 넣고 이미지 설명을 넣으면 시각장애우의 인터넷의 화면 읽기 도구에서 이미지를 읽어 준다. 거의 대부분의 대기업은 alt태그를 필수로 사용하고 있으며 구글 또한 alt태그를 필수로 취급하고 있으며 구글 검색엔진도 alt태그를 설정한 이미지의 글에 더 플러스 점수를 준다. 그러니 티스토리 블로거들은 alt태그를 꼭 넣어주는 것이 좋다.


기존 alt태그 입력 방법

기존 alt태그 입력방법
기존 alt태그 입력방법

티스토리 기준으로 기존의 alt태그 입력방법은 글쓰기 화면에서 첨부할 이미지를 먼저 삽입한 후 기본 모드로 되어있는 모드를 HEML모드로 바꾼 뒤에 이미지 너비와 높이 태그 뒤에 alt="이미지 설명" 이런 식으로 입력해주면 된다.


변경된 alt태그 입력 방법

변경된 alt태그 입력 순서 1
변경된 alt태그 입력 순서 1

우선 글쓰기 화면에서 사진을 첨부하고 사진을 클릭하면 위 사진과 같은 도구 창이 뜨는데 거기서 제일 오른쪽 도구에 마우스를 올리면 '대체 텍스트 삽입'이라는 문구가 뜬다.

변경된 alt태그 입력 순서 2
변경된 alt태그 입력 순서 2

'대체 텍스트 삽입' 문구를 누르면 위 사진처럼 새로운 창이 뜨는데 거기에 사진설명을 입력하고 확인 버튼을 누르면 새로 변경된 alt태그 입력 순서가 끝난다.

변경된 alt태그 입력 HTML모드 확인
변경된 alt태그 입력 확인

alt태그가 잘 입력됐는지 확인하려면 HTML모드로 가서 확인하면 된다. 위 사진처럼 alt태그가 입력된 것을 확인할 수 있다. 사진으로 보면 알겠지만 기존에는 alt="이미지" 이런 식으로 입력했다면 변경된 방식은 "alt":"이미지" 이런 식으로 변경된 것을 볼 수 있다. '대체 텍스트 삽입' 도구로 alt태그를 쉽게 입력할 수도 있지만 HTML모드로 들어가서 "alt":"이미지"를 직접 입력해도 alt태그 입력이 된다.


지금까지 새로 변경된 alt태그 입력방법을 알아보았다. 앞으로는 HTML모드로 일일이 들어가서 입력할 필요 없이 이미지 도구 창에서 alt태그 입력이 가능하니 편리하게 이용하도록 하자.

댓글