SOYOYU
헤딩

<h4>~<h6>

h3 아래 깊은 위계의 헤딩. 대부분의 페이지에는 등장하지 않음.

SEO·GEO·AEO·A11y 4축에서의 의미

SEO

●●○○○낮음

페이지의 매우 세부 구조. SEO 직접 영향 적음. 위계 정연함이 더 중요.

GEO

●●○○○낮음

AI가 매우 구체적 답변을 만들 때 h4 인용 가능. 빈도는 낮음.

AEO

●●○○○낮음

답변 인용에 직접 영향 적음.

A11y

●●●○○중간

깊은 위계 사용자에게 도움. 다만 너무 깊은 위계는 헤딩 목록 자체가 복잡해짐.

올바른 사용

  • h3까지로 충분한 페이지가 대부분
  • 기술 문서·긴 가이드에서만 h4 등장
  • 위계 점프 금지 — h3 다음에 h4
  • 시각 크기는 작아도 의미는 유지
기술 가이드의 깊은 위계
<article>
  <h1>API 가이드</h1>
  <h2>인증</h2>
  <h3>OAuth 2.0 흐름</h3>
  <h4>Authorization Code 단계</h4>
  <p>...</p>
  <h4>Token Refresh 단계</h4>
  <p>...</p>
</article>

API 문서의 깊은 위계. h2 → h3 → h4로 점프 없이.

자주 보는 안티패턴

  • 위계 점프 (h2 → h4)
  • 시각 강조용 h6 — 작은 텍스트 강조
  • 필요 없는데 헤딩 깊이 만들기
  • h4 이하를 div로 — 헤딩 목록 누락
위계 점프
<h2>섹션</h2>
<h4>하위 항목</h4>

h3 없이 h4. 없는 h3의 하위로 들림.

시각 강조용 h6
<p>본문 끝에...</p>
<h6 className="text-xs">작은 부연 설명</h6>

시각이 작다고 h6 — 의미상 헤딩이 아니라면 p나 small이 적절.

해설

h3 아래의 깊은 위계 헤딩. 일반 마케팅·블로그·랜딩 페이지에는 등장하지 않는 경우가 대부분. 기술 문서, API 가이드, 긴 매뉴얼처럼 위계가 깊은 콘텐츠에서만 자연스럽다.

SEO 관점에서 h4 이하는 직접적인 SEO 영향이 작다. 페이지의 위계가 깊이 정리됨은 신호이지만, 얕은 위계 페이지가 SEO에서 불리하지는 않다. 오히려 얕고 명확한 페이지가 일반 검색에서는 더 효과적.

GEO 관점에서 AI가 매우 구체적인 답변을 만들 때만 h4 단위 인용이 등장. "이 API의 토큰 갱신 절차는?" 같은 매우 세부적 질문에 h4 "Token Refresh 단계"가 인용. 일반 질문에는 h2-h3 단위가 표준.

A11y 관점에서 깊은 위계 페이지에서 h4 이하는 사용자의 세부 점프에 도움. 다만 너무 깊은 위계는 헤딩 목록 자체가 복잡해져서 — 사용자가 어디로 가야 할지를 결정하기 어려워진다. 4-5단계가 실용적 한계.

자주 보는 안티패턴: 위계 점프(h2 다음에 h4 — 없는 h3의 하위로 들림), 시각이 작다는 이유로 h6를 부연 설명에 사용(시맨틱 헤딩이 아니라면 p 또는 small이 적절), 필요 없는데 깊이 만들기(콘텐츠의 자연스러운 위계는 보통 h1-h3로 충분).

<h5><h6>은 실제 페이지에서 거의 등장하지 않는다. WebAIM Million 분석에 따르면 h5는 전체 페이지의 5% 미만, h6는 1% 미만에서만 사용된다. 즉 대부분의 페이지에 h4 이하는 필요 없다는 신호. 깊은 위계가 필요한 경우는 — 기술 매뉴얼, 학술 논문, 정부 문서 같은 공식적 긴 문서에 한정.

UI 라이브러리의 헤딩 처리 — shadcn, Radix, Headless UI 모두 컴포넌트가 헤딩 레벨을 강제하지 않는다. 사용자가 as prop이나 직접 마크업으로 레벨 결정. 컴포넌트 재사용 시 어느 컨텍스트에서 어느 레벨로 들어가는가를 결정하는 패턴(시리즈 #5에서 본 <Section title="..." level={2}> 패턴)이 표준.

h1-h6 6개 카드 중 4개로 정리한 이유 — h4·h5·h6 모두 같은 규칙(위계 유지, div 대체 금지, 시각 아닌 의미)을 따르고, 카드 한 장에 통합 가능. 도감의 조밀도 vs 의미 깊이의 트레이드 오프에서 — 통합 카드가 사용자 학습에 더 효율적이라는 판단.