사이트 검색 결과 순위를 높여줄 '타이틀 태그' 작성법
UX 디자이너와 기획자, 마케터가 반드시 기억해야 할 SEO의 기본
안녕하세요 뷰저블입니다. 오늘은 여러분이 디자인하고 기획한 웹사이트를, 어떻게 하면 검색 결과에 높은 순위로 나타낼 수 있을지 직접적인 실무 노하우를 알려드리고자 합니다. 보통 이러한 작업을 '검색 엔진 최적화(SEO, Search Engine Optimizatino)'이라고 부릅니다. 열심히 만든 사이트임에도 불구하고 사용자가 아무리 검색해도 나오지 않는다면 어떨까요? 방문하는 사용자가 없으니 사용자 행동도 제대로 분석할 수 없을 것입니다.
SEO를 시작하기 전 알아두어야 할 기본적인 지식
SEO를 위한 다양한 노하우가 있지만 오늘은 그중에서도 타이틀 태그의 중요성에 대해 설명드리고자 합니다.
SEO를 위해서는 기본적인 HTML(HyperText Markup Language), CSS(Cascading Style Sheets) 등의 지식이 필요하게 됩니다. HTML은 웹 사이트의 의미 정보들을 기술하기 위한 언어이며, CSS는 웹사이트 디자인과 정보들을 기술하기 위한 언어를 의미합니다. HTML과 CSS는 사실 거의 다른 영역이지만 오늘은 쉬운 설명을 위해 이 둘을 합쳐 HTML로 부르겠습니다.
항공권 및 호텔 예약 서비스인 '익스피디아'를 예로 들어보겠습니다. https://www.expedia.co.kr/
익스피디아 사이트의 HTML (소스) 파일위 이미지는 익스피디아 사이트의 HTML 파일입니다. HTML은 여러 문장으로 구성되어 있는데요 위에 적힌 문장이 이미지라면 사이트에도 해당 이미지가, 문장만 적혀있다면 실제 사이트에도 문장만 나타나게 될 것입니다. 이 HTML에 다양한 '태그'라는 정보를 삽입하여 레이아웃과 폰트 색상, 폰트 사이즈 등 여러 정보가 더해져 우리가 흔히 상상하는 익스피디아 웹 사이트가 완성됩니다.
익스피디아 사이트 메인 페이지그런데 이 HTML 파일에는 실제로 페이지에는 표기되지 않는 '메타 정보'라는 것이 존재합니다. 메타 정보는 이 웹 페이지가 어떤 내용을 담고 있는가?를 의미합니다. 메타 정보에는 보통 타이틀, 디스크립션, 키워드가 있으며 이 중에서도 오늘 '타이틀(title) 태그'를 설명드리겠습니다.
SEO에서 가장 중요한 요소, 타이틀 태그
타이틀 태그는 SEO에서 가장 중요합니다. 웹 페이지 '윈도우 타이틀'로 표기되는 영역이며, 검색엔진 검색 결과 '링크 타이틀'이 되기 때문입니다. 또한, 페이지의 역할 즉, 해당 페이지가 어떤 정보를 담고 있는지를 설명하는 공간입니다. 그렇기 때문에 검색엔진이 가장 중요하게 여기는 공긴이기도 합니다. 단순히 사이트명으로는 '어떤 정보'를 담고 있는지를 파악하기 어렵기 때문에 '타깃 키워드'와 함께 작성해야 합니다.
구글에서 할인 항공권이라고 검색했을 떄 나타나는 익스피디아의 링크 타이틀
웹 페이지 윈도우 타이틀로써 표기되기도 하는 타이틀 태그익스피디아는 할인항공권, 특가 항공권 비교&예약이라는 키워드를 삽입해두었습니다. 아래 이미지에서, 경쟁사 스카이 스캐너는 '항공권, 호텔, 렌터카 최저가 비교 예약'이라는 키워드를 삽입하여 어떤 성격의 사이트인지, 어떤 정보를 담고 있는지를 설명합니다.
익스피디아의 경쟁사인 스카이스캐너 타이틀 태그에 적힌 '타깃 키워드'가장 먼저 사용자의 클릭을 유도하는 영역인 타이틀 태그
가장 먼저 사용자의 클릭을 유도하는 영역이 이 타이틀 태그 이기도 합니다. 씨트립이라는 항공권 예약 사이트에서는 '55% 할인'이라는 '서브 키워드'이자 '카피 문구'를 삽입하여 사용자의 클릭을 유도하고 있습니다. 검색 결과 화면에서 클릭수는 해당 사이트의 방문자수에 직접적인 영향을 미칠 뿐만 아니라, 검색순위를 결정짓는 매우 중요한 요소 중 하나로 추정되고 있기 때문에 더 많이 클릭을 유도할 수 있어야 합니다.
씨트립에서는 '최저가 항공권'으로 타깃 키워드를 작성하고 있습니다.실무자를 위한 구체적인 '타이틀 태그' 작성법
타이틀 태그의 구성 항목과 작성 순서
그럼 실제로 타이틀 태그를 작성해봅시다. 타이틀 태그에는 반드시 3가지 항목이 오도록 합니다.
'타깃 키워드', '사이트명', '카피 문구(또는 서브 키워드)'
그리고 순서대로 작성할 것을 권장드립니다. 두 가지 선택지가 있습니다.
- 타깃 키워드, 사이트명, 카피 문구(서브 키워드)
- 타깃 키워드, 카피 문구(서브 키워드), 사이트명
타깃 키워드와 함께 '서브 키워드'를 삽입한다면 서브 키워드가 검색될 때 더욱 상위에 집계될 수 있습니다. 중간 또는 마지막 항목인 '사이트명'은 어떤 서비스 사이트인지를 사용자가 파악하기 위해 반드시 누락해서는 안되는 항목입니다. 타깃 키워드와 카피문구가 없더라도 사이트명은 있어야 합니다.
이 타이틀 태그는 너무 길면 검색 결과가 '...'로 표기될 수 있어 지양해야 하며, 보통 한국어 띄어쓰기 포함 30자 내외로 작성하는 것을 권장합니다.
'사이트명, 타깃 키워드, 카피 문구(서브 키워드)' 순으로도 작성할 수 있지만 사용자가 여러 개의 탭을 켜두고 사이트를 탐색하는 '커머스'나 '여행사 사이트'에서는 사용자 경험 측면에서 권장하지 않습니다. 꼭 작성해야만 한다면 '메인'페이지 정도를 권장합니다. 왜일까요?
'사이트명, 타깃 키워드, 카피 문구' 순으로 작성하면 브라우저 상에 여러 개의 웹 페이지를 탭으로 띄워놓았을 때 어떤 사이트인지 바로 알 수 있다는 장점이 있습니다. 위 이미지의 스카이스캐너를 예로 들어볼까요? 뒤에 두 사이트는 '익스피디아 사이트'인지 바로 알아차리기 어렵지만 뒤에 '스카이스캐너'는 사이트명이 먼저 오기 때문에 스카이스캐너 사이트인지 바로 알아차릴 수 있었습니다.
반면 동일 사이트의 여러 개의 웹 페이지가 띄워져 있다면 해당 페이지가 어떤 내용을 담고 있는지, 사용자는 바로 구분하기 어려워집니다. 사이트명이 반복적으로 표기되어 브라우저 탭 상에서 어떤 페이지였는지 알기 위해서는 사용자가 하나씩 클릭해 보야아하는 단점이 존재하는 것이지요.
굿 케이스 : 익스피디아의 타이틀 태그 작성 예시
익스피디아 메인 페이지의 타이틀 태그 (드래그 영역)
익스피디아 마감 특가 페이지의 타이틀 태그 (드래그 영역)
익스피디아 렌터카 페이지의 타이틀 태그 (드래그 영역)익스피디아는 페이지마다 타이틀 태그가 모두 다릅니다. 이렇게 타이틀 태그를 다르게 작성해야 하는 이유는 웹페이지마다 모두 동일하다면, 검색엔진이 어떤 웹 페이지를 검색 순위 상위로 올릴지를 판단하기 어렵기 때문입니다. 설사 동일한 페이지들이 여러개 검색엔진에 게재된다할지라도, 사용자는 어떤 페이지를 클릭해야 좋을지 쉽게 판단이 서질 않을 것입니다.
익스피디아 메인의 경우 타깃 키워드인 할인항공권과 특가 항공권을 삽입하였고 서브 키워드인 비교 & 예약 (카피 문구)를 게재하였습니다. 그 뒤에 사이트명인 익스피디아를 기재하였습니다. '할인항공권 비교', '할인항공권 예약', '항공권 예약', '항공권 비교' 등으로 검색하여도 서브 키워드인 '비교'와 '예약'이 타이틀 태그 안에 게재되어 있기 때문에 익스피디아 사이트가 검색어 상위권을 차지하였습니다.
항공권 비교라는 검색어를 검색했을 때의 구글 검색 결과 1위는 익스피디아 사이트입니다.마감 특가 페이지는 어떨까요? 아래 예시 이미지와 함께 살펴봅시다.
마감 특가 페이지의 검색 결과 링크 화면
마감 특가 페이지의 타이틀 태그 (드래그 영역)마감 특가 페이지의 타이틀 태그는 '마감 특가 | 호텔 & 항공+호텔 | Expedia.co.kr | 익스피디아 - 호텔 예약'입니다. 구글에 '항공 마감 특가'라는 키워드를 검색했을 때 해당 페이지가 가장 상위권에 집계되었습니다.
아쉬운 케이스 : 국내 여행사 사이트 예시
이번 글을 작성하며 국내 여행사의 타이틀 태그를 살펴보았는데요, 아쉽게도 모두 페이지마다 타이틀 태그가 동일하게 나타났습니다. 롯데관광은 '메인'과 '해외 패키지' 페이지의 경우 '타깃 키워드'를 별도로 마련하고 앞단에 두어 SEO뿐만 아니라 UX까지도 향상하였네요. 내가 지금 보는 페이지가 메인인지, 해외 패키지인지 바로 알 수 있죠. 하지만 역시 다른 페이지는 모두 타이틀 태그가 동일하여 아쉬웠습니다.
반면 스카이스캐너는 페이지 별 타이틀 태그가 모두 다릅니다.
국내 여행사 또한 타이틀 태그를 페이지 별로 모두 다르게 구성한다면 지금보다 훨씬 더 SEO 순위가 올라갈 수 있을 뿐만 아니라, 사용자의 웹 페이지 탐색 경험에도 긍정적인 영향을 미칠 것으로 기대합니다.
타이틀 태그를 개선하였다면
뷰저블과 웹마스터 도구로 성과를 추적하고 개선하세요.
타이틀 태그를 개선하였나요? 그럼 뷰저블의 애널리틱스로 성과를 추적하세요. 뷰저블에서는 '애널리틱스' 메뉴에서 사용자의 행동 흐름과 유입 채널 정보를 확인할 수 있습니다.
뷰저블 애널리틱스의 사용자 행동 흐름 기능특히 사용자 행동 흐름을 통해 검색엔진을 통해 들어오는 사용자의 유입이 어떻게 변화하는지 성과를 추적할 수 있습니다. 기간 별 유입수가 늘어나는지를 추적해보세요. 다음으로는 구글의 서치 콘솔같은 웹마스터 도구에서 사용자가 어떤 키워드를 통해 웹 페이지에 유입하는지를 추적하세요.
출처 : https://webmasters.googleblog.com/2018/01/introducing-new-search-console.html이를 통해 타이틀 태그를 지속적으로 개선하며 검색순위를 높여나가도록 하세요. 보통 구글의 서치 콘솔과 같은 웹마스터 도구에는 SEO를 위한 기본적인 통계를 제공합니다. 예시로 서치콘솔에서는 클릭수와 노출수, 평균 CTR(Click-through rate), 평균 게재순위는 물론 검색어수, 국가, 기기, 상세 검색어까지 제공합니다. 노출수 대비 사용자의 실제 클릭수가 어떻게 변화하는지, 게재순위는 어떻게 달라지는지를 추적할 수 있게 됩니다.
여러분의 웹 사이트 타이틀 태그는 어떠한가요? 지금 바로 뷰저블과 개선해보는 것은 어떨까요?
참고하면 좋은 사이트
뷰저블을 통해 서비스 내 사용자 경험(UX)에 영향 끼치는 문제점을 발견하세요.
뷰저블이라면 그 많은 문제점들을 '새로운 비즈니스 기회'로 바꿔드릴 수 있습니다.
경쟁사는 이미 시작했습니다!
뷰저블 홈페이지
https://www.beusable.net/
