rel=”canonical” 기준이 될 URL

rel=”canonica”

canonical 미국식 [-ˈnɑːn-]  영국식 [kəˈnɒnɪkl] 

1. (성경이) 정본에 속하는; (문학 작품이) 고전으로 여겨지는
2. 교회법에 따른
3. (수학에서) 표준이 되는

네이버 사전의 canonical 의 해석, 1번 또는 3번의 뜻이 된다.

canonical 이라는 설정값은 평소에 잘 사용하지 않았던 태그로 대부분의 비전공자(?) 기획자, 디지털마케터 등은 잘 모르는 태그일 것입니다. 기본적으로 이 태그는 하나의 페이지에 여러 개의 URL이 존재할 경우 대표값을 검색엔진에 알려주는 역할을 합니다.

A canonical link element is an HTML element that helps webmasters prevent duplicate content issues in search engine optimization by specifying the “canonical” or “preferred” version of a web page. It is described in RFC 6596, which went live in April 2012.

canonical link element는 웹 마스터가 웹 페이지의 “표준”또는 “선호”버전을 지정하여 검색 엔진 최적화에서 중복 컨텐츠 문제를 방지하는 데 도움이되는 HTML 요소입니다. RFC 6596에 설명되어 있으며 2012 년 4 월에 시작되었습니다.

위키피디아의 Canonical Link의 설명

위키피디아의 설명이 조금은 정확할 것 같습니다. canonical element는 강제성을 가진 태그가 아닌 권장사항이고 실제로 2012년에 시작될 정도로 오래되지 않은 표준입니다. 그런 이유로 인해 오래전부터 웹사이트를 제작해온 분들은 잘 모르는 태그이기도 하고 국내의 꽤 많은 프로젝트에서 적용되지 않은 태그이기도 합니다. 하지만 모바일과 다국어 페이지에 대한 요구가 확대됨에 따라 최근에는 거의 대부분의 웹페이지에 적용되고 있는 태그입니다.

<title>S.E.O. Guide - 모두의 검색엔진 최적화 가이드</title>
<meta name="description" content="모두의 검색엔진 최적화 가이드" />
<link rel="canonical" href="https://seoguide.kr/" />

canonical link의 값은 특정 페이지의 기준이 되는 주소라고 생각하시면 됩니다. 상황에 따라 특정 페이지는 여러가지 주소를 가질 수 있습니다. 쉽게 이야기 하자면 구글과 네이버와 같은 검색엔진에게 중복되는 콘텐츠 페이지(같은 페이지이지만 접속 방법이나 장치에 따라 다른 주소를 가지는 페이지)에 대해 어떤 페이지가 오리지널인지 알려주는 역할을 합니다.

예를 들어 국문/영문/일문/중문 4개의 언어를 지원하며 모바일을 위해 별도의 Sub Domain을 운영하는 웹사이트의 경우를 가정해 본다면 국/영/일/중 4개 페이지가 모바일과 데스크탑으로 각각 2개의 페이지, 총 8개의 페이지가 만들어져 있고 8개의 접속 주소를 가지고 있을 것입니다. 사용자가 검색엔진 등을 통해 접속을 한다면 검색엔진에서 제공한 링크 URL로 접근하여 기기 정보를 읽어 모바일과 데스크탑으로 분기가 되고, 해당 접속 브라우저의 기준 언어에 따라 국문/일문/중문으로 접속시키며 그 외의 언어 접속자는 모두 영문으로 이동하게 될 것입니다.

그래 내가 왕이될.. 아니 기준이 될 URL인가?

canonical link, 검색엔진 그리고 SEO

이렇게 동일한 페이지가 8개의 접속주소를 가지는 경우(언어가 다르고 내용이 일부 다를 수는 있습니다만 동일한 콘텐츠로 판단할 수 있습니다.) 검색엔진은 어떤 주소를 사용자에게 전달해야 할까요? 이런 경우를 위해 만들어진 표준안이 지금 이야기 하고 있는 canonical link 입니다. 검색엔진은 사용자의 검색 언어에 따라 동일한 URL에 다른 스니펫을 보여줍니다.

