헤더 태그: SEO를 위한 H1, H2 및 H3 HTML 제목 태그에 대한 간단하지만 완전한 가이드

게시 됨: 2020-08-25

이것은 2021년 헤더 태그에 대한 완전한 가이드입니다.

이 새로운 가이드에서는 SEO 헤더 태그를 처음 접하거나 (Google에 의해) 속아 제목 태그가 그렇지 않다고 생각하는 경우에도 H1에서 H6 태그를 사용하여 더 높은 검색 엔진 순위를 유도하는 방법을 정확히 배울 것입니다. 일하다.

HTML 표제 요소에 대해 알아야 할 모든 것을 배우게 됩니다.

다루는 내용에 대한 간략한 개요는 다음과 같습니다.

제목 태그란 무엇이며 정확히 어떻게 사용 합니까?
H1, H2, H3 태그의 차이점과 종류별 사용시기
제목 태그가 지금 필수적인 5가지 이유
완벽하게 구조화된 헤더 태그 계층 구조
더 높은 순위(및 판매)를 제공하는 H1 ~ H6 태그를 만드는 방법
아주 더 많이

시작하자.

다운로드: 이 게시물에 포함된 헤더 태그 최적화 팁을 구현하는 방법을 정확히 보여주는 무료 체크리스트입니다.

제목 태그란 무엇입니까? 전문 용어 무료 정의

간단히 말해서:

표제 태그는 페이지의 표제를 정의하는 데 사용되는 HTML 요소입니다.

제목 <h1> 및 하위 제목 <h2> ~ <h6>을 나머지 콘텐츠와 구분합니다.

1에서 6까지의 숫자는 표제 구조의 전체 계층에서 표제가 갖는 중요성과 위치를 결정합니다.

대부분의 SEO 용어와 마찬가지로 제목을 설명하기 위해 상호 교환적으로 사용되는 모든 유형의 동의어가 있습니다.

헤더 태그, HTML 제목 및 H 태그는 동일한 것을 설명하는 몇 가지 다른 방법입니다.

따라서 이전에 해당 SEO 용어를 들어본 적이 있다면 이제 그 용어가 무엇을 의미하는지 알 것입니다.

그것들은 모두 다른 이름으로 된 표제 태그입니다.

반면에 " HTML header "는 웹 페이지의 <header> 요소 사이의 코드 섹션입니다.

탐색, 로고, 작성자 정보 및 제목 세부 정보와 같은 소개 콘텐츠를 위한 컨테이너입니다.

즉, 제목 태그(무엇보다도)를 포함할 수 있는 컨테이너입니다 .

또한 제목 태그를 HTML 코드의 < head > 요소와 혼동해서는 안 됩니다.

< head >는 메타데이터(데이터에 대한 데이터)를 담는 컨테이너로 웹페이지의 < html > 태그 와 <body> 태그 사이에 위치합니다. 그 내용은 페이지에 렌더링되지 않지만 SEO에 중요합니다.

페이지 제목, 메타 설명 및 Google Analytics와 같은 스크립트가 저장되는 코드의 위치입니다.

아직도 나와 함꼐?

좋아, 계속하자.

H1 태그란 무엇입니까?

H1에 대해 아무것도 모른다고 가정해 봅시다.

정말 간단한 정의를 공유하겠습니다.

H1은 웹 페이지의 기본 제목을 나타내는 HTML 태그입니다.

압축을 풀자.

HTML 요소입니다. 즉, H1 태그가 웹사이트 코드 안에 있습니다.
일반적으로 페이지에서 첫 번째로 표시되는 헤더인 기본 헤드라인을 마크업하는 데 사용됩니다.

텍스트를 눈에 띄게 만들기 위해 H1 태그는 일반적으로 페이지 또는 게시물의 나머지 텍스트보다 더 크고 눈에 띄게 표시됩니다.

제목 1 태그를 사용하는 방법을 이해하는 가장 쉬운 방법은 문서의 개요를 작성하고 있다고 상상하는 것입니다.

문서의 주요 제목은 <h1>이어야 합니다.

문서의 전체 주제를 나타내야 하며 처음에 큰 글꼴로 표시되어야 합니다.

H1 태그 예:

위의 Smart Passive Income의 예를 사용하면 H1 태그의 값이 "Learn Ethical Affiliate Marketing"입니다.

HTML에서 볼 때 H1 태그는 다음과 같이 나타납니다.

 <h1>Learn Ethical Affiliate Marketing</h1>

물론 웹사이트의 페이지에는 두 개 이상의 제목이 필요할 수 있습니다.

이것은 다른 제목 태그가 들어오는 곳입니다.

H2 태그란 무엇입니까?

H1 태그가 문서의 주요 제목에 사용되는 반면 ;

귀하의 주요 요점 은 H2로 알려진 부제목으로 싸여 있습니다.

다시 말해:

<h2> 태그는 웹페이지의 두 번째 수준 제목을 정의합니다.

그러나 제목 태그는 H2에서 멈추지 않습니다.

<h2> 태그 아래의 하위 포인트는 <h3> 제목 태그를 사용합니다.

