상세 컨텐츠

본문 제목

<img> 태그에 ALT 속성 내용이 정의되지 않았습니다.

블로그

by 김우쥬 2022. 3. 1. 01:43

본문

728x90
반응형

 

 

 

 

 

 

- SEO(검색 엔진 최적화)를 위해 빙 웹마스터 도구를 이용하다 보면 SEO 보고서 > 오류 세부 정보에 <img> 태그에 ALT 속성 내용이 정의되지 않았습니다. 라는 오류를 발견할 수 있을 겁니다. 심각도는 낮지만 단순히 구글 서치 콘솔이나 네이버 웹마스터 도구, 빙 웹마스터 등에 url을 등록해 검색되기를 기다리는 것보다 이렇게 오류가 있는 부분들을 빠르게 파악해서 수정하는 편이 블로그로 유입되는 방문자 수를 늘리고 상위 검색에 오르는 길이라고 볼 수 있죠. 비교적 간단하게 고칠 수 있지만 블로그 포스팅 수가 쌓여있고, 글마다 사진의 개수가 많은 편이시라면 수정 자체에 번거로움을 느끼실 수 있으니 블로그를 시작한 지 얼마 되지 않은 분들이라면 망설이지 말로 바로 수정하시는 편이 좋을 것 같습니다.

 

 

 

 

 

 

 

<img> 태그에 ALT 특성이 정의되어 있지 않습니다.

 

 

빙 웹마스터 SEO 보고서
출처 : 빙 웹마스터 SEO 보고서

 

 

 

  • 원인 : 일반적인 원칙상 검색 엔진은 이미지 파일의 콘텐츠를 해석하지 않습니다. <img alt> 특성은 사이트 소유자가 검색 엔진과 최종 사용자에게 관련 정보를 제공할 수 있도록 합니다. Alt 텍스트를 최종 사용자가 이미지 사용을 비활성화하였거나 이미지가 제대로 로드되지 않는 경우 유용합니다. 또한 Alt 텍스트는 화면 읽기 프로그램에 사용됩니다. Alt 텍스트가 설명적이고 이미지가 표현하는 것을 정확하게 반영하는지, 페이지의 콘텐츠를 지원하는지 확인합니다.

 

  • 방법 : <img alt> 특성을 사용하여 이미지에 대해 설명적인 콘텐츠를 작성하세요.
<img source='pic.gif' alt='이미지를 표현하는 정확하고 설명적인 키워드 텍스트.'/>

 

 

 

- 포스팅의 이미지가 뜨지 않게 될 경우에 이미지 대신 이미지에 대한 설명을 제공함으로써 검색을 최적화시킬 수 있기 때문에 적용이 필요하다는 겁니다. 이때 alt는 alternative가 ‘대체하다’ 라는 뜻의 줄임말이라는 것을 알면 더 쉽게 이해할 수 있어요. 방법은 구에디터가 아닌 신에디터 기준으로 설명하겠습니다.

 

 

 

 

 

1. 글 수정에서 이미지를 클릭하면 편집창이 뜨는데, 오른쪽 끝에 위치한 대체 텍스트 삽입을 눌러줍니다.

 

 

 

대체 텍스트 삽입
이전 포스팅에 삽입했던 이미지

 

 

 

2. 이미지에 대한 간단한 설명을 넣어줍니다.

 

 

이미지에 텍스트 추가

 

 

- 여기까지 해주면 이미지를 대체해줄 간단한 텍스트 삽입이 완료됩니다. 생각보다 간단하지만 모든 이미지에 일일이 설명을 달아줘야 하니 생각보다 복잡하고 귀찮은 작업입니다.

 

 

 

 

3. 포스팅 오른쪽 상단 기본모드를 HTML로 바꾸고 설명이 제대로 들어갔는지 확인해줍니다.

 

 

 

 

기본모드에서 HTML로 변경
기본모드에서 HTML 모드로 변환

 

HTML 모드에서의 대체 텍스트 확인

 

 

 

-  <p> 이미지 , “alt” : “텍스트” 로 표시되는 것을 확인했습니다.

 

 

 

 

 

 

- 티스토리 구에디터보다 오히려 신에디터가 alt 속성을 추가하는 것이 더 간편해졌다는 느낌이 드네요. 심각도는 낮은 편이지만 SEO 최적화가 블로그로 유입되는 방문자 수에 영향을 미친다는 것을 뒤늦게 알게 된 저로써는 일일이 40개에 육박하는 포스팅들을 일일이 수정하지 않을 수가 없었습니다. 대단히 귀찮지만 포스팅 수가 더 늘기 전에 깨닫게 되어서 차라리 다행이다 생각하려고 합니다. SEO 보고서를 통해 발견되는 오류들을 신경쓰고 수정해나간 탓인지 2차 도메인 적용 후 반토막이 났던 구글 노출 수가 서서히 다시 자리 잡고 있습니다. 제 블로그 SEO 보고서에는 alt 속성 추가 말고도 다른 오류들이 아직 남아있으니 차분히 공부하면서 수정해야겠습니다. 긴 글 읽어주셔서 감사합니다.

 

 

 

 

 

728x90
반응형

관련글 더보기