본문 바로가기
  • 내 손안 세상 보기 니 해피
IT

H1 요소 중복 문제 해결 방법

by 니해피 2024. 7. 29.
반응형

H1요소는 콘텐츠의 페이지 내용을 가장 대표할 한 곳인 제목에 태그를 하여야 한다. HTML문서에 H1요소가 2개 이상 발견된다면 검색 로봇이 콘텐츠를 이해하기 어려운 구조가 되므로 H1 요소 중복 문제를 해결하는 것이 좋다. 검색결과에 더 나은 콘텐츠 제공에 도움이 될 수 있기 때문이다.

 

H1오류 수정을 통한 검색 엔진 최적화를 통하여 검색 로봇이 콘텐츠를 더 잘 이해하도록 블로그를 하고 있다면 SEO에 도움이 되는 H1 요소 중복 문제 해결 방법을 함께 배워보자.

 

티스토리 북스 킨 H1요소 중복 문제 해결 방법

 

 

티스토리 북스 킨의 H1 요소 중복 문제는 블로그 상단의 header 부분 블로그 제목이 H1으로 태그 되어 있기 때문에 각페이지의 제목과 중복되는 것이 그 원인이다.

 

H1 태그는 제목을 나타내는 데 사용하는 태그임을 티스토리 북스킨 개발자가 모를 리 없을 텐데 헤더 부분의 블로그 이름을 H1으로 태그 한 이유를 잘 모르겠다. 아무튼 H1 중복 문제 해결을 위해서는 해더 부분의 블로그 제목의 태그를 수정하면 간단하게 해결할 수 있다.

 

수정방법은 H1 태그를 DIV 태그 또는 P태그로 변경 사용하거나 h1대신에 h2로 수정함으로써 가능하다고 할 것이다.

 

네이버 서치어드바이져, 구글서치콘솔, 빙 웹마스터 도구 모두에서의 오류 경고는 신경이 무척 쓰이기 마련이다. 아래는 네이버 서치콘솔에 있는 문구이다.

H1요소 중복

 

Notice : H1요소가 2개 이상 발견 2개 인스턴스를 발견했습니다

'블로그 이름'

'전체글 000'

 

H1요소는 콘텐츠를 나타내는 페이지 제목으로 사용되어야 한다.

티스토리에서 무료로 제공하고 있는 북 스킨은 블로그 이름과 글제목이 H1태그로 중복되어 SEO측면에서 문제가 되고 있는 것이므로 SEO를 위해서는 중복되는 부분인 블로그 제목의 H1태그를 찾아내어 그 H1태그를 다른 태그로 변경함으로써 해결을 할 수 있다.

 

티스토리 북스킨의 H1요소가 중복되는 문제를 해결하려면 HTML편집창에서 다음 단계를 따른다.

 

관리자 페이지 → 꾸미기 → 스킨편집 → html편집

 

1. 티스토리 관리자 페이지 : 티스토리 블로그 관리자 페이지로 이동한다

2. 스킨 편집으로 이동 : 블로그 관리자 페이지에서 꾸미기 → 스킨 편집 → HTML편집으로 이동한다

3. H1요소 수정 : html과 CSS 모두 수정을 하여야 한다

 

ⓐ html 수정 : HTML코드에서 <header> 태그를 찾아 [ctrl + F]서 <h1> 요소를 확인한다.

블로그 이름에 사용된 <h1>태그를 <div class="blog_name"> // <div class="blog-header"> 태그로 변경한다.

 

예] <h1> <a> .................. </a><h1> → <div class="blog_name"><a>.................. </a></div>

 

DIV태그대신에 P태그로 바꿀 수도 있다.

 

H1요소수정
H1수정과정

 

ⓑ CSS수정 : CSS에서 #header를 검색한다. #header부분에 h1코드가 3개, 뒤쪽 미디어스크린에 2개가 더 있다. 총 5개의 h1태그를 'blog-header'로 모두 변경한다.

 

예] h1 →. blog-header (이때 점[.]을 빼먹지 말아야 한다)

 

/*layout sele*/

#header h1 {  → #header. blog-header

#header h1 a {  → #header. blog-header a

#header h1 img { → #header. blog-header img

 

/*media screen*/

#header h1, → #header. blog-header,

#header h1 { → #header. blog-header {

 

4. 변경 사항 저장 : 모든 변경사항을 저장하고 블로그를 새로 고침 하여 문제가 해결되었는지 확인을 한다. 수정 후 저장하지 않으면 변경사항이 적용되지 않으므로 주의하여야 한다.

 

H1 중복 인스턴스 오류문제 해결은 하나의 H1 태그만 존재하도록 페이지 소스에서 중복하는 H1태그를 제거하는 것으로 북스킨에서는 헤더의 블로그 제목 부분이 H1태그로 되어 문제가 발생되는 것이므로 이를 변경 또는 수정해 줌으로써 간단하게 해결할 수 있는 것이다.

 

문제는 초보자는 이런 것을 수정할 줄 모른다는데 어려움을 느끼는 것이다.

 

H1요소 중복문제 해소를 위하여 편집창에서 수정일 할 때 html과 CSS모두 수정해야 함에 유의하여야 할 것이다. 티스토리에서 북스킨을 사용 중이라면 SEO를 위해 도움이 될 것이므로 참조하여 수정하는데 도움이 되길 바라겠다.

 

 

블로그를 운영하면서 H1요소 2개 이상 발견되는 문제 해결을 지금까지 미뤄두고 있었으나 여러 요인들이 있겠지만 요즘 유입이 예전 같지도 않아 SEO문제 해결 필요성이 부각되고 있었다. 그런 데다가 H1중복 문제를 해결하라는 서치어드바이저 및 서치콘솔, 웹마스터도구에 있는 문구가 거슬려 더 이상 미룰 수 없다고 판단하여 드디어 이문제를 해결해 보았다.

 

 

 

반응형

댓글