그리고 <h3> 태그 아래의 하위 포인트는 <h4> 제목 태그를 사용합니다.

이 시퀀스는 헤더 태그 계층에서 가장 덜 중요한 <h6> 태그까지 계속될 수 있습니다 .

하지만:

H4, H5, H6 태그가 필요할 만큼 깊이 있는 콘텐츠를 작성하는 경우는 매우 드뭅니다.

(콘텐츠가 매우 길고 기술적인 경우 제외).

이미지 SEO에 있는 것과 마찬가지로 내 블로그 게시물의 대부분은 길이가 5,000단어 이상입니다.

그럼에도 불구하고 내 부제목은 단순한 H2와 H3으로 구성됩니다.

이제 H2 태그를 마무리하겠습니다.

H2 부제목 태그는 콘텐츠를 분할하고 스캔 가능하고 읽기 쉽게 만드는 데 사용됩니다.

H2는 중요한 정보를 강조 표시하고 페이지의 하위 섹션을 표시하는 데 사용됩니다.

필요한 경우 H3 태그를 H2 아래의 하위 포인트에 대한 제목으로 사용할 수 있습니다.

위의 예를 사용하면 HTML 코드에서 H2 태그가 다음과 같이 보입니다.

 <h2>How To Claim Your Business On Google</h2>

알았다? 좋은.

다음으로 제목 태그와 HTML로 코딩하는 방법에 대해 자세히 알아보겠습니다.

HTML의 표제 태그: 그리고 H1의 중요성

Heading 태그, 특히 H1 태그는 HTML 구조 내에서 필수적인 기능을 가지고 있습니다.

설명하겠습니다:

HTML 파일은 노드의 조합으로 정의할 수 있으며, 이에 따라 제목 태그는 다른 노드가 분기되는 시작점입니다.

따라서 HTML 파일에는 (이론적으로) H1 제목이 하나만 있어야 합니다.

왜요? H1 태그는 다른 모든 노드가 시작되는 루트이기 때문입니다.

대조적으로, 순서가 낮은 헤더(H2 ~ H6)는 원하는 만큼 자주 사용할 수 있습니다.

그러나 논리적 계층 구조를 유지해야 합니다. 이에 대해서는 나중에 자세히 설명합니다.

코드 관점에서 제목 태그는 텍스트만 표시하는 데 사용됩니다.

따라서 CSS 파일에 표제 서식을 지정하여 서식과 내용을 구분해야 합니다.

표제 태그의 예와 HTML로 코딩하는 방법

웹사이트 코드 내에서 제목 태그를 헤더로 만드는 것은 두 개의 간단한 HTML 태그입니다.

여는 <h> 태그와 닫는 </h> 태그.

이 두 태그 안에 표시하려는 제목 텍스트가 있습니다.

두 개의 부제목이 있는 표제의 코드 행은 다음과 같습니다.

 <h1>This is a heading</h2> <h2>This is a sub-heading</h2> <h3>This is a third sub-heading</h3>

물론 웹사이트 코드에는 제목만 표시되지 않습니다.

본문 사본 및 기타 요소도 포함됩니다.

다음은 일련의 제목과 본문이 포함된 HTML 코드의 모습입니다.

 <h1>This is a heading</h1> <h2>Summary</h2> <p>Some text here...</p> <h2>Examples</h2> <h3>Example 1</h3> <p>Some text here...</p> <h3>Example 2</h3> <p>Some text here...</p> <h2>See also</h2> <p>Some text here...</p>

그보다 더 많은 코드 요소는 없습니다.

기억해라:

모든 표제 태그는 여는 <h> 태그로 시작하고 종료 </h> 태그로 닫아야 합니다.

태그 계층 구조(1-6)는 "h" 바로 뒤에 지정되며 여는 태그와 닫는 태그 모두에 정의되어야 합니다.

텍스트 콘텐츠는 두 태그 요소 사이에 작성됩니다.

모든 말과 함께 :

웹 페이지를 사용자 정의 코딩하지 않는 한(일반적으로 권장하지 않음), 제목 태그의 HTML 코드는 콘텐츠 관리 시스템에서 처리됩니다.

WordPress에서 H1에 H6 태그를 추가하는 방법

WordPress는 웹에서 가장 널리 사용되는 콘텐츠 관리 시스템입니다.

WordCamp에 따르면 현재 WordPress를 사용하는 사이트는 7,500만 개 이상 입니다.

이는 월드와이드웹에 있는 모든 웹사이트의 약 30%에 해당합니다.

WordPress가 인기 있는 이유는 검색 엔진의 친화성과 사용 용이성입니다.

사용자 정의 페이지 제목 및 영구 링크, 하이퍼링크 및 최적화된 이미지와 같은 SEO 기능을 추가하는 것은 WordPress에서 아주 쉽습니다.

페이지나 포스트에 제목 태그를 추가하는 것도 마찬가지입니다.

WordPress에 제목 태그를 추가하는 두 가지 기본 방법이 있습니다. 둘 다 보여드리겠습니다:

(ㅏ). 편집기를 통해 WordPress에 H1 태그 추가

