a 태그 SEO적으로 이해하기

a 태그 SEO적으로 이해하기 a 태그 SEO적으로 이해하기

<a> 태그 형식

<a href = “링크”> 화면에 보이는 문구 </a>

<a> 태그 예시

<a href=”https://www.ascentkorea.com/”> 어센트코리아 </a>

<a href=”https://….43inch-oled-tv.html”>43인치 OLED TV</a>

<a> 태그 사용법

<a></a>태그는 하이퍼링크를 걸어주는 태그이다.

<a> 태그에 대해 예시로 설명하자면, <a href=”https://www.ascentkorea.com/”> 어센트코리아 </a>가 화면에 출력되었을 때는 어센트코리아 로만 보이고 해당 글을 누르면 <a> 태그에 설정한 링크로 이동됩니다. 

<a href=”https://….43inch-oled-tv.html”>43인치 OLED TV</a> 역시 화면에 출력되었을 때는 43인치 OLED TV로 나타납니다.

<a>태그의 a는 anchor의 약자로, 예시에서의 ‘어센트코리아’, ‘43인치 OLED TV’와 같은 화면에 보이는 문구들은 앵커 텍스트(anchor text)라고 합니다.

이 텍스트 부분에는 ‘링크’, ‘여기를 클릭하세요’라는 문구보다 링크를 걸고자 하는 사이트의 핵심 키워드를 포함해야 합니다.

좋은 예: 자세한 사항은 <a href=”seo.html”> 검색 엔진 최적화 </a>를 참조해 주세요.

나쁜 예: 검색 엔진 최적화에 대한 자세한 사항은 <a href=”seo.html”> 여기 </a>

사람이 해당 사이트로 이동하기 위해 클릭하는 것처럼, 검색엔진이나 크롤링 봇도 a 태그를 타고 걸려있는 사이트로 이동해서 크롤링합니다. 하지만 크롤링 봇은 사람과 달리 위의 나쁜 예시에서의 링크가 검색 엔진 최적화에 대한 링크라는 것을 알지 못합니다. 즉, 크롤링 봇은 앵커 텍스트에 기재된 내용이 페이지의 내용으로 이해한다고 생각하면 됩니다. 

위 예시의 경우에는 seo.html이라는 링크에 대한 설명이 ‘여기’로 해석하는 것과 같습니다. 따라서, ‘링크’, ‘여기’, ‘여기를 클릭하세요’와 같이 페이지에 대한 설명이 없는 앵커 텍스트는 SEO적인 측면으로 좋지 않습니다. 큰 요소는 아니지만 키워드를 포함한 앵커 텍스트로 링크가 추가되면 구글 평가가 올라가기도 합니다.

a href # 의미 – <a> 태그의 잘못된 사용법

<a> 태그를 통해 크롤러들이 이동할 수 있기 때문에 <a>태그는 크롤러의 문이라고도 표현합니다. 하지만 seo적인 요소를 고려하지 않고 개발한 사이트들은 <a> 태그에 링크 대신 # 또는javascriptvoid(o) 등을 넣는 경우도 있습니다. 

허블 캡처: a태그의 월별 검색볼륨
허블 캡처: a태그의 월별 검색볼륨

리스닝마인드 허블을 통해 a태그를 검색했을 때도 a 태그 #이 그 다음으로 높은 검색 볼륨을 갖고 있는 것을 확인할 수 있었습니다. 하지만 링크 대신 #과 javascriptvoid(o) 등을 넣으면 보통 클릭을 했을 때 자바스크립트로 특정 내용을 불러오게 되는데 검색엔진이나 클롤러는 이를 이해할 수 없게 됩니다. 즉, 크롤러들은 자유롭게 링크 사이로 이동을 할 수 없게 되며, 링크들과의 관계도 파악할 수 없게 됩니다. 이렇게 되면, 해당 링크를 크롤링할 수 없게 되니, 인덱싱도 어려워지며 랭킹도 할 수 없어 SERP 노출이 어려워지게 됩니다.