블로그를 운영하면서 검색 엔진 최적화에 신경 쓴다면 H1 태그를 올바르게 쓰는 것만큼 중요한 게 없어요. 그런데 티스토리 같은 블로그 플랫폼을 쓰다 보면 기본 스킨 설정 때문에 나도 모르게 H1 태그가 두 개씩 잡히는 이중 H1 태그 문제가 발생하곤 해요. 오늘은 이렇게 숨겨진 중복 태그를 찾아내서 깔끔하게 P 태그로 바꾸는 방법을 알려드릴게요. 이 과정만 거쳐도 검색 엔진이 내 글을 훨씬 더 잘 이해하고 구조가 명확해진답니다.
H1 태그가 중요한 이유와 중복될 때 생기는 문제
블로그를 키우려면 가장 먼저 챙겨야 할 부분이 바로 H1 태그예요. H1 태그는 홈페이지 코드 상에서 이 페이지의 ‘대문’과 같은 역할을 하거든요. 검색 엔진은 이 태그를 보고 “아, 이 글은 이런 내용을 담고 있구나” 하고 파악하게 됩니다.
하지만 페이지 안에 이중 H1 태그가 있다면 어떨까요? 대문이 두 개나 있으니 검색 엔진은 어떤 게 진짜 제목인지 헷갈리게 됩니다. 이렇게 되면 결국 내 글이 검색 결과에서 좋은 자리를 잡는 데 방해가 될 수밖에 없어요. 특히 많은 기본 스킨들이 블로그 이름과 글 제목 모두에 H1을 쓰고 있어서, 이걸 하나로 정리해 주는 과정이 꼭 필요해요.
하나의 주제를 위한 올바른 태그 습관
H1 태그는 페이지 전체를 아우르는 단 하나의 핵심 주제만 담고 있어야 해요. 구글이나 네이버 같은 검색 엔진들도 페이지당 딱 하나의 H1 태그만 사용하는 걸 권장하고 있죠.
만약 본문 중간에 소제목이 필요하다면 H2나 H3 같은 하위 태그를 순서대로 써주는 게 좋아요. 그래야 검색 엔진도, 글을 읽는 사람도 내용을 훨씬 쉽게 이해할 수 있거든요. 이렇게 구조를 잘 잡아두면 글이 훨씬 전문적으로 보이고 핵심 내용이 더 잘 드러난답니다.
스킨에 숨어있는 중복 태그의 문제점
티스토리나 워드프레스의 특정 테마들을 보면 로고나 블로그 이름 부분에 이미 H1 태그가 설정된 경우가 꽤 많아요. 이 상태에서 글을 쓰면 자연스럽게 페이지 하나에 H1이 두 개가 되어버리는 거죠. 이런 구조적인 혼란은 검색 엔진의 신뢰를 떨어뜨릴 수 있어요. 그래서 우리는 스킨의 HTML 소스를 직접 조금만 만져서 이중 H1 태그를 정리해 줄 필요가 있답니다.
티스토리 블로그에서 중복 태그 고치는 순서
제목 태그만 잘 정리해도 페이지의 뼈대가 아주 튼튼해져요. 그럼 이제 실제 티스토리 스킨에서 이중으로 잡히는 H1 태그를 어떻게 찾아내고 수정하는지 차근차근 살펴볼게요.
HTML 편집으로 태그 바꿔주기
보통 스킨에 숨겨진 H1 태그는 사이트 이름(로고)을 감싸고 있어요. 이 녀석을 찾아서 중요도가 낮은 P 태그나 DIV 태그로 바꿔주는 게 포인트예요.
- 스킨 변경 메뉴 들어가기: 관리자 페이지에서 ‘스킨 변경’ 메뉴로 이동해 주세요.
- HTML 편집기 열기: ‘HTML 편집’ 버튼을 눌러서 소스 코드를 엽니다.
- H1 태그 찾아서 바꾸기:
header부분 근처에서 H1 태그를 찾아보세요. 보통 블로그 이름이 이 태그 안에 들어있는데, 이걸p태그로 바꿔주시면 돼요. - CSS 스타일 맞추기: HTML에서 태그를 바꿨다면 CSS에서도 해당 스타일(글자 크기 등)이 P 태그에 적용되도록 이름을 맞춰줘야 디자인이 깨지지 않아요.
- 모바일 화면 확인하기: PC 버전만 고치면 안 돼요. 모바일에서도 수정을 안 하면 제목 버튼에 오류가 날 수 있으니 꼭 같이 체크해 주세요.
이런 간단한 수정만으로도 검색 엔진 최적화(SEO)에서 훨씬 유리한 위치를 차지할 수 있어요.
참고: 위 이미지는 스킨의 중복 H1 태그를 P 태그로 변경하여 본문 제목과의 충돌을 막는 실제 과정이니 참고해서 따라 해 보세요.
메타 태그와 H1 태그는 역할이 달라요
페이지 제목은 검색의 시작이고, 카톡 같은 곳에 공유될 때 보이는 메타 태그(og:title)와도 밀접하게 연결돼요.
쉽게 말해 H1 태그는 본문 내용의 대장이고, 메타 태그는 검색 결과창이나 SNS에서 사람들을 부르는 간판이라고 생각하면 이해가 쉬울 거예요. 역할이 다르니까 H1은 구조를 탄탄하게 하는 데 집중하고, 메타 태그는 사람들이 클릭하고 싶은 문구로 만드는 게 좋겠죠.
아래는 블로그에 들어가면 좋은 메타 태그 예시예요.
<title>페이지 제목</title>
<meta name="description" content="페이지 요약 설명" />
<meta property="og:type" content="article" />
<meta property="og:title" content="소셜용 제목" />
<meta property="og:image" content="이미지 주소" />
<meta name="twitter:card" content="summary_large_image" />조수의 한마디: H1 태그는 SEO의 기본 중의 기본이에요. 조금 귀찮더라도 한 번만 제대로 설정해두면 모든 글이 검색 엔진에 더 예쁘게 수집된답니다. 올바른 태그 사용으로 여러분의 소중한 글이 더 많은 사람에게 닿길 바랄게요!
자주 묻는 질문 정리
Q. H1 태그를 한 페이지에 여러 번 쓰면 정말 큰일 나나요?
기술적으로 불가능한 건 아니지만, 검색 점수를 잘 받으려면 하나만 쓰는 게 정석이에요. 여러 개를 쓰면 주제가 흩어져서 순위 싸움에서 불리해질 수 있거든요.
Q. 이중 H1 태그인지 어떻게 알 수 있나요?
인터넷 창에서 F12 키를 눌러 개발자 도구를 켜보세요. 그리고 Ctrl + F를 눌러 <h1을 검색해 보는 거죠. 만약 두 개 이상 나온다면 수정이 필요한 상태랍니다.
Q. P 태그로 바꾸면 디자인이 망가지지 않나요?
태그만 바꾸고 CSS에서 기존 스타일을 그대로 연결해 주면 방문자가 보는 화면은 똑같아요. 검색 엔진만 “아, 여기가 진짜 제목이구나!” 하고 깔끔하게 인식하게 되는 거니 걱정 마세요.