제목을 추가하는 가장 쉬운 방법은 편집기를 사용하는 것입니다. 이미 Gutenberg 블록 편집기를 사용하고 있다면 '+' 버튼을 클릭하고 '제목'을 선택하십시오.

Adding Header Tags WordPress Block Editor

거기에서 추가할 제목을 선택할 수 있습니다.

여전히 클래식 편집기를 사용하는 경우에도 간단합니다.

편집기의 시각적 탭에 있는지 확인하고 텍스트 스타일 드롭다운으로 이동합니다.

그런 다음 '제목 1' 또는 '제목 2' … 또는 드롭다운 메뉴에서 원하는 다른 제목을 선택하기만 하면 됩니다.

쉽게, 응?

WordPress에서 H1에 H6 태그를 추가하는 다음 옵션은 HTML을 사용하는 것입니다.

(비). 편집기를 통해 WordPress에 H1 태그 추가

원하는 경우 HTML을 사용하여 WordPress에 제목을 추가할 수도 있습니다.

나는 당신이 따라오고 있다고 확신하므로 <h1>, <h2>, <h3> 등에 대한 HTML 코드를 이미 알고 있습니다.

여는 <h> 태그로 시작하여 제목 텍스트가 사이에 끼인 닫는 </h> 태그로 끝납니다.

클래식 편집기를 사용하여 WordPress의 <h1>에 <h6> 태그를 추가하려면 텍스트 탭에 있어야 합니다.

블록 편집기에서 HTML로 편집하도록 전환해야 합니다.

그렇게 하려면 블록 도구 모음에서 세 개의 수직 점을 클릭합니다. 그런 다음 HTML로 편집 옵션을 선택합니다.

이렇게:

어느 편집기에서나 사용하려는 제목 태그를 아래에서 복사/붙여넣기하고 제목 텍스트를 업데이트하면 바로 사용할 수 있습니다.

 <h1>This is an H1 heading</h1> <h2>This is an H2 sub-heading</h2> <h3>This is an H3 sub-heading</h3> <h4>This is an H4 sub-heading</h4> <h5>This is an H5 sub-heading</h5> <h6>This is an H6 sub-heading</h6>

다음으로 Shopify로 관심을 돌려보겠습니다.

Shopify에서 H1에서 H6 태그를 추가(또는 변경)하는 방법

등장한 이후 Shopify는 빠르게 선택되는 전자 상거래 플랫폼이 되었습니다.

Hosting Tribunal에 따르면 거의 50만 개의 웹사이트가 Shopify를 사용하고 있습니다.

WordPress와 마찬가지로 Shopify를 가장 매력적으로 만드는 것은 사용자 중심입니다.

제품 관리, 페이지 추가 및 제거, 게시물 삭제가 모두 놀라울 정도로 쉽습니다.

<H2>를 <H6> 표제 태그에 추가하는 것도 마찬가지입니다.

페이지 또는 게시물 편집기에서 서식 탭을 클릭하기만 하면 됩니다.

그런 다음 원하는 제목 태그를 선택합니다.

WordPress 및 기타 콘텐츠 관리 시스템과 마찬가지로 Shopify는 코드 편집기도 제공합니다.

코드 편집기를 사용하여 Shopify에 제목을 추가하려면 편집기 창의 <> 버튼을 클릭하고 제목 코드를 추가하십시오.

아주 간단합니다!

반면에 홈 또는 제품 페이지와 같은 Shopify 스토어의 다른 페이지에 <H1> 및 <H2> 태그를 추가하고 최적화하려는 경우…

Shopify 테마 파일을 편집해야 합니다.

운 좋게도 Plugin Useful의 Daniel Sim이 여기에 대한 편리한 가이드를 마련했습니다.

왜 제목을 사용합니까?

그래서 우리는 제목 태그를 추가하는 "방법"을 다루었습니다.

그러나 여전히 처음에 제목을 사용하는 "이유"가 궁금할 수 있습니다.

특히 Google이 SEO에 대한 제목 사용을 과대평가된 것으로 설명한 경우:

Google의 말에도 불구하고 (사실) 제목 태그를 사용해야 하는 몇 가지 중요한 이유 가 있습니다.

1. 제목 태그는 접근성을 향상시켜 콘텐츠를 더 폭넓게 도달할 수 있게 합니다.

시각 장애가 있는 독자를 포함하여 모든 사람이 콘텐츠에 액세스할 수 있도록 하려면 제목 태그가 매우 유용합니다.

화면 읽기 기술은 H1 및 기타 제목 태그를 사용하여 사용자가 콘텐츠를 탐색하고 페이지를 검색하고 검색하는 데 도움을 줍니다.

이미 배웠듯이 제목은 HTML에 포함됩니다. 즉, 다음을 의미합니다.

화면 판독기는 HTML을 사용하여 콘텐츠 구조를 식별하고 제목을 소리내어 읽을 수 있습니다.

결과적으로 이것은 시각 장애인에게 도움이 되며 시각 장애인 사용자는 (단어 하나하나를 들을 필요 없이) 기사의 개요를 알 수 있습니다.

그런 다음 기사 전체를 읽을지 여부를 결정할 수 있습니다.

