사용자가 보는 텍스트는 “자세히 보기”로 유지하면서, 검색 엔진 최적화(SEO)나 접근성을 위해 실제 앵커 텍스트 역할은 상품명을 사용하는 방법을 고민하다가 생각한 것이 aria-label 입니다. 조금 전 코드를 수정했으니 이런 조치가 효과가 있을지는 좀 지켜봐야 합니다.
aria-label이 SEO에 미치는 영향
첫번째, aria-label은 HTML 요소의 대체 텍스트를 제공하므로, 스크린 리더를 사용하는 사용자에게 읽히는 중요한 정보를 전달합니다. 구글은 웹 접근성을 높이는 사이트를 긍정적으로 평가하며, aria-label과 같은 접근성 태그를 이해하고 처리합니다. 특히 버튼이나 링크와 같은 인터랙티브 요소에 적절한 설명(aria-label)을 추가하면, 구글은 이 정보를 참고하여 해당 요소의 콘텐츠를 더 잘 이해합니다. 이를 Page Experience Signals로 반영 할 확율이 높아 집니다.
두번째, aria-label을 설정하면 실제 버튼에 표시되는 텍스트(예: “자세히 보기”)와 구글이 인식하는 텍스트(예: 상품명)를 분리할 수 있고 구글은 aria-label을 보조적인 텍스트로 간주하므로, 적절히 설정하면 SEO 키워드 강화에 도움이 될 것으로 예측 합니다.
세번째, 링크의 aria-label에 SEO 키워드를 포함하면, 구글은 이를 콘텐츠 맥락을 이해하는 데 참고합니다. 이때 상품명과 관련된 키워드를 자연스럽게 포함하면, 검색 순위 개선에도 기여할 수 있습니다.
aria-label의 올바른 활용 예시
<a href="https://giftjoa.co.kr/new/shop/detail.php?code=2406589"
class="banner-link"
target="_blank"
aria-label="SPD 아이폰 갤럭시 맥세이프 보조배터리 5000mAh"
title="SPD 아이폰 갤럭시 맥세이프 보조배터리 5000mAh">자세히 보기
</a>
aria-label 외에도 title 속성을 함께 사용하면, 사용자가 마우스를 올렸을 때 상품명을 툴팁으로 볼 수 있습니다.