쇼핑몰이나 블로그를 운영하면서 파라미터(?sort=desc, ?page=1)나 www 여부에 따라 동일한 페이지가 서로 다른 URL로 접속되는 현상을 경험해봤을까?
다만 대부분의 개발자들은 이러한 중복 URL이 검색엔진 크롤러의 평가를 분산시키고 색인 누락을 일으키는 정확한 원인이나 해결책을 모르는 경우가 많다.
이번에는 Canonical 태그(대표 URL)가 정확히 뭔지, 왜 필요한지, 그리고 실무 백엔드 환경에서 어떻게 정확히 적용하는지 완벽하게 정리해서 소개하겠다.

 

1단계. Canonical 태그란 무엇인가?

Canonical 태그는 검색엔진(구글, 네이버 등)에게 "동일하거나 매우 유사한 콘텐츠를 담은 여러 URL 중에서 이 URL이 진짜 대표(Standard) 페이지다"라고 알려주는 HTML 요소다.
웹 서버 관점에서는 URL 파라미터나 접속 방식에 따라 유일한 콘텐츠에 접근하는 길이 여러 개 생길 수밖에 없다. 이때 대표 URL을 지정하지 않으면 검색엔진은 어떤 URL을 검색 결과에 노출해야 할지 혼란을 겪게 된다.

 

실무에서 자주 발생하는 중복 URL 예시는 다음과 같다.

접속 형태 실제 URL 예시 문제점
www / 비-www https://example.com vs https://www.example.com 동일 페이지이나 다른 사이트로 인식되어 점수 분산
프로토콜 (HTTP/HTTPS) http://example.com vs https://example.com 보안 및 색인 상태 불일치 발생
정렬 및 정제 파라미터 https://example.com/products?sort=price_asc 동일 상품 목록이지만 URL이 다름
마케팅 추적 파라미터 https://example.com/item?utm_source=facebook 동일 콘텐츠에 수많은 유입 파라미터 중복 생성

 

2단계. Canonical 태그 설정 상세 방법

Canonical 태그를 적용하는 대표적인 두 가지 방식이 있다. 일반적인 HTML 문서에서는 `` 내부에 선언하며, PDF 파일이나 비-HTML 문서의 경우 HTTP 응답 헤더로 전송한다.

 

방법 1: HTML <head> 선언 방식

가장 보편적인 방법으로, 웹 페이지의 `` 영역 안에 `rel="canonical"` 속성을 가진 `` 태그를 삽입하는 방식이다.

<head>
  <link rel="canonical" href="https://example.com/category/shoes" />
</head>

 

방법 2: HTTP 응답 헤더 선언 방식

이미지나 PDF 문서처럼 HTML 코드를 직접 수정할 수 없는 파일은 웹 서버(Nginx, Apache)나 백엔드 코드에서 `Link` 헤더를 통해 전달할 수 있다.

Link: <https://example.com/downloads/manual.pdf>; rel="canonical"

 

3단계. 실전 예제 및 코드 작성

다만 대부분의 개발자들은 Canonical 태그의 href 값에 상대 경로를 넣거나, 현재 접속한 URL을 그대로 서버에서 동적으로 렌더링해 버리는 실수를 저지른다.

 

실무 백엔드 예제 (PHP)

✗ 잘못된 코드 (상대 경로 사용 및 추적 파라미터가 포함된 현재 URL을 그대로 출력)

<!-- 잘못된 예시: 상대 경로를 쓰거나 요청된 GET 파라미터를 그대로 노출 -->
<link rel="canonical" href="<?php echo $_SERVER['REQUEST_URI']; ?>" />

왜 안 되는가: 상대 경로(`/category/shoes`)를 쓰면 검색엔진이 도메인을 오해할 수 있으며, `$_SERVER['REQUEST_URI']`를 바로 쓰면 `?utm_source=facebook` 같은 중복 파라미터까지 통째로 대표 URL로 등록된다.

 

✓ 올바른 코드 (도메인을 포함한 절대 경로 지정 + 불필요한 파라미터 제거)

<?php
// 올바른 예시: 호스트 명시 및 핵심 경로(Path)만 추출하여 대표 URL 작성
$protocol = 'https://';
$host = 'example.com';
$cleanPath = parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH);

// 필요시 유효한 필수 파라미터만 선별하여 결합 가능
$canonicalUrl = $protocol . $host . $cleanPath;
?>
<link rel="canonical" href="<?php echo htmlspecialchars($canonicalUrl, ENT_QUOTES, 'UTF-8'); ?>" />

왜 이게 맞는가: 항상 `https://` 도메인이 포함된 절대 경로를 생성하며, `parse_url()`을 통해 마케팅 및 정렬용 Query String을 깔끔하게 제거한 표준 URL을 검색엔진에 전달한다.

 

결과/출력값 확인 (HTML Source):

<!-- 접속 URL: https://example.com/category/shoes?sort=asc&utm_source=google -->
<link rel="canonical" href="https://example.com/category/shoes" />

 

4단계. 주의사항 및 흔한 실수

Canonical 태그를 잘못 설정하면 오히려 주요 웹 페이지 전체가 검색엔진 색인에서 증발하는 대참사가 발생할 수 있다.

 

  • 상대 경로 작성: `href="/shoes"`와 같이 선언하면 검색엔진 수집 로봇이 도메인 해석 시 오류를 일으킬 수 있으므로 반드시 `https://`가 포함된 절대 경로를 사용해야 한다.
  • 404 에러 및 리다이렉트 페이지 지정: 존재하지 않는 페이지나 301 리다이렉트 대상 URL을 Canonical 주소로 설정해서는 안 된다.
  • 모든 페이지를 메인 페이지로 지정: 사이트 내 모든 카테고리/상세 페이지의 Canonical URL을 메인(`https://example.com/`)으로 일괄 지정하면 상세 페이지들이 전부 검색 색인에서 삭제된다.
  • noindex 태그와의 동시 사용: ``와 Canonical 태그를 함께 사용하면 검색엔진 모순으로 충돌이 발생한다. 색인 제외 목적이라면 noindex만 사용해야 한다.

 

5단계. 마무리 및 요약

중복 URL 관리는 검색엔진 최적화(SEO)의 가장 기본적인 뼈대이자 핵심이다.
불필요한 크롤링 예산 낭비를 막고 검색 순위 평가 점수(Link Juice)를 하나의 주소로 집중시키는 백엔드 설계가 반드시 병행되어야 한다.

 

Canonical 태그는 검색엔진에게 웹사이트의 정확한 주소를 제시하는 안내표지판이다. 개발 단계에서 소홀히 하기 쉬운 절대 경로 설정과 파라미터 정제 습관이 모여서 사이트 전체의 검색 노출 품질을 크게 끌어올린다는 점을 잊지 말자. 이 글의 실무 PHP 코드 패턴을 참고해 본인의 웹 서버 환경에 맞게 대표 URL 라우팅을 점검하면, 중복 색인 이슈 없는 깨끗한 SEO 구조를 완성할 수 있을 것이다.