또 뭔데:

스크린 리더는 한 제목에서 다음 제목으로 이동할 수 있는 바로 가기를 제공합니다.

즉, 제목 태그는 내비게이션에서도 시각 장애인이 사용 합니다.

2. Google은 제목 태그 대신 H1을 사용합니다(관련된 경우).

일부 (그렇지 않은) 드문 경우에;

Google이 제목 태그를 찾거나 처리할 수 없는 경우와 같이.

Google은 페이지에서 다음으로 가장 관련성 이 높은 부분에서 제목을 추출하도록 선택할 수 있습니다.

대부분의 경우 이것은 사용 가능한 가장 눈에 띄는 텍스트 요소이기 때문에 제목 1 태그가 됩니다.

어떤 면에서 페이지의 H1 태그는 제목 태그와 비슷한 용도로 사용됩니다.

검색 의도를 충족하고 독자에게 페이지에서 기대할 수 있는 내용을 알려주고 사용자가 더 많은 것을 읽을 수 있도록 해야 합니다.

이제 Google이 SERP에 H1을 표시하도록 선택할 수 있다는 것을 알게 되었습니다. 클릭할 가치가 있는 매력적인 헤드라인을 만드십시오.

나중에 어떻게 하는지에 대한 팁을 공유하겠습니다.

3. 추천 스니펫에 사용된 제목

이 추천 스니펫을 확인하세요.

2020년 최고의 소셜 미디어 블로그를 특징으로 하는 목록 스니펫입니다.

그리고 이 텍스트는 어디에서 가져온 것 같습니까?

당신은 그것을 추측했다. 순위 페이지의 제목:

점점 더 많은 추천 스니펫에 표시하려면 페이지에 제목을 통합하는 것이 중요합니다.

다음 이유는 다음과 같습니다.

4. Google은 제목을 사용하여 콘텐츠를 해석하고 순위를 높입니다.

Google의 두 가지 진술로 이 점을 강조하겠습니다.

먼저 Google의 수석 웹마스터 트렌드 분석가인 John Mueller는 다음과 같이 말했습니다.

"페이지의 텍스트 구조를 더 잘 이해하기 위해 H 태그를 사용합니다."

두 번째는 이전에 Google 검색 품질 팀의 일원이었던 Matt Cutts입니다.

“구글은 다양한 것을 봅니다. 우리는 200개 이상의 항목을 살펴보고 PageRank는 그 중 하나일 뿐입니다. 제목과 URL에 사용하는 항목의 순위를 매길 때마다 h1 태그와 같은 강조 표시된 항목을 알고 있습니다.”
맷 컷츠, 구글

이것을 더 확장하려면:

Google은 페이지의 제목을 사용하여 콘텐츠의 내용을 (더 나은) 해석합니다.

머리글은 일반적으로 콘텐츠 블록 앞에 와야 하기 때문에:

Google은 텍스트, 이미지 또는 동영상과 같은 콘텐츠에 대해 알아보기 위해 제목을 봅니다.

제목과 본문이 일치하는 경우 Google은 귀하의 콘텐츠가 (콘텐츠와 관련된) 쿼리에 대한 관련 답변을 제공할 것이라고 더 확신할 수 있습니다.

그리고 차례로 약간의 순위 상승을 얻을 것입니다.

이제 제목을 사용하는 다섯 번째 이유에 대해 알아보겠습니다.

5. 표제 사용은 상위 순위와 상관 관계가 있습니다.

내가 본 거의 모든 SEO 상관 관계 연구는 페이지의 상위 순위와 제목 사이에 작지만 긍정적인 상관 관계를 보여주었습니다.

SEM Rush에서 가져온 것:

H2 및 H3 태그를 사용하여 잘 구성된 기사가 높은 성과를 낼 가능성이 더 높다는 것을 발견했습니다.

그리고 이것은 Moz의 것입니다.

Header Tags in Moz Ranking Factors Study

Moz 순위 요인 연구는 H1 표제 태그에 포함된 키워드가 있는 페이지가 더 높은 순위를 가질 가능성이 더 높다는 것을 발견했습니다.

이 연구에 의해 표제 태그에 부여된 가중치는 중간 정도에 불과하지만;

일부 SEO는 표제 태그와 더 높은 순위의 상관 관계가 더 높은 순위 를 유발 한다는 것을 증명하지 않는다고 주장할 것입니다.

잘 최적화된 제목 태그를 사용하는 것은 그만한 가치가 있습니다.

아니면?

H1 태그가 실제로 작동합니까(SEO 실험)?

모든 SEO 가이드는 동일한 조언을 제공합니다.

그러나 모든 블로그가 이러한 소위 SEO 모범 사례를 따르는 것은 아니며 Moz가 그 중 하나입니다.

Moz.com은 SEO 주제에 대해 가장 신뢰할 수 있는(그리고 트래픽이 많이 발생하는) 웹사이트 중 하나이지만 아직:

Moz의 블로그에는 H1 태그가 없으며 대신 주요 헤드라인에 H2 태그를 사용합니다.

