이 글에서는 검색엔진최적화(SEO)와 이미지의 alt 태그에 대해서 설명합니다.
- HTML에서 alt 태그란?
- 검색 엔진 최적화(SEO: Search Engine Optimization)와 alt 태그의 관계
- 구글 블로그(blogger)에서 alt 태그 삽입 방법
.png)
HTML에서 alt 태그란?
HTML에서 alt 태그는 이미지에 대한 대체 텍스트(alternate text)를 정의하는 역할을 합니다. 이미지가 로드되지 못한 경우, 혹은 시각 장애인이나 일부 웹 사용자들이 스크린 리더를 통해 이미지를 인식할 수 없는 경우에 이 대체 텍스트를 대신해서 표시됩니다.
alt 태그는 <img> 요소의 속성으로 사용되며, 다음과 같은 형식으로 작성됩니다.
<img src="이미지 파일 경로" alt="이미지 대체 텍스트">블로그 작성 시 이미지 대체 텍스트는 이미지에 대한 설명을 간결하면서도 명확하게 작성하는 것이 좋습니다. 대체 텍스트를 작성할 때는 다음과 같은 가이드라인을 따르는 것이 좋습니다.
- 이미지의 내용을 충분히 설명할 수 있도록 작성
- 대체 텍스트에서 불필요한 키워드나 반복적인 내용을 사용하지 않도록 함
- 이미지의 크기나 색상 정보를 포함하지 않도록 함
alt 태그는 웹 접근성 측면에서 중요한 역할을 합니다. 시각 장애인이나 일부 웹 사용자들이 이미지를 인식하지 못할 경우, 대체 텍스트를 통해 이미지에 대한 정보를 제공함으로써 웹 사용자들이 원하는 정보에 접근할 수 있도록 도와줍니다.
검색 엔진 최적화(SEO: Search Engine Optimization)와 alt 태그의 관계
alt 태그는 검색 엔진 최적화에도 영향을 미칩니다. 검색 엔진은 이미지 파일 자체를 인식하지 못하기 때문에 alt 태그를 통해 이미지에 대한 정보를 파악하고 이를 검색 결과에 반영합니다. 따라서, alt 태그를 적절하게 작성하면 해당 이미지를 검색 키워드로 검색했을 때 상위 검색 결과에 노출될 확률이 높아집니다.
alt 태그를 작성할 때는 이미지에 대한 설명을 간결하면서도 명확하게 작성하는 것이 중요합니다. 불필요한 키워드나 반복적인 내용을 넣지 않도록 주의해야 합니다. 또한, 이미지 파일 이름을 검색 엔진 최적화에 고려하여 적절한 이름으로 설정하는 것도 좋은 방법입니다. 앞에서 설명한 대체 텍스트를 작성할 때의 가이드라인을 따라서 작성하는 것은 좋은 방법이라 할 수 있습니다. 이를 통해 이미지와 관련된 키워드를 파일 이름에 포함시키고 검색 결과에 노출될 확률을 높일 수 있습니다.
구글 블로그(blogger)에서 alt 태그 삽입 방법
alt 태그는 구글 블로그 작성 시 두 가지 방법으로 적용할 수 있습니다.
1. 새 글 작성 모드에서 alt 태그 삽입
첫 번째는 이미지를 선택하여 나타나는 설정 방법으로 적용하는 방법입니다. 이 방법은 일반적으로 쉽게 사용할 수 있는 방법으로 HTML과 친숙하지 않은 사용자는 이 방법을 사용하는 것을 권장합니다.
아래와 같이 이미지를 클릭하면 해당 이미지가 선택됩니다. 그러면 바로 아래에 톱니바퀴 모양의 설정 버튼이 보입니다.
2. HTML 모드에서 alt 태그 작성
<img src="이미지 파일 경로" alt="이미지 대체 텍스트"> <img alt="구글 블로그에서 대체 텍스트(alt 태그) 넣는 법" data-original-height="451" data-original-width="658" height="438" src="https://blogger.googleusercontent.com/img/a/AVvXsEjAJgkTb48GlNJ1h1uFLFYkg6ZY8zJ-et8yFaV-9WJIvy5yLbMmd86pRNCeO00M7Nloab_jV0F_8xSl8imdQrsZe32KHuITdmqAvxLh95M1caBqd5DvqhT5AYMnwfswbP4P7QADN_zukI7wAyqKXby_osztk-3qazFWrOJLegBjYGwSIwTDyMJGZGLdIQ=w640-h438" width="640" />
.png)
