정책복지 및 일상에 도움되는 정보

[티스토리 SEO]2개 이상의 Meta Description 태그 문제 해결 방법

LeejiiLab 2022. 9. 5. 14:07

▶ 검색엔진 최적화를 위한 문제 해결 중복된 meta를 제거하자.


우리가 대표적으로 이용하는 검색엔진들은 Naver, Google, Daum, Bing등이 있으며 궁금증에 대한 답을 얻기 위해 엔진들에게 우리의 질문을 던집니다. 그리하면 우리의 질문에 대한 해답을 주기위하여 검색을 수행한 엔진은 자신이 가지고 있는 정보를 사람들이 찾기 쉽도록 만들기 위해 할 수 있는 모든 일을 하기 시작하며 이러한 검색엔진으로부터 검색 결과에서 상위에 노출될 수 있도록 나의 콘텐츠를 최적화하는 방식을 검색엔진 최적화(SEO)라고 합니다.

나의 정보를 공유하기 위한 블로그이든 여러 잡다한 정보를 통해 수익을 창출하는 블로그이든 모든 작업은 기본적으로 나의 글을 읽어줄 사용자가 있어야 블로그를 운영할 수 있는 기반이 될 수 있기에 나의 사이트의 글을 사용자들에게 가장 잘 노출될 수 있도록 하는 작업은 필수적으로 이루어져야 할 기본 작업입니다.

성공적으로 SEO를 수행하기 위한 첫 번째 단계는 꾸준하게 콘텐츠 업데이트를 수행하고, 사이트의 요소(제목, 이미지 등)들을 최적화하여 콘텐츠를 제작해야합니다. 그리고 그런 기본을 충실히 수행했다면 검색엔진의 순위 향상에 도움이 되는 메타데이터, 키워드, 태그와 같은 세부적인 사항을 신경써서 작성해야합니다. SEO를 위한 노력은 검색 엔진이 내가 작성한 콘텐츠를 특정 검색어에 대한 웹 상의 주요한 정보로 인식하도록 하는 과정에 포커스를 맞추어야 합니다.

검색 엔진은 웹 크롤러라는 로봇을 이용하여 페이지의 코드를 스캔하고 각종 텍스트, 이미지, 동영상 등을 수집하여 해당 웹페이지가 어떠한 콘텐츠인지 파악하게 되고 해당 내용이 검색 사용자에게 유용하다 판단되면 색인에 추가하여 검색한 사용자들에게 제공할 준비를 하게 됩니다. 즉, 색인에 등록되게 되면 검색 엔진 알고리즘에 의해 콘텐츠를 검색한 사용자의 검색 단어에 대한 정확한 답변을 제공할 수 있게 됩니다. 또한 수많은 색인된 콘텐츠로부터 검색 엔진은 다양한 알고리즘을 이용하여 검색한 사용자에게 표시하게 될 검색 결과의 순서를 결정하여 제공하게 됩니다.

오늘은 다양한 SEO 전략 중 가볍게 수정할 수 있으나 티스토리에서 의외로 오류가 많이 발생하는 meta 태그의 중복 현상에 대해 수정하는 방법을 알아볼까 합니다.

다양한 웹마스터 도구들 중에서 SEO의 상태를 파악하기 좋은 MS의 Bing웹마스터도구를 이용하면 세부적인 SEO 오류를 파악할 수 있습니다.

다음은 Bing 웹마스터 도구의 SEO 검사 기능을 통해 추출해낸 SEO 보고서 예시입니다.

Bing 웹마스터 도구의 SEO 보고서

"페이지에 설명이 여러 개 있습니다."라는 SEO의 심각도가 높은 오류가 많습니다. 오류의 상세 내용은 "페이지에 설명이 여러 개 있습니다."라는 오류를 클릭하여 상세하게 확인이 가능합니다. 웹페이지에서 검색 엔진의 로봇에게 내 페이지를 설명하거나 페이지의 제목 등을 알려주기 위해 메타데이터를 제공합니다. 이 메타데이터는 똑같은 이름(name)으로 한 페이지 내에 중복되어 표시되면 안되지만 이 오류는 똑같은 이름, 즉 설명(description)이라는 데이터가 여러 개 중복되고 있다는 오류입니다.

페이지에 설명이 여러 개 있습니다 meta description

권장 작업으로 하나의 meta description 태그만 <head> 섹션 내에 존재하도록 하면 해결된다고 알려주고 있습니다. HTML의 <head>안에 <meta>들은 중복되지 않게 작성하면 됩니다.

이런 현상이 왜 생기는 걸까요?

문제는 티스토리에서는 페이지마다 몇 가지 meta들을 콘텐츠의 설명을 이용하여 자동으로 생성해주는 기능이 있었습니다. 이 몇 가지 meta는 다음과 같습니다.

  • description : 콘텐츠의 설명을 표기하는 메타데이터
  • og:description : 페이스북에서 창시한 오픈그래프(og) 프로토콜에 동의한 서비스(페이스북, 네이버, 카카오톡 등)들이 콘텐츠의 설명을 파악하기 위해 사용하는 메타데이터
  • twitter:description : 트위터 자체적으로 참조하는 메타데이터

즉, 이렇게 자동으로 생성되어지는 meta를 이중으로 생성하는 부분이 있어 중복이 되는 것입니다. 그렇다면 이중으로 생성하는 부분을 제거하기 위해 어디를 수정하면 될지 알아보겠습니다.

첫 번째로 티스토리의 스킨의 HTML구조를 살펴봐야합니다. 티스토리 블로그 관리의 꾸미기>스킨편집 메뉴로 들어가 "html 편집" 기능으로 들어갑니다.

티스토리 블로그 스킨편집
티스토리 블로그 스킨의 HTML 구조

사용하고 계신 스킨의 HTML 구조를 보게 되면 <head> 태그 내부에 <meta name="description" content="" /> 부분을 수정해 줍니다. 자동으로 생성되고 있기 때문에 주석 처리(<!-- ? -->)를 통해 해당 줄을 웹 브라우저에서 주석으로 인식하게 해줍니다. 이렇게 처리해주면 웹 브라우저에서는 주석 처리한 부분에 대해 아무런 처리도 하지 않게 됩니다.

 두번째로 확인해봐야할 부분은 플러그인 메뉴의 메타태그등록 부분입니다.

티스토리 블로그 플러그인 메타태그등록

이 기능은 html 스킨을 직접 수정하지 않고 <meta> 태그를 손쉽게 등록할 수 있게 해주는 기능입니다.

티스토리 블로그 메타등록 플러그인

만약, 이 곳에 name이 description이 존재한다면 해당 줄을 삭제하고 적용을 해줍니다.

이 두 부분을 수정해주면 해당 SEO 문제는 해결됩니다. 

지금까지 티스토리 블로그의 SEO 에 문제가 되는 2개 이상의 중복된 meta description 태그 문제를 해결하는 방법을 알아보았습니다. SEO는 내 블로그의 콘텐츠를 이용하는 이용자들에게 최적의 검색 순위를 제공하기 위해 반드시 표준에 맞추어 명확하게 작성해주는 것이 좋으며 해당 문제 발생 시 필수적으로 해결해줘야 열심히 작성한 나의 글을 한 사람이라도 더 볼 수 있으니 수시로 체크하여 웹사이트 관리에 힘을 써야겠습니다.