Moz 블로그가 헤드라인에 H1 대신 H2 태그를 사용한다는 사실을 알게 된 후 Distilled의 Craig Bradford는 Moz의 Cyrus Shepard에게 연락했습니다.

Craig와 Cyrus는 함께 H1 태그가 검색 엔진 순위에 영향을 미치는지 여부를 단번에 결정할 수 있는 실험을 실행하기로 결정했습니다.

그렇게 하기 위해 그들은 SearchPilot을 사용하여 Moz 블로그 헤드라인의 50/50 분할 테스트를 고안했습니다. SEO A/B 분할 테스트 도구.

실험에서 Moz의 헤드라인 중 절반은 H1으로 변경되고 나머지 절반은 H2로 유지되었습니다.

그런 다음 두 그룹 간의 유기적 트래픽 차이를 측정했습니다.

기본 헤드라인이 잘못된 제목 태그(H2)에서 올바른 제목(H1)으로 변경되었을 때 어떤 일이 발생했다고 생각하십니까?

대답:

별로!

8주간의 데이터 수집 후 그들은 다음을 결정했습니다.

블로그 게시물 헤드라인을 H2에서 H1으로 변경해도 통계적으로 유의미한 차이가 없었습니다.

이것으로부터 우리는 무엇을 추론할 수 있습니까?

주요 헤드라인이 H1 또는 H2로 래핑된 경우 Google은 페이지의 컨텍스트를 동등하게 결정할 수 있습니다.

모범 사례를 포기하고 H1을 제거해야 한다는 뜻입니까?

별말씀을 요.

표제 구조: 완벽하게 구조화된 헤더 태그 계층 구조

이미 지적했듯이:

제목은 페이지의 콘텐츠 구성을 나타냅니다.

그리고 독자가 콘텐츠를 더 많이 사용할 수 있도록 만드십시오.

따라서 Google은 "제목 태그"가 없어도 페이지에서 주목할만한 것을 결정할 수 있다고 명시했지만…

제목 태그를 사용하고 올바르게 구성하는 SEO 이점은 태그를 사용하지 않는 것보다 필요한 추가 노력이 더 중요합니다…

그러면 질문은 다음과 같이 됩니다.

표제 태그를 구조화하는 방법: 웹페이지의 단순(논리적) 계층 구조

제목을 구성할 때 따라야 할 몇 가지 간단한 규칙이 있습니다.

순위(또는 수준)에 따른 중첩 제목
가장 중요한 제목은 최상위 순위(<h1>)입니다.
가장 덜 중요한 제목은 가장 낮은 순위(<h6>)를 가집니다.
순위가 같거나 더 높은 제목은 새 섹션을 시작합니다.
순위가 낮은 제목은 순위가 높은 섹션의 일부인 새 하위 섹션을 시작합니다.

이러한 규칙을 적용할 때 사용자를 염두에 두십시오.

첫째, 귀하의 페이지를 스캔할 시각적 사용자입니다.

태그 계층 구조로 인해 페이지 구조가 더 눈에 잘 띄고 스캔하기가 더 쉽습니까?

두 번째 시각 장애인 사용자;

귀하의 태그 계층은 시각 장애인 사용자가 가장 관심 있는 부분으로 직접 이동할 수 있도록 각 섹션(및 전체 페이지)을 묘사합니까?

헤더 태그를 소리 내어 읽는다면 사용자가 페이지에 포함된 정보와 구성 방법을 (정확하게) 알 수 있을까요?

이 질문 중 하나라도 "아니오"라고 대답하면 구조를 재고해야 합니다.

예를 들어 보겠습니다.

 <h3>Quick Links</h3> <h3>Photography Tutorials</h3> <h1>Setting the Exposure Manually on a Camera</h1> <h3>Set the ISO</h3> <h4>The effect of ISO on image quality</h4> <h4>High ISO cameras</h4> <h3>Choose an aperture</h3> <h4>The effect of aperture on depth of focus</h4> <h4>Vignetting</h4> <h4>Diffraction</h4> <h3>Choose a shutter speed</h3> <h4>Shutter speed limitations for hand-holding a camera</h4> <h4>Long exposures</h4>

위의 구조에서:

개요는 <h1>이 아닌 두 개의 <h3> 제목으로 시작하며 이 두 제목 모두 웹 페이지의 주요 제목이 아닙니다.

대신 템플릿의 제목 주변 탐색 구조의 일부입니다.

게다가, 일단 내용이 시작되면, 그 사이에 제목 수준 2 없이 개요가 수준 1에서 수준 3으로 점프합니다.

당신이 상상할 수 있듯이;

이러한 표제(예: 화면 판독 장치의 표제)를 스캔하는 사용자는 다소 혼란스러울 것입니다.

콘텐츠가 그들이 찾고 있는 것이 아니라고 가정합니다.

뒤로 버튼을 클릭하고 다른 곳으로 이동합니다.

방문자가 사라졌습니다!

제목 구조를 올바르게 잡는 것이 왜 필수적인지 이제 이해하셨으리라 확신합니다.

같은 예를 들고...

