구글 검색 엔진 최적화, 티스토리 블로그 캐노니컬(Canonical) 태그와 모바일 친화적 페이지의 상관관계

오늘 글은 구글 검색 엔진 최적화(SEO) 중에서도 가장 중요한 캐노니컬 태그에 대해 설명하도록 하겠습니다. 구글 검색 최적화 글을 써야하나 말아야 하나 정말 오랫동안 고민했었는데요. 결국 이렇게 하나 하나 풀어 놓게 됩니다. 참고로 제목이 너무 긴데 댕강 쳐낼 단어가 없..


며칠 되었는데요. 티스토리 블로거분이 2018년도 말에 작성한 검색 엔진 최적화 구글 서치 콘솔 모바일 편의성 문제 해결 글에 짧은 질문 댓글을 남겼습니다. 블로그에 글이 100개 넘는다. 모바일 편의성 오류 0이고, 유효는 2 밖에 되지 않는다. 이유가 무엇이냐는 댓글이었는데요. 정말 간단한 문제입니다. 이 문제는 캐노니컬 태그 문제입니다. 구글 서치 콘솔의 모바일 편의성에 유효가 2로 표시되는 이유는 모바일 친화적 페이지가 딱 2개 밖에 없기 때문입니다. 구형 웹스킨 + 모바일 스킨 조합이면 모바일 편의성에 유효 갯수가 거의 없을 수 밖에 없습니다. 모바일 친화적인 페이지가 없으니 유효 갯수도 늘지 않는 것입니다. 해결 방법 정말 간단합니다. 티스토리 스킨을 모바일에 대응되는 반응형 스킨으로 변경하면 자연스럽게 캐노니컬 태그 문제도 해결되고 모바일 친화적 페이지도 늘어나게 됩니다.


티스토리 블로그에 반응형 스킨을 사용한다고 무조건 모바일 친화적 페이지가 늘어나는 것은 아닙니다. 사용하는 티스토리 반응형 스킨이 모바일에 대응(검색 엔진 최적화까지는 아니더라도 저해 요소는 없는 정도)이 되어 있어야 하고, 발행된 게시물 또한 모바일 친화성을 저해하는 요소가 포함되어 있지 않아야 합니다. 기본적으로 본문에 삽입한 사진, 동영상 등의 멀티미디어 콘텐츠가 스마트폰 화면 크기를 넘지 않아야 합니다. 텍스트 및 링크 텍스트도 스마트폰에서 불편 없이 볼 수 있을 정도의 크기이어야 합니다.


구글 검색 엔진 최적화, 캐노니컬 태그

캐노니컬 태그


구글 검색 최적화에서 절대 빼놓을 수 없는 것이 있습니다. 물론 네이버 검색 최적화에도 절대 빼놓을 수 없는 것이지만, 네이버 검색에는 통하지 않습니다. 구글 검색 최적화 작업에 필수급인 캐노니컬(Canonical) 태그라는 것이 있습니다. 301 리다이렉션과 비슷하지만 다른 조건에서 사용됩니다. 하나의 게시물 페이지는 프로토콜(http와 https), www. 유무 등에 따라 여러 개의 URL 주소를 갖게 될 수 있습니다. 여러 개의 URL 주소를 갖게된 게시물 페이지들을 캐노니컬 태그를 이용하여 하나의 게시물 URL 주소를 표준 URL(표준 페이지 혹은 원본 페이지)로 지정할 수 있습니다.


서비스형 사이트 및 서비스형 블로그의 경우에는 캐노니컬 태그 설정을 지원하지 않을 수 있습니다. 직접 캐노니컬 태그를 설정하고 싶다면 설치형 사이트/블로그를 운영해야 합니다.


티스토리 기본 도메인(예시 domainname.tistory.com)을 사용하며 숫자 형식의 주소를 사용한다면 아래와 같이 하나의 게시물에 웹 페이지와 모바일 페이지가 생성됩니다.


