Hreflang: 정의와 구현 방법
우리는 제품/서비스로 시장을 지배하고 있고 국제적으로 확장할 준비를 하고 있습니다. 프로세스는 간단해 보이지만 제대로 하고 원하는 결과를 얻으려면 몇 가지 디테일에 주의해야 합니다. 이 가이드에서 국제 SEO 전략을 위한 Hreflang Tags를 구현하는 방법을 보실 것입니다.
Hreflang 태그란 무엇인가요?
Hreflang 태그는 페이지의 헤더에 나타나는 코드 조각으로, Google에 우리 페이지의 다른 언어 버전을 알리는 목적이 있습니다.
명백해 보이지만 회사가 콘텐츠를 번역한 다음 hreflang 태그를 추가하는 것을 잊는 경우가 많고, 그러면 일반적으로 두 가지 시나리오가 발생합니다:
- 가장 좋은 경우 Google이 콘텐츠를 크롤하지 않습니다.
- 최악의 경우 Google이 콘텐츠를 크롤하고 중복 콘텐츠임을 보고 검색 결과에 표시하지 않을 뿐만 아니라 웹사이트의 전체 "권위"를 감소시킵니다.
Google의 말로:
"페이지의 지역화된 버전은 메인 콘텐츠가 번역되지 않은 경우에만 중복으로 간주됩니다."
구현 방법
Google이 공식 가이드에서 보고하듯이, 페이지가 다른 언어의 대안 버전을 가지고 있음을 표시하는 태그를 구현하는 방법은 현재 세 가지입니다:
HTML 태그 (권장)
페이지가 다른 언어의 등가물을 가지고 있음을 표시하는 가장 일반적인 방법 중 하나는 헤더의 HTML 태그입니다:
<link rel="alternate" hreflang="language_code" href="page_url" />
영국, 미국 및 독일의 다른 국가와 언어에서도 사용 가능한 메인 웹사이트(영어)가 있다고 상상해봅시다. 이 경우 각 페이지의 헤더에 다음 코드를 추가해야 합니다:
<head> <title>Widgets, Inc</title> <link rel="alternate" hreflang="en-gb" href="http://en-gb.example.com/page.html" /> <link rel="alternate" hreflang="en-us" href="http://en-us.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> <link rel="alternate" hreflang="de" href="http://de.example.com/page.html" /> <link rel="alternate" hreflang="x-default" href="http://www.example.com/" /> </head>
이런 식으로 다른 페이지가 중복이 아니라 다른 언어로 된 웹사이트의 번역임을 검색 엔진에 알릴 수 있습니다.
HTTP Headers
HTML이 아닌 문서나 기타 파일의 다른 언어 버전을 표시하고자 한다면 HTTP headers를 사용할 수 있습니다:
다음 경우는 영어, 스위스 사용자를 위한 독일어, 그리고 독일어를 사용하는 모든 사용자를 위한 PDF 문서입니다.
Link:
<http://example.com/file.pdf>; rel="alternate"; hreflang="en", <http://de-ch.example.com/file.pdf>; rel="alternate"; hreflang="de-ch", <http://de.example.com/file.pdf>; rel="alternate"; hreflang="de"
Sitemap
많은 웹사이트가 시간 경과에 따라 사용해온 또 다른 방법은 Sitemap을 통해 국제 버전을 표시하는 것입니다. 이는 기술적 수준에서 훨씬 더 복잡한 방법이며, 일부 페이지를 누락하기 쉬워 오류에 더 취약하다는 점에 유의해야 합니다.
페이지가 하나 있는 sitemap의 예시:
<?xml version="1.0" encoding="UTF-8"?> <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml"> <url> <loc>http://www.example.com/english/page.html</loc> <xhtml:link rel="alternate" hreflang="de" href="http://www.example.com/deutsch/page.html"/> <xhtml:link rel="alternate" hreflang="de-ch" href="http://www.example.com/schweiz-deutsch/page.html"/> <xhtml:link rel="alternate" hreflang="en" href="http://www.example.com/english/page.html"/> </url>
도구: 이 Chrome 확장 프로그램으로 구현을 검증할 수 있습니다. 그래도 100% 확인하기 위해 코드에서 수동으로 확인하는 것을 잊지 마세요.
이 확장 프로그램으로 hreflang 태그 구현을 확인할 수 있습니다.
언어 및 지역 코드
국제 데이터 마크업 주제를 보았으니, 국제 SEO 프로세스에서 가장 흥미로운 주제 중 하나로 넘어갑시다. 이는 언어 및 지역 코드입니다. 최근까지 이 주제에 대한 정보가 풍부하지 않았고, 언어와 국가의 마크업에서 오류를 피하는 것이 결코 쉽지 않았습니다.
각 국가와 각 언어는 그 자체로 하나의 세계입니다. 모두 차이, 특수성, 문화, 가치가 있으며… 그래서 많은 비즈니스가 가능한 한 가장 네이티브한 방식으로 콘텐츠를 제공하기 위해 그것에 적응합니다. 명확한 예는 스페인에서 사용되는 스페인어와 멕시코에서 사용되는 스페인어 사이에 발생합니다. 많은 표현을 공유하지만 전혀 비슷하지 않은 다른 표현이 있고, 각 국가의 사용자는 자신에게 가장 친숙한 버전을 찾는 것을 좋아합니다.
Google은 hreflang 태그에 언어 및 지역 코드를 추가할 수 있는 가능성을 제공합니다.
예를 들어:
- de: 이 콘텐츠는 지역에 관계없이 독일어를 사용하는 사용자를 위한 것입니다.
- es-MX: 이 콘텐츠는 멕시코 출신이고 스페인어를 사용하는 사용자를 위한 것입니다.
- en-GB: 이 콘텐츠는 영국에서 영어를 사용하는 사용자를 위한 것입니다.
Chess.com(우리의 가장 큰 클라이언트 중 하나)에 사용 가능한 일부 언어(총 +40)와 함께 hreflang 태그의 예시.
언어가 사용될 수 있는 모든 국가를 표시하지 않으면 어떻게 될까요?
논리적으로 이를 추가하는 것은 불가능합니다. 그래서 hreflang="x-default" 태그가 있으며, 이는 사용자의 브라우저 구성이 우리가 표시한 언어나 지역 중 어느 것과도 일치하지 않을 때 이 버전을 사용자에게 제공할 수 있게 해줍니다.
<link rel="alternate" href="http://example.com/" hreflang="x-default" />
일반적인 오류
쉽게 들리죠? 유일한 중요한 디테일은 Google이 구현에 상당히 까다롭다는 것입니다. 글자 하나라도 실수하거나 링크 하나를 빠뜨리면 오류를 반환하고 마크업을 받아들이지 않을 것입니다. 아래에서 자주 발생하는 가장 일반적인 오류 중 일부(그리고 우리 자신의 경험에서 일부)를 볼 수 있습니다:
상호 링크 잊기
페이지 A에 페이지 B로의 hreflang 링크가 있지만 후자가 페이지 A로 다른 hreflang 링크를 반환하지 않으면, Google은 연관성을 만들지 않으며 따라서 그러한 페이지를 중복으로 계속 감지할 것입니다.
지역 또는 국가 코드 변경
URL에서는 영국에 대해 uk, gb 또는 다른 변형을 사용하는 등 원하는 코드를 사용할 수 있는 유연성이 있지만, hreflang 태그에서는 그렇지 않습니다. 올바른 en-GB 대신 uk를 사용하면 Google이 정보를 해석할 수 없으며 따라서 구현을 검증하지 않을 것입니다.
이 경우 항상 올바른 형식을 사용하기 위해 다음 형식을 따라야 합니다:
- ISO 639-1
- ISO 3166-1 Alpha 2 (선택 사항)
웹사이트의 hreflang 태그 분석
몇 주 전까지만 해도 Google Search Console은 hreflang 구현의 검증 및 오류에 대한 자세한 보고서를 보여주었습니다. 그러나 새 인터페이스의 출시와 함께 이 기능은 구식이 되고 있으며 곧 더 이상 사용할 수 없게 될 것입니다.
이 경우 이 주제에 작업할 수 있는 수십 개의 SEO 도구가 인터넷에 있음에도 불구하고, 우리 관점에서 이 프로세스를 빠르고 쉽게 분석할 수 있는 #1 도구는 의심할 여지 없이 Screaming Frog입니다. 마크업이 감지된 모든 url을 알려줄 뿐만 아니라 오류가 있으면 분류하고 검증할 수 있도록 정확히 어떤 유형의 오류가 있는지 알려줍니다.
Screaming Frog가 수행한 Hreflang 분석의 모든 정보를 스키마 형식으로 보여주는 화면.
성공 사례
대부분의 SEO 행동은 첫 결과를 보여주기 전에 약간의 시간이 필요하지만, hreflang 태그는 가능한 프로젝트에서 가능한 한 빨리 구현해야 하는 quick-wins 중 하나임이 분명합니다. 이것의 가장 명확한 SEO 성공 사례 중 하나는 우리 클라이언트 중 하나인 ChessKid.com이었습니다. 거의 20개 언어로 번역된 웹사이트였습니다. 문제는? hreflang이 구현되지 않았고 또한 언어 변경이 로그인 뒤에 숨겨져 있어 국제 버전이 완전히 접근 불가능했습니다.
우리가 무엇을 했나요?
- 푸터에 언어가 있는 드롭다운을 만들었습니다.
- 필요한 모든 페이지에 hreflang 태그를 추가했습니다.
결과는?
ChessKid.com의 Hreflang 태그 구현 결과
질문이 있으신가요? 비즈니스에 hreflang 태그를 구현하는 데 도움이 필요하신가요? 기쁘게 도와드리겠습니다!
참고 자료
저자: David Kaufmann
지난 10년 넘게 SEO에 완전히 빠져 살아왔습니다 — 솔직히 다른 길을 가고 싶지도 않았어요.
제 커리어가 한 단계 도약한 것은 인터넷 전체에서 방문자가 가장 많은 100개 사이트 중 하나인 Chess.com에서 시니어 SEO 스페셜리스트로 일했을 때입니다. 수백만 페이지, 수십 개 언어, 그리고 가장 경쟁이 치열한 SERP 중 하나에서 일한 경험은 어떤 강의나 자격증도 가르쳐주지 못하는 것들을 알려주었습니다. 이 경험은 진정으로 훌륭한 SEO가 어떤 모습이어야 하는지에 대한 제 관점을 완전히 바꾸어 놓았고, 이후 제가 만든 모든 것의 기초가 되었습니다.
이 경험을 바탕으로 SEO Alive를 창업했습니다 — 오가닉 성장에 진심인 브랜드를 위한 에이전시입니다. 우리는 대시보드와 월간 리포트를 파는 것이 목표가 아닙니다. 실제로 결과를 움직이는 전략을 만들어, 클래식 SEO의 최고와 흥미진진한 새로운 Generative Engine Optimization(GEO) 세계를 결합합니다 — 여러분의 브랜드가 Google의 파란 링크뿐 아니라 ChatGPT, Perplexity, Google AI Overviews가 매일 수백만 명에게 전달하는 AI 생성 답변 안에도 노출되도록 합니다.
그리고 이 두 세계를 제대로 다루는 도구를 찾을 수 없어서 직접 만들었습니다 — SEOcrawl입니다. 랭킹, 기술 감사, 백링크 모니터링, 크롤 건전성, AI 브랜드 가시성 추적을 한 곳에서 통합하는 엔터프라이즈 SEO 인텔리전스 플랫폼이죠. 항상 존재하기를 바랐던 바로 그 플랫폼입니다.
이 저자의 더 많은 콘텐츠를 만나보세요