제목 구조는 적절한 순서로 다음과 같이 표시되어야 합니다.

 <h1>Setting the Exposure Manually on a Camera</h1> <h2>Set the ISO</h2> <h3>The effect of ISO on image quality</h3> <h3>High ISO cameras</h3> <h2>Choose an aperture</h2> <h3>The effect of aperture on depth of focus</h3> <h3>Vignetting</h3> <h3>Diffraction</h3> <h2>Choose a shutter speed</h2> <h3>Shutter speed limitations for hand-holding a camera</h3> <h3>Long exposures</h3>

<h1>부터 <h3>까지의 각 제목 수준은 콘텐츠의 한 부분에서 다른 부분으로의 관계를 나타냅니다.

제목 아래의 내용은 논리적으로 그 위의 제목과 관련됩니다.

유사하게, 콘텐츠의 <h2> 블록 내의 콘텐츠는 논리적으로 선행하는 <h1> 아래에 위치합니다.

이러한 방식으로 표제 구조는 문서의 내용을 계층적으로 구성합니다.

그리고 중요한 것이 무엇인지 분명히 합니다.

빙고!

H1 태그 확인: 제목 감사를 수행하는 방법

이제 사이트에서 새 페이지를 구성하는 방법을 알게 되었습니다.

그러나 기존 페이지는 어떻습니까?

올바른 제목 태그를 사용하고 있는지 어떻게 확인할 수 있습니까?

두 가지 방법이 있습니다.

먼저 웹사이트의 소스 코드를 확인할 수 있습니다 .

그렇게 하려면 Google 크롬을 사용하여 확인하려는 웹 페이지로 이동합니다.

그런 다음 '보기', '개발자', '소스 보기'를 차례로 클릭합니다.

그런 다음 'Control F'를 눌러 인페이지 검색 기능을 시작한 다음 '<h1'을 눌러 여는 H1 HTML 태그를 찾습니다.

이 프로세스는 '<h2' 등의 검색을 사용하여 H2에 대해 반복될 수 있습니다.

SEO Quake와 같은 브라우저 확장을 사용하여 제목 태그를 볼 수도 있습니다.

SEO Quake가 설치된 상태에서 확인하려는 페이지를 열고 SEO Quake 내부의 '진단' 탭으로 이동한 다음 제목 섹션까지 아래로 스크롤합니다.

각 수준에서 제목 태그의 총 수를 표시한 다음 표시되는 계층 구조에서 제목 태그를 나열합니다.

위 페이지를 빠르게 검토하면 H1, H2 및 H3 태그를 사용하고 태그가 논리적 계층 구조로 구성되어 있음을 알 수 있습니다.

하지만 문제가 있을 수 있습니다.

페이지에는 두 개의 H1 제목이 있습니다.

H1 태그: 한 페이지에 권장되는 H1 요소 수

앞서 지적했듯이 페이지 에는 H1 태그가 하나만 있어야 합니다 .

H1 태그가 다른 모든 제목의 유래가 되는 루트 노드이기 때문입니다.

그리고 H1 태그가 하나만 있으면 SEO 노력이 H2 및 H3를 사용하는 제목 아래에 여러 (포괄적인) 하위 주제와 함께 하나의 주요 주제에 집중됩니다.

이것이 요즘 랭킹에 이상적인 구조입니다.

그러나 페이지에 둘 이상의 H1이 있는 경우는 어떻습니까?

아니면 H1이 전혀 없습니까?

SEMRush에서 수행한 연구에 따르면 엄청난 비율의 웹사이트에 H1 태그 문제가 포함되어 있습니다.

그러나 Google에 따르면 이것은 걱정할 필요가 없습니다.

특히 HTML5는 H1을 사용하여 동일한 페이지 내에서 여러 섹션을 표시할 수 있기 때문에 특히 그렇습니다.

그래서 나는 무엇을 추천합니까?

동일한 페이지 내에서 별개의 섹션을 가질 수 있는 HTML5를 이미 사용하고 있다면 각 섹션에 대해 H1 태그를 사용하는 것이 완벽합니다.

그러나 한 페이지가 일반적으로 하나의 핵심 주제를 의미하는 pre-HTML5 코드를 사용하는 경우 하나의 h1/one-page 규칙을 고수하십시오!

킬러 H1 ~ H6 태그를 만드는 방법. 5가지 헤더 작성 팁

다음으로 이탈률을 줄이고 페이지에 머문 시간을 늘리며 궁극적으로 웹사이트의 검색 엔진 순위와 전환을 높이는 제목을 작성하는 방법을 정확히 공유하겠습니다.

뛰어들자:

1. 그들이 원하는 것을 제공하십시오 – H1으로 검색 의도 마스터하기

Google은 제목에 키워드를 사용하는 것이 순위를 높이는 데 도움이 되지 않는다고 말합니다.

그들은 틀렸어!

나는 제목 안의 키워드가 직접적인 순위 요인 이 아닐 수 있지만 시간이 지남에 따라 순위를 높이는 데 여전히 도움이 된다는 데 동의합니다.

어떻게 왔어요?

두 개의 작은 단어; 검색 의도.

잠시 동안 Google에서 무언가를 검색하고 관련 결과를 클릭하고 랜딩 페이지에서 완료했다고 상상해 보십시오.