https://mongrinet.tistory.com/3259

https://mongrinet.tistory.com/m/3259


이 웹과 모바일 페이지에는 최소 2개이상의 동적 URL이 추가 됩니다. 아래와 같은식으로 말이죠.


https://mongrinet.tistory.com/3259?category=241334

https://mongrinet.tistory.com/m/3259?category=241334

https://mongrinet.tistory.com/3259?category=241334?category=241334

https://mongrinet.tistory.com/m/3259?category=241334?category=241334


티스토리 기본 도메인에 문자 형식의 주소를 사용한다면 아래와 같이 최소 4개의 주소가 추가 됩니다.


https://mongrinet.tistory.com/entry/Google-SEO-ink-rel-canonical

https://mongrinet.tistory.com/m/entry/Google-SEO-ink-rel-canonical

https://mongrinet.tistory.com/entry/Google-SEO-ink-rel-canonical?category=241334

https://mongrinet.tistory.com/m/entry/Google-SEO-ink-rel-canonical?category=241334?category=241334


티스토리 블로그 주소 설정 및 개인 도메인 설정


티스토리 블로그에 개인 도메인을 사용하고 있다면 게시물 주소는 2배로 늘어 나게 됩니다. https://mongrinet.tistory.com/으로 시작하는 주소 한 세트에 추가로 https://mongri.net/으로 시작하는 주소 한 세트가 생성되니 말입니다. 여기가 끝이 아닙니다. 기본 도메인은 http://mongrinet.tistory.com/으로 시작하는 한 세트의 주소도 추가로 생성됩니다. 개인 도메인을 사용하고 있다면 http://mongri.net/으로 시작하는 주소와 http://www.mongri.net/으로 시작하는 주소 두 세트가 추가로 생성됩니다.


https://mongri.net/3259

https://mongri.net/m/3259

https://mongri.net/entry/Google-SEO-ink-rel-canonical

https://mongri.net/m/entry/Google-SEO-ink-rel-canonical


https://mongri.net/3259?category=241334

https://mongri.net/m/3259?category=241334

https://mongri.net/entry/Google-SEO-ink-rel-canonical?category=241334

https://mongri.net/entry/m/Google-SEO-ink-rel-canonical?category=241334


https://mongri.net/3259?category=241334?category=241334

https://mongri.net/m/3259?category=241334?category=241334

https://mongri.net/entry/Google-SEO-ink-rel-canonical?category=241334

https://mongri.net/m/entry/Google-SEO-ink-rel-canonical?category=241334?category=241334

http://도메인/...

http://www.도메인/...


위와 같이 말이죠. 티스토리 블로그에서 개인 도메인에 문자 주소를 사용하고 있다면 어휴야 하나의 게시물이 셀 수 없을 정도로 많은 주소를 갖게 됩니다. 1개의 게시물이 최소 44개의 URL 주소를 갖게 됩니다. 최소입니다. 최소!


캐노니컬 태그 대표 URL 설정


사람 눈으로 볼 땐 다 같은 내용이니 하나의 게시물이겠구나 짐작하고 판단할 수 있겠죠. 하지만 기계는 그렇지 않습니다. 검색봇은 주소 다른 게시물들은 모두 다른 게시물로 판독합니다. 글을 발행할 때마다 원본 글 한 개 당 복사문서 43개가 생성된다면 자폭이죠. 그래서 이런 자폭을 막기 위해 티스토리에서 티스토리 블로그에 캐노니컬 태그를 적용해 주었는데요. 이 캐노니컬 태그가 검색봇에 표준 URL 주소를 알려줍니다.


티스토리 블로그의 캐노니컬 태그


티스토리 게시물의 소스 보기를 보면 헤더에 <link rel="canonical" href="https://mongri.net/entry/Google-SEO-ink-rel-canonical" /> 요런 식으로 링크 캐노니컬로 표준 URL를 규정하여 검색봇에 알려줍니다.


