웹디자인 핵심! 헤딩 계층 구조 완전 정복 가이드
게시일:
작성자: 자청의 유튜브 추출기
- 이 영상은 헤딩 계층 구조를 설명해요.
- 헤딩 계층 구조란 무엇인지 알려줍니다.
- 올바른 구현 방법과 나쁜 예도 보여줍니다.
- 웹 디자인에서 6가지 제목 크기를 소개해요.
- HTML로 제목을 H1부터 H6까지 표현하는 방식을 설명합니다.
- 기본 스타일로 제목 크기는 점점 작아집니다.
- WordPress, Gutenberg, Elementor 등 편집기에서 제목 선택법을 보여줍니다.
- 제목 계층 구조는 페이지의 내용을 계층적으로 보여줍니다.
- 예를 들어, 갈매기 페이지를 통해 설명합니다.
- H1은 페이지 전체 주제, H2는 큰 섹션을 나타냅니다.
- H3, H4 등은 세부 내용을 나타내요.
- 제목 크기는 H1이 가장 크고 H6이 가장 작습니다.
- 대부분 웹사이트는 H4까지만 사용해요.
- 긴 콘텐츠가 아니면 H5, H6는 거의 사용하지 않습니다.
- 실제 웹사이트 예시로 HTML 구조를 보여줍니다.
- 잘못된 예로, 계층이 깨진 제목 사용을 설명합니다.
- 예를 들어, H2 아래에 H5가 오는 실수입니다.
- 또, H1이 단락처럼 사용된 사례도 보여줍니다.
- 올바른 규칙은 H1은 하나만, 페이지 전체를 설명해야 해요.
- 제목 스타일은 미리 정하고 일관되게 써야 합니다.
- 각 섹션마다 H2 제목을 사용하는 게 좋아요.
- 예외로, 눈에 띄는 섹션은 사용자 지정 크기를 써도 됩니다.
- 제목은 너무 길지 않게 적절한 길이로 유지하세요.
- 제목 계층 구조를 잘 지키면 사용자와 검색엔진 모두에게 좋아요.
- 더 배우고 싶으면 다른 영상이나 웹사이트에서 확인하세요.