검색 엔진 최적화(search engine optimization, SEO)를 위한 h 태그 설정에 대해 알아보도록 합시다. 티스토리 오디세이 스킨을 기준으로 설명을 드리려고 하는데, 다른 블로그 스킨도 비슷하니 한 번 찾아보세요. 😘
게시물이 상위 페이지에 노출이 될 수 있도록 최적화 하는 데에는 <h> 태그가 관련이 크다고 합니다. (h 태그는 header, heading 의 의미를 가지고 있습니다) <h1> 태그부터 <h3> 태그를 내림차순으로 적당히 정렬하면 엔진이 최적화 정도를 높게 평가하는 것이죠.
티스토리 블로그 상단의 문단모양 또한 <h> 태그를 제공하고 있습니다. 제목1부터 <h2> 태그입니다. ( 제목1 : <h2> 제목2 : <h3> 제목3 : <h4> ) 다음과 같은 배치가 최적화 정도를 좋게 평가하는 것으로 보입니다.
- <h2> 제목1 </h2>
- <h3> 부제목1.1 </h3>
- <h3> 부제목1.2 </h3>
- <h2> 제목2 </h2>
- <h3> 부제목2.1 </h3>
티스토리 블로그 제목 h2 에서 h1 으로 변경하기
저는 블로그 제목을 <h1> 으로 설정하고 내용에 h2, h3 를 적절히 섞어서 SEO를 최적화 해보려고 합니다. 티스토리 블로그는 제목을 기본적으로 <h2> 로 제공하고 있어서 <h1> 으로 변경해 보았습니다. 다음은 제가 h1 으로 제목을 변경한 것에 대한 기록입니다.
h2 태그 찾기 : inspect h2 tag (title-article class)
F12 를 눌러보시면 개발자도구가 나옵니다.
크롬 브라우저를 사용하시는 경우, F12 로 보이게 된 화면 제일 왼쪽 위의 inspect 화살표를 누르면 태그를 빨리 찾으실 수 있답니다.
h2.title-article 이라고 표시가 됩니다. 이 부분을 찾아서 수정해봅시다.
h2 태그 변경 : title-article 클래스 찾기
블로그관리 > 꾸미기 > 스킨편집 > html편집 을 선택합니다.
title-article 을 검색해 주세요.
참고로 아까 전의 h2.title-article 에서 h2 는 태그를 의미하고 .(dot) 은 class 선택자를 의미하며 title-article 은 class 이름을 의미합니다.
저는 <h2> 태그를 <h1> 으로 변경하겠습니다. 종료태그도 꼭 </h1>으로 수정하시는 것 잊지 마세요~
(올바르지 않은 경우 사진과 같이 붉게 표시가 됩니다.)
이렇게 하여 타이틀 태그를 h2에서 h1으로 변경하였습니다. 무조건 따라서 하라는 건 아니고 제가 이렇게 변경했다는 것입니다~ h1 태그로 변경했다고 하여 최적화에 꼭 반영이 되리라 장담할 수는 없습니다. 그래도 심적으로 무언가 검색 엔진 최적화에 한 걸음 다가갔다는 뿌듯함은 있어요. 😘