📌 티스토리 콘텐츠(게시글) 제목을 h1 태그로 바꾸는 방법
구글 SEO에 최적화된 글쓰기를 위해서는 h태그가 중요하다는 점은 다들 알고 계실텐데요. 우선 h태그는 heading의 약자로 제목을 표현해주는 태그입니다. 티스토리의 기본적인 h태그는 콘텐츠(게시글)의 제목, 제목1, 제목2, 제목3으로 4가지가 있습니다.
글의 제목 = <h1> 태그
제목 1 = <h2> 태그
제목 2 = <h3> 태그
제목 3 = <h4> 태그
구글은 짜임새 있는 구조의 글을 좋아하기 때문에 구글 SEO 최적화를 위해서는 '하나의 글에 <h1> 태그는 하나만' 있어야 합니다. 글에 제목이 여러 개이면 이상하잖아요? 어떤 주제에 관해 말하는 글인지 파악하기가 어려운 거죠.
하지만 여기서 문제가 또 있습니다. 티스토리의 반응형 스킨의 경우는 게시글의 제목이 <h2> 태그로 설정되어 있다는 점이에요. 블로그의 이름이 <h1> 태그로 되어 있기 때문입니다(이는 뒤에서 알려드릴게요). 그렇게 되면 구글은 글의 제목이 없는 것으로 인식하게 되는 문제가 발생합니다. 그래서 오늘은 게시글의 제목을 <h1> 태그로 바꾸는 방법을 알려드릴게요!
✅ 티스토리 <h1> 태그를 확인하는 방법
티스토리를 운영하신다면 오디세이, 북클럽, 매거진 등의 반응형 스킨을 많이 쓰실텐데요. 각 스킨마다 차이가 있을 수 있기 때문에 실제 글의 제목이 <h1> 태그가 아닌지, 어떤 태그가 들어가 있는지 등을 우선 확인해야 합니다.
기존의 게시글을 클릭한 후에 'F12'를 누르면 위의 사진과 같이 크롬 개발자 도구가 열립니다. 오른쪽 파트가 크롬 개발자 도구라고 볼 수 있죠.
여기서 오른쪽 상단의 '선택 아이콘'을 클릭해줍니다(사진 속 빨간 네모). 클릭한 후에 왼쪽의 게시글로 가면 제목, 소제목, 본문 등이 어떤 class로 설정되어 있는지 쉽게 확인이 가능합니다.
사진과 같이 게시글에 마우스를 가져다 놓으면 해당 글씨가 어떤 class에로 설정되어 있는지 확인이 가능합니다. 예시 이미지에서 게시글 제목을 <h1> 태그인 것을 확인할 수 있습니다. 제 티스토리의 경우는 이미 설정을 바꿔 놓았기 때문에 <h1> 태그로 뜨지만, 하기 전에는 보통 <h2> 태그로 뜨실 거에요.
✅ 티스토리 글의 제목을 <h1> 태그로 설정하는 방법
이전처럼 티스토리 편집을 위해서는 블로그 관리 - 꾸미기 - 스킨 편집 - HTML 편집으로 들어가 주세요. HTML에서 Ctrl+F를 눌러 'title-article'을 검색합니다. 앞뒤의 h태그를 <h1>, </h1> 태그로 바꿔줍니다(보통은 <h2> 태그로 되어 있을 거에요). 반드시 앞뒤 2개 모두 바꿔주셔야 합니다.
'title-article'을 검색하면 해당 키워드가 3군데에 존재한다는 점을 알 수 있습니다(1 of 3). 문제가 생기지 않도록 반드시 3군데 모두 앞뒤의 h 태그를 <h1>, </h1>으로 바꿔주세요.
게시글의 제목이 기본적으로 <h2>태그로 되어 있는 이유는 블로그의 이름이 <h1> 태그로 되어 있기 때문인데요(반응형 스킨, 오디세이 기준). 따라서 HTML에서 Ctrl+F를 눌러 'title-logo'를 검색한 뒤, 앞뒤의 h태그를 <div>, </div>로 바꿔줍니다.
이렇게 게시글 제목을 <h1> 태그로 바꾸는 작업이 완료되었는데, 잘 설정되었는지 확인이 필요하겠죠? HTML에서 Ctrl+F를 눌러 'h1'을 검색해 'title-article'앞에 <h1> 태그가 있는지 확인해주면 됩니다. 그럼 진짜 완료!
'DIGGING💡 > 티스토리 TIP' 카테고리의 다른 글
| 티스토리의 h태그 크기 변경하는 방법 (0) | 2022.07.14 |
|---|---|
| 티스토리 줄간격 조정하는 방법 (0) | 2022.07.13 |
| 티스토리 본문 크기 조정하는 방법 (폰트 크기 사이트O) (1) | 2022.06.30 |
| 티스토리 alt 태그를 손쉽게 넣는 방법 (2) | 2022.06.29 |
| 티스토리 편집 시 Ctrl+F 검색 안 될 때 해결방법 (1) | 2022.06.27 |