서치 어드바이저 Alt 속성 누락 오류 해결하는 방법

서치 어드바이저 Alt 속성 누락 오류 해결하는 방법

반응형

 오늘 서치 어드바이저 Alt 속성 누락 오류 해결하는 방법 알려드리겠습니다. 티스토리 블로그를 운영하면서 구글 서치콘솔과 더불어 네이버에 내 글을 색인시키기 위해 웹페이지 수집 요청을 꼭 해줘야 합니다. 그런데 수집 요청 후에 웹마스터 도구에서 제 블로그 리포트를 보면 생각지도 못했던 여러 가지 오류들이 발견됩니다. Alt 속성은 이미지의 대체 텍스트로, 검색 엔진 최적화(SEO)와 접근성 향상을 위해 중요합니다. 이 글에서는 초보자도 쉽게 이해할 수 있데 이러한 오류를 처리하는 방법을 알아보겠습니다.

 

 

 

목차

1. Alt 속성의 중요성

2. 오류 발생 원인

3. 해결방법

4. 마무리

 

 

 

1. Alt 속성의 중요성

 Alt 속성(Alternative Text, 대체 텍스트)은 HTML에서 이미지 태그(<img>)에 사용되는 속성 중 하나로, 이미지가 로드되지 않거나 시각 장애인들이 스크린 리더를 사용할 때 이미지의 내용을 설명하는 역할을 합니다. 예를 들어, 웹사이트의 이미지가 깨지거나 로드되지 않을 경우, Alt 속성에 입력한 텍스트가 대신 표시됩니다.

 블로그 글을 작성할 때 Alt 속성의 중요성은 다음과 같습니다.

•  SEO 최적화: Alt 속성은 이미지의 내용을 설명하는 역할을 합니다. 검색 엔진은 이미지를 직접 인식할 수 없기 때문에, Alt 속성을 통해 이미지의 의미를 파악합니다. 따라서 Alt 속성을 적절히 사용하면 검색 엔진 결과 페이지(SERP)에서 블로그의 가시성을 높일 수 있습니다. 이는 트래픽 증가로 이어질 수 있습니다.
• 접근성 향상: 시각 장애가 있는 사용자들은 스크린 리더를 사용하여 웹 페이지를 탐색합니다. 이때, Alt 속성이 없는 이미지는 스크린 리더가 이미지를 설명할 수 없게 됩니다. Alt 속성을 추가함으로써 모든 사용자가 콘텐츠를 온전히 이해할 수 있게 되어 접근성이 향상됩니다.
• 오류 예방: 서치 어드바이저에서 Alt 속성 누락 오류가 발생하면, 이는 블로그의 품질 점수에 영향을 미칠 수 있습니다. 검색 엔진은 품질 점수가 높은 콘텐츠를 우선적으로 노출시키기 때문에, 이러한 오류를 예방하는 것이 중요합니다. Alt 속성을 추가함으로써 오류를 사전에 방지할 수 있습니다.

 

 

2. 오류 발생 원인

 티스토리 블로그를 적을 때, 글의 가독성을 높이고 충분한 이해를 위해 사진이나 이미지를 첨부하게 됩니다. 저도 처음에는 사진만 첨부하고 사이즈를 크게 하면 안 된다고 해서 사이즈만 줄이고 위치에만 신경을 썼는데요. 글을 다 작성하고 서치 어드바이저에 웹페이지 수집을 신나게 요청하고 3일인가 지나서 보니 Alt 속성 누락이라는 생소한 단어의 오류가 올린 글의 개수만큼 있었습니다. 얼마나 당황을 했는지 모릅니다. 

Alt 속성 오류

 

  오류가 발생한 원인은 바로 내가 글 속에 첨부한 이미지나 사진들의 설명을 적지 않았기 때문입니다. HTML 코드나 CSS코드가 무엇인지도 몰랐고, 뭐 영어 한 글자만 건드려도 큰일이 날 것 같았거든요. 초보자 블로거다 보니 모든 것이 어려웠습니다. 사진만 작게 해서 올리면 되는 줄 알았습니다. 그럼 내 블로그에 이 문제를 어떻게 해결하는지 바로 알아보겠습니다.

 

 

 

3. 해결방법

 해결방법은 오류가 난 이유를 알면 너무나 간단합니다. 바로 이미지를 설명하는 글을 삽입해 주면 끝입니다.

 

  ① Alt 속성 추가 방법

Alt 속성 추가 방법

• 티스토리 에디터 사용: 티스토리 블로그에서 Alt 속성을 추가하는 가장 쉬운 방법은 에디터를 사용하는 것입니다. 이미지 업로드 시, 이미지 설정 창에서 "대체 텍스트" 입력란에 Alt 속성을 입력할 수 있습니다. 예를 들어, 음식 사진의 경우 "맛있어 보이는 피자"와 같은 구체적인 설명을 입력하면 좋습니다. 중요한 것은 에디터에서 대체 텍스트에도 이미지를 설명하는 글을 적고, 에디터 말고 첨부한 이미지 아래 작은 글씨로 적어야 되는 [이미지를 설명해 보세요]하는 글에도 동일한 내용으로 삽입해줘야 합니다.
• HTML 코드 수정: 직접 HTML 코드를 수정하여 Alt 속성을 추가할 수도 있습니다. 티스토리 에디터에서 HTML 모드로 전환한 후, 이미지를 포함한 <img> 태그에 Alt 속성을 추가합니다. 이는 보다 정밀한 컨트롤을 가능하게 합니다.

 

 

 ② Alt 속성 작성 팁

• 간결하고 명확하게: Alt 속성은 간결하고 명확해야 합니다. 너무 길거나 복잡한 설명은 피하고, 이미지의 핵심 내용을 전달할 수 있도록 작성합니다.
• 키워드 포함: SEO를 고려하여 Alt 속성에 키워드를 포함시키는 것이 좋습니다. 하지만, 키워드를 과도하게 삽입하는 것은 피해야 합니다. 자연스럽게 키워드를 포함하여 이미지와 관련된 내용을 설명합니다.
• 중복 피하기: 모든 이미지에 동일한 Alt 속성을 사용하면 SEO에 부정적인 영향을 미칠 수 있습니다. 각 이미지에 맞는 고유한 Alt 속성을 작성하여 중복을 피합니다. 이는 검색 엔진이 블로그의 다양한 콘텐츠를 더 잘 이해할 수 있도록 도와줍니다.

 

 

4. 마무리

 서치 어드바이저에서 티스토리 블로그의 Alt 속성 누락 오류를 해결하는 것은 SEO와 접근성 향상에 매우 중요합니다. Alt 속성은 이미지의 내용을 설명하고, 검색 엔진과 사용자가 콘텐츠를 더 잘 이해할 수 있게 도와줍니다. 티스토리 에디터, HTML 코드 수정, 자동화 도구를 사용하여 Alt 속성을 추가하고, 간결하고 명확한 키워드를 포함한 고유한 Alt 속성을 작성하는 것이 좋습니다. 이러한 방법을 통해 오류를 해결하고 블로그의 품질을 높일 수 있습니다.