HTML - alt와 title 속성의 뜻과 사용법(웹표준/SEO)
목차
alt 속성 & title 속성
alt와 title 속성은 모두 웹 접근성과 검색 엔진 최적화(SEO)에 중요한 역할을 한다. 그러나 두 속성은 SEO에 서로 다른 영향을 미친다. 이미지를 올바르게 설명하는 적절한 alt 텍스트를 제공하고, 필요한 경우 title 속성을 사용하여 추가 정보를 제공함으로써, 검색 엔진에게 콘텐츠를 이해하고 색인화하는 데 도움이 되는 방향으로 웹 페이지를 최적화하는 것이 중요하다.
alt 속성
이미지가 표시되지 않을 때 대체 텍스트를 제공한다. 이는 검색 엔진이 이미지를 색인화할 때 중요한 역할을 한다. 검색 엔진은 이미지의 콘텐츠를 이해하지 못하지만 alt 텍스트를 사용하여 이미지를 색인화합니다. 이에 따라 이미지의 alt 텍스트는 검색 엔진에게 이미지의 내용을 설명하는 데 사용된다. 즉, 적절한 alt 텍스트를 제공하면 이미지 검색 결과에 표시될 가능성이 높아지며, 웹 페이지의 검색 엔진 순위에 긍정적인 영향을 미칠 수 있다.
<img src="이미지 경로" alt="이미지가 노출되지 않을때 보여지는 이미지 설명">
<!-- 예시 -->
<img src="../img/ninny_logo.png" alt="닌니디자인 로고">
title 속성
이미지나 링크 요소에 대한 추가 정보를 제공한다. 마우스를 해당 요소 위에 올렸을 때 툴팁 형식으로 표시된다. title 속성은 주로 사용자 경험을 향상시키는 데 사용되며, SEO에 직접적인 영향을 미치는 것은 아니다. 그러나 사용자 경험은 검색 엔진 최적화에도 중요한 요소이며, 사용자가 콘텐츠를 더 잘 이해하고 인식할 수 있도록 도와준다. 따라서 적절한 title 속성을 사용하여 사용자에게 추가 정보를 제공하는 것은 사용자 경험을 향상시키고, 이는 간접적으로 SEO에 도움이 될 수 있다.
<a href="이동경로" title="마우스를 올렸을때 보여지는 말풍선"></a>
<!-- 예시 -->
<a href="https://ninnydesign.tistory.com/" title="닌니디자인 티스토리"></a>new_releases Tip
※ title 속성이 사용되지 않는 태그
head, title, meta, base, basefont, script, param
예시