워드프레스, XpressEngine 등의 CMS 툴을 이용하여 사이트 혹은 블로그를 운영하고 있다면 아래의 형식으로  중복 콘텐츠들의 표준 URL을 선언할 수 있습니다.

<link rel="canonical" href="표준URL" />


티스토리 숫자 형식 게시물은 캐노니컬로 문자 주소를 표준 URL로 선언


43개 페이지에 모두 같은 링크 캐노니컬로 표준 URL를 규정하였다면 43개 페이지는 모두 다 중복 페이지다 표준 페이지 URL은 이것이다라고 콕 찝어 주는 것이죠. 이에 검색 엔진에는 캐노니컬 태그로 지정된 페이지가 색인되어야 합니다. 검색 엔진이라면 말입니다.


티스토리 블로그 모바일 친화적 페이지 문제

글 초반에 티스토리 스킨을 반응형 스킨으로 변경하면 캐노니컬 태그 문제도 해결되고 모바일 친화적 페이지가 늘어날 것이라고 했었죠. 티스토리 구형 스킨 + 티스토리 모바일 스킨 조합으로 티스토리 블로그를 운영하면 구글 서치 콘솔에서 모바일 편의성 문제가 발생합니다. 이 문제는 캐노니컬 태그 때문에 발생합니다.


티스토리 모바일 게시물은 캐노니컬로 문자 주소를 표준 URL로 선언


위에서 티스토리 블로그에서 개인 도메인에 문자 주소를 사용하고 있다면 1개의 게시물이 최소 44개의 URL 주소를 갖게된다고 알려드렸죠. 그리고 이 수 많은 중복 문서 문제를 캐노니컬 태그로 해결할 수 있다고 알려드렸고요. 캐노니컬 태그를 사용자(블로거)가 직접 선택할 수 없기 때문에 구형 웹스킨을 사용할 경우 캐노니컬 태그로 인하여 구글 서치 콘솔에서 모바일 편의성 문제가 발생합니다.


티스토리 모바일 숫자 형식의 게시물은 캐노니컬로 문자 주소를 표준 URL로 선언


모바일 스킨의 게시물에는 캐노니컬 태그로 표준 URL을 구형 웹스킨의 https://mongrinet.tistory.com/3259 혹은 https://mongrinet.tistory.com/entry/Google-SEO-ink-rel-canonical으로 선언 됩니다. 숫자 주소 형식을 사용한다면 도메인/숫자 주소 URL를 가르킬 것이고요. 문자 주소 형식을 사용한다면 도메인/문자 주소 URL을 가르킵니다. 모바일 스킨의 https://mongrinet.tistory.com/m/3259 게시물이 캐노니컬 태그로 표준 URL을 https://mongrinet.tistory.com/3259로 선언하게 되는 것이죠. 모바일 스킨의 페이지에서 웹페이지(티스토리 구형 스킨)를 표준 URL이라고 콕집어 말하고 있으니 검색 엔진은 https://mongrinet.tistory.com/3259을 색인할 수 밖에 없습니다. 검색 엔진은 색인 유무만 판단하죠.


위에서 말했지만 모바일 친화적 페이지로 판정 받으려면 기본적으로 모바일 친화성을 저해하는 요소가 포함되어 있지 않아야 합니다. 하지만 캐노니컬 태그로 표준 URL로 선언된 페이지는 티스토리 구형 스킨을 사용하는 웹페이지이기에 모바일 친화적 페이지로 판정 받을 수 없습니다. 쉽게 그냥 웹페이지죠. 모바일을 지원하지 않는 웹사이트가 되는 것이죠. 참고로 티스토리 블로그의 일부 페이지에는 캐노니컬 태그가 명확하게 선언되지 않았습니다. 캐노니컬 태그가 명확하게 선언되지 않은 카테고리(도메인/m/category) 등의 페이지는 모바일 친화적 페이지로 판정될 수 있습니다. 구형 스킨을 사용하여 발생한 구글 서치 콘솔의 모바일 친화적 페이지 문제는 반응형 스킨으로 변경하여 해결을 도모할 수 있습니다. 100% 해결 된다고 보장할 수 없기에 '도모'인 것입니다. 스킨 및 게시물에 모바일 친화성을 저해하는 요소가 포함되어 있지 않을 경우에는 반응형 스킨으로 변경해주면 차츰 모바일 친화적 페이지 숫자가 늘어날 것입니다. 다만 색인인 이루어져야만 모바일 친화성 여부도 가려지기에 최우선적으로 색인 생성 저해 요소가 절대 없어야 합니다.