시나리오 A에서 조회한 페이지에는 검색어와 완벽하게 일치하는 명확하게 표현된 헤드라인이 있습니다.

시나리오 B에서는 페이지의 헤드라인이 검색어와 전혀 일치하지 않습니다.

당신은 어느 페이지에 남아 있습니까?

물론 페이지 A.

RankBrain으로 알려진 Google의 기계 학습 알고리즘은 이 개념을 사용자의 체류 시간을 측정하여 순위 요소로 사용합니다.

긴 체류 시간(페이지에 머문 시간이라고도 함)은 검색자 만족도의 척도입니다.

사용자가 웹페이지에서 오랜 시간을 보낸다면(즉시 검색 결과로 되돌아가는 것과는 대조적으로) Google은 사용자가 찾고 있는 것을 찾았다고 가정합니다.

그리고 차례로 페이지 순위를 높이십시오.

간단히 말해서:

요즘은 더 높은 순위를 위해서는 체류 시간을 최대화하고 포고 스틱킹을 최소화하는 것이 필수적입니다.

체류 시간에 영향을 미치는 가장 중요한 요소 중 하나는 사용자가 페이지를 처음 방문할 때 보게 되는 것입니다. 즉, 헤드라인.

모든 유료 검색 전문가가 "하키 스틱"이라는 키워드를 타겟팅하고 있는지 알려줄 것이므로 방문 페이지의 헤드라인에 해당 용어(또는 매우 유사한 유사어)가 포함되어야 합니다. 자연 검색도 마찬가지입니다.

여기서 중요한 것은; 타겟 키워드 또는 유사 키워드

물론 원하는 경우 정확한 키워드를 포함할 수 있지만 필수는 아닙니다.

가장 중요한 것은 사용자의 검색 뒤에 숨은 의도를 일치시키는 것입니다. 이를 통해 유사어와 동의어를 사용하여 헤드라인을 보다 자연스럽고 매력적으로 만들 수 있습니다.

어느 쪽이든, 헤드라인에 검색어를 반영하면 사용자에게 "당신이 찾고 있는 것을 찾았습니다."라고 말하게 되어 그들이 계속 머물 가능성이 높아집니다.

이를 예를 들어 설명하겠습니다.

Detailed.com의 Glen Allsopp은 링크 구축에 대한 이 범퍼 포스트를 작성했습니다.

"고급 링크 구축"이라는 키워드를 대상으로 합니다.

게시물이 검색 의도를 충족할 수 있도록 Glen은 게시물 페이지 제목에 키워드를 포함합니다.

그리고 다시 페이지의 헤더에 있습니다.

"고급 링크 구축"을 검색하는 사람이라면 누구나 Glen의 게시물에 원하는 것이 있을 것입니다.

이것은 Glen의 게시물의 체류 시간을 개선하고 Google의 RankBrain 알고리즘을 진정시키는 데 도움이 될 수 있습니다.

2. "So What" 기법을 사용하고 지루한 기능 중심의 제목을 이점 중심의 후크로 전환하십시오.

짧고 기능 중심의 부제목을 작성하는 대신.

H2의 최소 50%에 혜택을 통합합니다.

내가 왜 그래?

이점을 사용하여 내 정보가 SEO로서의 독자의 역할에 어떻게 도움이 될 것인지 암시합니다.

예를 들어:

SEO 실험에 대한 이 게시물에서 H2로 "아웃바운드 링크 사용"을 작성할 수 있었습니다.

그러나 그 대신 정보가 해결할 수 있는 문제를 보여주는 영향력 있는 이점을 포함했습니다.

귀하가 SEO이고 동일한 문제가 있는 경우 읽을 것이 거의 확실합니다.

그렇다면 이익 중심 표제는 어떻게 작성합니까?

질문: "그래서?" 여러 번.

Enchanting Marketing에서 수집한 예를 보여 드리겠습니다.

기능: 오븐이 빨리 예열됩니다.

그래서 무엇?

라자냐 요리를 시작할 준비가 빨리 되었습니다.

그래서 무엇?

음식이 더 빨리 식탁에 올라옵니다.

그래서 무엇?

삶의 스트레스가 적습니다. 오븐이 준비되기를 기다리는 주방 주변을 어슬렁거리는 일이 줄어듭니다. 걱정할 필요가 없습니다. 오븐 예열을 잊어버릴 수 있습니다.

"예열 기능" 으로 시작된 귀하의 제목

이제 다음이 될 수 있습니다.

"이 독특한 예열 기능으로 시간을 절약하고 스트레스를 줄이십시오"

어느 쪽이 페이지에 계속 집착하게 될까요 ?

3. 눈에 띄는 글꼴과 대비되는 색상으로 제목을 돋보이게 만드십시오.

당신은 당신의 사본을 못 박았고 당신의 머리글은 검색 의도를 완벽하게 충족시킵니다. 다음은 무엇입니까?

독자가 콘텐츠를 더 잘 탐색할 수 있도록 제목과 부제목을 구분할 수 있도록 만들어야 합니다.