일반적으로 기준이 되는 데스크탑 페이지의 URL을 기준 URL로 지정하고 다국어 및 모바일 페이지가 존재한다면 이 페이지들은 기준 URL로 리다이렉션 처리하여야 합니다.

또한 모바일 접근에 따른 리다이렉션 페이지는 데스크탑과 동일한 내용을 제공하여야 하며 별도의 간략화 된 모바일 서비스로 이동하는 것은 SEO에 나쁜 영향을 줍니다. 웹에서 제공하는 모든 페이지는 모바일에도 동일하게 제공하는 것이 SEO를 위해서는 꼭 필요합니다.

또한 rel=“canonical” 요소에는 상대경로가 아닌 절대경로1를 이용하여야 합니다.

Naver의 경우 모바일 사이트가 별도로 있는 경우 모바일 사이트의 페이지 내에 데스크탑 사이트의 URL를 명시하는 것을 권장하고 있습니다.

역설적으로 canonical link를 기입하지 않았을 경우 제공하는 페이지의 수가 많아져서 더 나은 SEO가 될 것처럼 생각되지만 실제 검색엔진은 해당 페이지가 동일 내용임을 판단하여 패널티를 적용 SEO가 나빠지게 됩니다. 검색엔진의 목표가 사용자에게 더 나은 검색 경험을 제공하는 것이기 때문에 동일한 내용을 여러 주소로 표현하여 사용자의 선택(클릭)에 불편을 주는 것은 나쁜 것이라고 판단하기 때문입니다. 또한 canonical link의 올바른 운영을 통해 사용자의 이용이 많은 페이지임을 검색엔진에게 알리게 되어 SEO 값이 한곳으로 모이게 되어 더 나은 결과를 만들 수 있습니다.

접속 경로가 다양한 서비스 일수록 더욱 정확한 canonical link 설계가 중요합니다. 아래는 최근 오픈한 그랜드 하얏트 제주 웹사이트의 canonical link와(ko-KR이 기준 URL로 지정되어 있군요) 각 언어에 따른 리다이렉트 URL값 입니다. 하얏트의 경우 반응형 웹으로 구성되어 모바일을 별도로 처리하지 않는군요.

<link rel="canonical" href="https://www.hyatt.com/ko-KR/hotel/south-korea/grand-hyatt-jeju/cjugh"/>
        <link rel="alternate" href="https://www.hyatt.com/en-US/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="en"/>
        <link rel="alternate" href="https://www.hyatt.com/es-ES/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="es"/>
        <link rel="alternate" href="https://www.hyatt.com/fr-FR/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="fr"/>
        <link rel="alternate" href="https://www.hyatt.com/ja-JP/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="ja"/>
        <link rel="alternate" href="https://www.hyatt.com/ko-KR/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="ko"/>
        <link rel="alternate" href="https://www.hyatt.com/pt-PT/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="pt"/>
        <link rel="alternate" href="https://www.hyatt.com/ru-RU/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="ru"/>
        <link rel="alternate" href="https://www.hyatt.com/de-DE/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="de"/>
        <link rel="alternate" href="https://www.hyatt.com/zh-CN/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="zh-hans"/>    
        <link rel="alternate" href="https://www.hyatt.com/zh-HK/hotel/south-korea/grand-hyatt-jeju/cjugh" hreflang="zh-hant"/>    

IE의 시대가 저물고 크롬 브라우저를 필두로 하여 파이어폭스, 마이크로소프트 엣지까지 탭 브라우징이 기본이 된 시대에 canonical link 만큼은 꼭 설계하여 반영하여야 합니다.

  1. 웹에서는 https://로 시작하는 전체 경로,파일의 경우 Root부터 시작하는 전체 디렉토리명을 이야기한다.

댓글을 남겨주시거나 메일을 부탁드립니다.