안녕하세요!~꼬방스 입니다.
오늘은 티스토리를 활용하여 수익형 블로그로 구글에서 상위 노출이 많이 될 수 있도록 도와주는 중요한 팁을 알아보겠습니다. 좋은 정보의 글을 열심히 작성했다 할지라도 사용자가 검색을 통해 볼 수 없다면 이보다 마음 아픈 일이 없습니다. 저 또한 마찬가지인데요. 메타 태그를 활용하여 노출의 빈도를 올릴 수 있는 데 도움이 되었으면 합니다.
목차
메타 태그란?
종류와 활용법
중요성
메타 태그 란?
메타 태그(Meta Tag)는 HTML 문서의 코드들이 나열되어 있는 구간에서 <head>라는 태그 안에 삽입되어 문서에 대한 정보를 제공하는 HTML 요소입니다. 사용자는 브라우저에서 웹 페이지를 시각적으로 볼 수 없지만, 메타 태그는 검색 엔진, 소셜 미디어, 인터넷 브라우저 등 다른 시스템들이 웹 페이지에 대한 정보를 이해하는데 중요한 역할을 하고 있습니다. 기본적으로 웹 페이지의 메타데이터를 정의하는데 활용되는 것을 말합니다.
메타 데이터는 데이터를 설명하는 데이터를 말합니다.
즉, 특정한 정보나 데이터를 컴퓨터가 이해하기 쉽도록 부가적인 설명이나 속성을 추가하는 과정이라고 생각할 수 있습니다. 위에서 메타 데이터를 정의한다는 의미는 <head> 태그 안에 적절한 메타 태그를 추가하여 검색 엔진이나 소셜 미디어 플랫폼이 이 페이지에 대해 정확하게 인식하고 이해할 수 있도록 돕는 것을 의미합니다. 예를 들어, meta 태그를 사용해 페이지의 설명, 키워드, 저자 등을 입력하여 정의해 주는 것입니다.
여기서 메타 데이터는 내가 작성한 글의 해당 페이지에 기록된 각종 데이터를 말하는 것입니다. 주로 사용되는 메타 데이터는 페이지 제목, 설명, 키워드, 작성자 정보, 문서의 언어, 문자 인코딩 방식, 콘텐츠의 날짜 등으로 웹 페이지의 시작적 콘텐츠를 변경하지 않지만, 검색 엔진 최적화(SEO), 소셜 미디어 공유, 브라우저 렌더링 등에 중요한 역할을 합니다.
종류와 활용법
1) 문서의 문자를 인코딩하는 데 사용합니다. 주로 사용하는 코드는 charset로 일반적으로 utf-8을 사용합니다.
<meta charset="UTF-8">
- 이 메타 태그는 문서가 사용하는 문자 인코딩 방식을 정의해 줍니다.
- utf-8은 대부분의 웹 페이지에서 기본적으로 사용되고, 다양한 문자(한글, 일본어 등)를 잘 표시할 수 있도록 도와줍니다.
2) 페이지를 설명해 줍니다. 주로 description을 사용합니다.
<meta name="description" content="이 페이지는 예제 웹 페이지입니다.">
- 검색 엔진 결과에서 페이지가 어떻게 나타날지 결정하는 중요한 요소로 사용합니다.
- 간단하면서 명확한 페이지 설명을 제공하여, 검색 결과에서 클릭을 유도할 수 있습니다. 예를 들어, Google 검색 결과에서 제목 아래에 보이는 간략한 설명이 바로 이 메타 태그에서 가져오는 내용입니다. 즉, 제목 아래의 설명을 얼마나 매력적으로 작성했느냐가 클릭을 유도하는데 도움이 될 수 있습니다.
3) 페이지 키워드를 설정합니다. 주로 keywords를 사용합니다.
<meta name="keywords" content="HTML, CSS, 메타 태그, 웹 개발">
- 페이지에 관련된 키워들를 설정하여 검색 엔진이 페이지 내용을 더 잘 이해할 수 있도록 돕기 위해 사용합니다.
- 하지만, 현재는 검색 엔진들이 키워드 메타 태그를 거의 사용하지 않아서 크게 중요한 요소는 아닙니다.
4) 저자의 정보를 보여 줍니다. 주로 author을 사용합니다.
<meta name="author" content="홍길동">
- 이 메타 태그는 웹 페이지의 저자가 누구인지를 보여주기 위해 사용합니다. 보통 웹사이트가 어떤 사람이나 팀에 의해 만들어졌는지 알리기 위한 용도로 사용되고 있습니다.
5) 뷰포트를 설정해 줍니다. 주로 viewport를 사용하며, 이는 모바일을 위해 쓰입니다.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
- 누구나 모바일을 통해 쉽게 접근하고 편리하게 이용할 수 있도록 하기 위한 필수적인 태그입니다. 화면 크기에 맞게 페이지가 적절하게 표시될 수 있도록 설정합니다. 사용하는 용어 중 width=device-width는 화면의 너비를 디바이스(스마트폰) 화면에 맞추고, initial-scale=1.0은 초기 확대 비율을 100%로 설정하였다고 표기하는 것입니다.
6) 검색 엔진 최적화(SEO)를 설정해 줍니다. 주로 robots를 사용합니다.
<meta name="robots" content="index, follow">
- 이 메타 태그는 검색 엔진이 해당 페이지를 어떻게 처리할지를 지정하기 위해 사용합니다. index, follow는 검색 엔진이 페이지를 인덱싱 하고, 페이지 내의 링크를 따라가도록 허용한다는 의미를 갖고 있습니다. noindex, nofollow로 설정하면 검색 엔진이 해당 페이지를 인덱싱 하거나 링크를 따라가지 않도록 할 때 사용합니다.
중요성
메타 태그는 검색 엔진 최적화(SEO)를 위한 검색 결과에 영향을 미칠 수 있습니다. 예를 들어, description태그는 검색 결과에서 페이지의 요약으로 표시되며, robots태그는 페이지가 검색 엔진에 의해 크롤링되는 방식에 영향을 미치기 때문입니다. 또한, 소셜 미디어에 최적화를 위해서도 유요 합니다. 소셜 미디어에서 콘텐츠가 어떻게 미리 보기 되는지를 조정할 수 있습니다. 올바르게 설정된 메타 태그는 클릭률을 높이고 공유율을 증가시킬 수 있습니다. 모바일 사용 빈도가 높기 때문에 모바일 기기에서 페이지가 어떻게 표시될지를 결정하며, 모바일 최적화를 지원하게 됩니다. 따라서, 수익화를 목표로 하는 블로거들에게 노출과 클릭률의 결합은 매우 중요하게 작용하므로 메타 태그를 활용한 방법도 유용하게 작용할 것으로 생각합니다.
용어 정의(1)
인덱싱을 한다.
인덱싱을 한다는 의미는 웹 페이지의 콘텐츠를 검색 엔진의 데이터베이스에 저장하여, 특정 키워드나 문구에 대해 검색할 수 있도록 효율적으로 접근가능하도록 준비하는 것을 말합니다.
용어 정의(2)
크롤링 이란?
검색 엔진 봇(구글봇)이 인터넷을 돌아다니며 웹 페이지를 탐색하는 것을 말합니다. 이때, 검색 엔진은 각 웹 페이지를 크롤링한다고 표현합니다.