헤딩 태그
Heading Tag
헤딩 태그는 HTML의 h1부터 h6까지 문서의 제목과 하위 구획 계층을 나타내는 요소입니다. 글자를 크게 만드는 장식 수단이 아니라 페이지 내용을 구조화하고 탐색을 돕는 의미 표지입니다.
AI 보조 조사·작성 후 원문과 대조한 설명입니다. 사례·계산은 별도 출처 표기가 없는 한 이해를 위한 가상 예시이며 실제 고객 성과가 아닙니다.
헤딩 단계는 무엇을 나타내나요?
MDN 헤딩 요소 문서는 h1부터 h6를 여섯 단계의 구획 제목으로 설명하며 글자 크기 조절에는 CSS를 쓰라고 안내합니다. Google 제목 링크 안내는 화면의 주요 제목과 헤딩이 검색 결과 제목을 정하는 신호가 될 수 있다고 설명합니다. 헤딩은 검색 엔진만을 위한 표지가 아니라 독자와 보조기술이 문서 구조를 훑는 기준입니다.
가상 문서 구조를 어떻게 고치나요?
가상 쇼핑몰 환불 안내가 굵은 문장만 이어지고 h1이 세 개 있다고 가정합니다. 페이지의 대표 제목을 h1 환불 및 교환 안내로 두고, h2 신청 가능 기간, 상품별 제외 조건, 접수 절차를 배치합니다. 접수 절차 아래에 h3 택배 접수와 매장 방문을 둡니다. 글자 크기는 CSS로 정하며 환불을 모든 헤딩에 억지로 반복하지 않습니다.
검수 방법
- 헤딩만 읽어도 문서의 순서와 범위가 보이는가?
- 상위 구획 없이 하위 단계가 갑자기 시작하지 않는가?
- 단순 강조 문장을 헤딩으로 잘못 표시하지 않았는가?
- 아코디언 제목도 실제 구조와 접근성 이름을 갖는가?
헤딩과 title·디자인 문구는 무엇이 다른가요?
title 요소는 문서 전체의 메타 제목이고 h1은 화면 콘텐츠의 대표 제목입니다. h2 이하의 헤딩은 본문 안에서 하위 구획을 나눕니다. 큰 글자라고 자동으로 헤딩이 되는 것은 아니며, 반대로 CSS로 작게 보이더라도 h2는 의미상 구획 제목입니다. 역할과 시각 스타일을 분리해야 구조 변경이 디자인에 종속되지 않습니다.
헤딩을 많게 넣으면 SEO에 유리한가요?
개수나 키워드 밀도로 성과를 보장할 수 없습니다. 짧은 문서에 불필요한 하위 제목을 늘리면 흐름이 끊기고, 모든 제목을 비슷한 검색어로 채우면 구획 차이가 사라집니다. 내용 덩어리가 실제로 나뉠 때 헤딩을 만들고, 각 제목은 아래 문단의 질문을 정확히 예고하도록 씁니다. 헤딩 구조를 바꿀 때는 화면 순서와 접힌 영역과 보조기술의 탐색 순서를 함께 살펴야 시각적으로만 자연스럽고 문서 계층에서는 상위 구획이 사라지는 오류를 놓치지 않을 수 있으며 모바일과 데스크톱에서 같은 내용이 다른 태그로 중복 출력되는 템플릿 문제도 발견할 수 있습니다.
자주 묻는 질문
- H1은 한 페이지에 몇 개가 필요한가요?
- 일반적으로 페이지 내용을 대표하는 H1 하나를 두는 편이 명확합니다. 하위 내용은 H2와 H3 등으로 계층화합니다.
- 글자를 크게 보이게 하려면 헤딩 태그를 써도 되나요?
- 크기만 바꾸려는 목적이라면 CSS를 사용해야 합니다. 헤딩은 문서 구획의 의미를 나타낼 때 사용합니다.
출처와 확인 범위
- The HTML Section Heading elements · MDN Web Docs · 확인 2026-10-27
h1부터 h6는 여섯 단계의 구획 제목을 나타내며 글자 크기 조절용으로 쓰지 않고 문서 계층에 맞춰 중첩해야 합니다.
확인 범위: 표시한 절의 정의·작동 조건·한계만 사용했습니다. 순위·검색량·트래픽·전환 보장, 제공사 제품 추천과 임의 기준은 근거로 사용하지 않았습니다.
- Influencing your title links in search results · Google Search Central · 확인 2026-10-27
검색 결과 제목 링크는 자동 생성되며 title 요소 외에도 화면 제목·헤딩·링크 문구 등의 신호가 사용될 수 있습니다.
확인 범위: 표시한 절의 정의·작동 조건·한계만 사용했습니다. 순위·검색량·트래픽·전환 보장, 제공사 제품 추천과 임의 기준은 근거로 사용하지 않았습니다.