너무 당연하지만 노파심에 덧붙이자면, 콘텐츠(글)가 색인에 반영 안되어 있으면 당연히 모바일 사용 편의성 여부도 확인할 수 없습니다. 색인 및 모바일 친화적인 페이지 여부는 구글 서치 콘솔에서 개별 콘텐츠 주소로 URL 검사하면 확인할 수 있습니다. 색인에 반영된 컨텐츠 중 모바일 친화적인 페이지만 유효 페이지로 잡힙니다. 오류로 표시되지 않더라도 스킨 혹은 콘텐츠에 모바일 친화성을 저해하는 요소가 포함되어 있다면 모바일 친화적인 페이지로 판정되지 않습니다.


네이버 검색에게 캐노니컬 태그 표준 URL이란

네이버 통합 검색 결과의 티스토리 기본 도메인 주소로된 색인된 티스토리 게시물


바다야크 블로그님이 얼마 전에 문자 주소로 사용하던 게시물 주소 형식을 숫자 주소로 변경하였습니다. 화딱지나서 홧김에 바꾼 것이죠. 개인 도메인 연결한 것도 크게 후회하고 계십니다. 후회만 하면 다행이죠. 열불 날 겁니다. 그럴수밖에요. 몇 년째 저렇게 티스토리 기본 도메인의 게시물 URL을 색인하고 있으니 환장하죠. 개인 도메인은 거꾸로 웹사이트에 색인되고 있는 실정입니다. 도메인 이력 조회하니 2011년 11월에 등록한 도메인입니다. 무려 7년동안 저 문제가 해결 안되었습니다.


네 그렇습니다. 캐노니컬 태그, 대표 URL, 표준 URL 뭐라 부르던 네이버 검색에게는 그저 씹어 먹는 과자 같은 것일뿐입니다. 대표이자 표준인 개인 도메인은 물론이고, 대표 URL은 과감하게 씹어 먹습니다.


네이버 검색 웹 표준 최적화 기본 가이드


네이버가 공개한 웹 표준 최적화 기본 가이드를 살펴보면 캐노니컬 태그에 대해 설명이 되어 있습니다. 그것도 최우선적으로 설명 되어 있습니다. 캐노니컬 태그에 대해 설명만 되어 있을뿐 자신들이 내세우고 있는 가이드 조차도 지키지 않고 있습니다. 지켰다면 저 위의 검색 결과 페이지 같은 멍텅구리한 검색 결과 페이지는 볼 수 없었겠죠.


티스토리 모바일웹 자동 연결을 사용하지 않아도 직접 모바일 주소로 접속할 경우 모바일웹으로 접속 됩니다


물론 다음 검색은 더욱 더 심합니다. 다음 검색은 표준 URL 자체를 거부합니다. 10년 동안 다음 검색 결과에서 티스토리 문자 주소로 색인된 것을 보질 못했네요. 다음은 아니 카카오는 자기들 멋대로 게시물 URL도 만들어서 사용하죠. 끝~


© 꿈속으로(mongri.net), 무단전재 및 재배포 금지. 공유와 직접 링크를 선호합니다.
[저작권 규약, 운영 원칙 및 이용자 준수 사항]