- SEO 위키
캐노니컬 얼터네이트 태그 뜻
(canonical alternate tag)
지난 포스팅엔 캐노니컬 태그 뜻과 쓰임새 그리고 점점 역할을 잃어가는 현상에 대해 작성했습니다.
단 역할을 잃어간다는 건 캐노니컬 태그를 원본 URL 지정의 역할로만 알고 있을 경우인데 여기서 얼터네이트(alternate)라는 코드가 들어가게 되면 캐노니컬 태그의 역할은 새롭게 바뀝니다.
네이버도 사용하고 있는 이 canonical alternate 코드는 무엇일까요?
1.캐노니컬 얼터네이트 태그란?
분리형 웹사이트를 위해 만들어진 캐노니컬 얼터네이트 태그는 PC에서 접속했을 땐 PC 웹사이트가 뜨고 모바일로 접속했을 땐 모바일 웹사이트가 뜨게끔 설정하는 태그입니다. 즉, 반응형 웹사이트를 가지고 있으신 분들은 굳이 이 태그를 사용하실 필요는 없죠.
2. 분리형 웹사이트를 위해 만들어진 태그
앞서 말씀드린 것처럼 분리형 웹사이트를 위해 만들어진 이 태그는 반응형 웹사이트가 대부분인 요즘 시대에는 많이 쓰이고 있지 않아 개발을 하시는 분들도 잘 모르시는 분들이 많습니다. 하지만 경우에 따라 분리형 웹사이트를 만들 수 밖에 없는 산업군이 있는데 제가 알아본 대표적인 산업군은 통신사였습니다.
T월드, KT, LG유플러스 모두 저 마다의 분리형 웹사이트를 가지고 있었죠. 그럼 세 통신사는 태그가 잘 적용되어 있을까요? 다른 SK나 KT와는 다르게 LG는 놀랍게도 해당 태그가 적용되어 있었습니다. (KT는 현재 이 태그를 적용시켰네요)
페이지마다 canonical alternate가 있다는 건 사이트를 구축할 때 SEO를 염두하고 설계를 했다고 볼 수 있죠.
3. 분리형 웹사이트가 캐노니컬 얼터네이트 코드를 써야하는 이유
SEO는 단순히 SERP(검색결과페이지)에서 노출 최적화를 통해 고객의 경험을 향상시키는 것 뿐 만이 아닌 유입하는 웹사이트의 UXUI도 영향을 끼칠 수 있습니다. 구글이 모바일 최적화를 조금 더 높게 가중치를 부여한 이후로 분리형 웹사이트를 운영 함에도 불구하고 alternate 태그를 사용하지 않은 사이트는 PC모드에서 PC 웹사이트가 뜨는 것이 아닌 모바일 사이트가 뜨는 이슈를 얻고 말았습니다.
우리가 자주 사용하는 네이버 또한 마찬가지로 캐노니컬 얼터네이트 태그를 기본적으로 사용해주고 있습니다.
그럼 어떤 식으로 써야할까요?
4. 캐노니컬 얼터네이트 코드 사용방법
KT를 예시로 들어보겠습니다.
<link rel=”canonical” href=”https://product.kt.com“>
<link rel=”alternate” media=”only screen and (max-width:640px)” href=”https://m.product.kt.com“>
봐야 할 요소는 2가지입니다.
1. href의 URL이 어떻게 세팅되어 있는지?
2. media의 너비 px는 어느정도로 세팅되어 있는지?
예시는 640px로 되어있지만 다른 사이트를 보면 720px 등 다양하게 너비가 되어있습니다.
생각보다 세팅 자체는 쉬운데 분리형 웹사이트를 아예 다르게 보고 구축하신 분들이라면 이제 매칭시키는 작업에서 많이 어려워하곤 하죠.
그럼에도 불구하고 현재 본인이 사용하고 계시는 사이트가 분리형 웹사이트라면 해당 코드는 필수적으로 넣어야 하는 코드인 만큼 이 포스팅을 보시는 분리형 웹사이트를 가진 분들이라면 반드시 시도해보시길 추천드립니다 🙂