티스토리 SEO 검색엔진 최적화를 위한 이미지 alt 속성 태그 추가하는 방법

이미지 ALT 태그 누락

 

구글(GOOGLE), 빙(BING), 네이버(NAVER) SEO 최적화를 위한 이미지 ALT태그 삽입

 

목차

 

1. ALT태그란

2. ALT태그 삽입방법

3. SEO 관련글

4. 마치며

 

 

반응형

---

 

1.  ALT 태그란

"alt" 태그는 HTML(하이퍼텍스트 마크업 언어)에서 사용되는 속성(attribute) 중 하나로, 이미지 요소에 대체 텍스트(alternative text)를 제공하는 데 사용됩니다. 이미지가 로드되지 못하는 경우, 시각 장애인을 포함한 사용자들이 이미지의 내용을 이해할 수 있도록 도와줍니다. 또한, 검색 엔진 최적화(SEO) 측면에서도 중요한 역할을 합니다.

"alt" 속성은 이미지 요소(<img>)에 추가되며, 다음과 같은 형식으로 사용됩니다.

<img src="이미지_파일_경로" alt="대체_텍스트">

 

여기서 "이미지_파일_경로"는 실제 이미지 파일의 경로를 나타내고, "대체_텍스트"는 이미지에 대한 설명이나 내용을 간결하게 설명하는 텍스트입니다. "대체_텍스트"는 이미지가 로드되지 않았을 때 화면에 표시되며, 스크린 리더(Screen Reader)와 같은 보조 기기를 사용하는 사용자들에게 읽혀집니다.

예를 들어, 다음과 같은 이미지가 있다고 가정해보겠습니다.

<img src="example.jpg" alt="색상풍경 사진">

이 경우, "색상풍경 사진"이 "alt" 텍스트로 지정되었으므로 이미지가 로드되지 않거나 시각 장애인 사용자가 해당 이미지를 감상할 수 없을 때 이 텍스트가 대신 보여집니다.

"alt" 속성을 제공함으로써 웹 페이지는 접근성을 높이고 사용자 경험을 향상시키며, 검색 엔진에서도 이미지의 내용을 이해하고 색인화하는 데 도움을 줄 수 있습니다.

---

 

2. ALT태그 삽입방법

티스토리 alt 대체 텍스트 삽입 방법

티스토리 글 작성중 삽입한 이미지를 클릭 후 가장 우측 톱니바퀴 "대체 텍스트 삽입" 버튼을 글릭후

대체할 텍스트를 입력해줍니다.

 

ALT태그 삽입 확인

대체 테스트 입력후 HTML 소스코드로 해당 이미지를 본다면 ALT태그가 추가된것을 확인할 수 있습니다.

---

3. SEO 관련글

 

반응형

 

티스토리 목차 HTML 작성법과 구글 SEO 최적화 서식 만들기

 

티스토리 서치어드바이저로 네이버 노출 시키는 방법

 

티스토리 블로그 빙 웹마스터로 BING에 노출 시키는법

 

티스토리 색인화 구글 서치콘솔 사용법 구글에 블로그 노출시키는법

---

4. 마치며

위에 설명한대로, '대체 텍스트'를 사용하여 alt 속성을 설정하면 이미지를 삽입할 때 SEO 측면에서 도움이 됩니다. 이미지마다 alt 속성을 입력하는 작업은 번거로울 수 있지만, 검색 엔진 상위에 노출될 가능성을 고려하면 꼼꼼하게 관리해야 하는 중요한 부분입니다.

이미지 alt 속성을 신경쓰면서 콘텐츠를 작성하는 것은 검색 엔진 최적화(SEO)를 향상시키는 데 도움이 됩니다. 이에 따라 '티스토리 에디터'와 같은 플랫폼을 사용하여 이미지를 삽입할 때 alt 속성을 어떻게 추가할 수 있는지 알아보았습니다.

---