즉, 제목이 페이지에서 "POP"되어야 합니다.

구별 가능하다는 것은 색상, 크기, 글꼴 또는 효과의 시각적 구별을 포함할 수 있습니다.

또는 이들 모두의 조합.

몇 가지 예를 살펴보겠습니다.

Ahrefs 블로그는 헤더를 구분하는 데 훌륭한 역할을 합니다.

그들은 다른 글꼴 크기를 사용하고 헤더 계층 아래로 이동함에 따라 검정색에서 회색으로 미묘하게 진행됩니다.

보너스 포인트의 경우 브랜드 전용으로 개발된 사용자 정의 글꼴도 사용합니다.

또 다른 좋은 예는 블로그 제목에 대조적인 주황색을 사용하는 Eric Siu의 Single Grain입니다.

머리글이 눈에 띄도록 하여 페이지의 다른 요소, 특히 클릭 유도문안 과 시각적으로 구별되도록 하세요.

시각적 중복이 너무 많으면 CTA에 대한 안구가 줄어들어 전환율이 낮아질 수 있습니다.

그것으로 네 번째 팁으로

4. 이 멋진 카피라이팅 기법을 활용하여 이탈률을 낮추고 매출을 높이세요

이것이 헤드라인 작성을 진지하게 받아들이지 않는다면 아무 것도 할 수 없습니다.

이 진술은 헤드라인의 중요성과 그것이 전체 기사의 효과를 결정짓는 이유를 강조합니다.

요컨대, 헤드라인이 좋을수록 평균을 능가하고 작성한 내용을 읽을 가능성이 높아집니다.

이것은 주요 제목(H1)뿐만 아니라 부제목(H2 ~ H6)에도 적용됩니다.

콘텐츠가 중단될 때마다 독자는 두 가지 선택을 할 수 있습니다.

그들은 멈추거나 계속 읽습니다.

그렇기 때문에 제목(H1 ~ H6) 전체에 매력적인 문구를 사용하는 것이 중요합니다.

저는 카피라이팅 전문가가 아니므로 Nevile Medhora KopyWriting Course에서 헤드라인 쓰기 팁을 공유하도록 하겠습니다.

5. 콘텐츠에 이러한 표제 요소를 삽입하여 독자의 발자취를 막으십시오.

그래픽을 사용하는 것은 훌륭합니다.

제목을 사용하는 것이 좋습니다.

그러나 두 가지를 함께 결합하면 진정한 마술이 일어납니다.

이미 논의한 바와 같이:

사용자의 페이지 방문 시간을 개선하면 순위 결과가 향상됩니다.

긴 체류 시간은 사용자가 만족한다는 것을 Google에 알리고 결과적으로 콘텐츠 순위가 높아집니다.

페이지에 머문 시간을 개선하기 위해 무엇보다 집중해야 할 한 가지가 있습니다.

콘텐츠를 더 읽기 쉽게 만듭니다.

게다가;

짧은 단락
이미지 및 멀티미디어
인용 블록
중요 항목
퀴즈

자신의 트랙에서 "콘텐츠 스키머"를 확실히 막을 수 있도록 부제목과 함께 삽입해야 하는 또 다른 방해 콘텐츠 요소가 있습니다.

사용자 정의 헤더 그래픽

SEO Sherpa 블로그에서 로컬 SEO에 대한 요약을 살펴보세요.

H2 헤더 태그와 함께 게시물의 각 하위 섹션을 소개하는 사용자 지정 그래픽을 추가했습니다.

그들은 게시물을 훨씬 더 인상적으로 보이게 할 뿐만 아니라.

그러나 페이지에 머문 시간을 평균 4분으로 높이는 데 도움이 됩니다.

사이트 평균보다 훨씬 높습니다.

두 명의 정규직 디자이너가 근무할 수 있어 운이 좋았기 때문에 이러한 그래픽을 만드는 것은 쉬웠습니다.

하지만 자신만의 디자인 팀을 구성할 준비가 되지 않았다면 여전히 많은 옵션이 있습니다.

Canva – 이미지 편집 도구(무료)
PicMonkey – 그래픽 디자인 메이커(무료)
99 디자인 – 프리랜서 디자이너(저비용)
Upwork – 프리랜서 플랫폼(저비용)

어떤 경로를 선택하시든.

다음에 긴 SEO 콘텐츠를 작성할 때 헤더 그래픽을 추가하고 페이지에 머문 시간(및 순위)이 올라가는 것을 지켜보십시오.

헤더 태그에 대해 알아야 할 모든 것과 검색 엔진 최적화를 향상시키기 위해 헤더 태그를 사용하는 방법이 있습니다.

이제 당신에게 끝났습니다!

귀하의 사이트에서 이러한 기술을 연습하는 방법

이러한 기술을 활용하여 사이트 성능을 향상시키는 데 도움이 되는 무료 제목 체크리스트를 만들었습니다.

그것은 내가 포스트에서 말한 전략을 정확히 어떻게 사용하는지 단계별로 설명합니다.

아래에서 다운로드 한 후 가장 좋아하는 헤더 작성 팁을 댓글로 알려주세요. 알고 싶습니다.