Body 영역
📦 Body 영역이란?
정의
body는 브라우저 화면에 실제로 표시되는 모든 콘텐츠를 담는 영역이다.
HTML 문서에서 head가 문서의 정보를 담는 영역이라면, body는 사용자가 직접 보게 되는 본문 영역이다.
🧱 Body 영역의 주요 구조
HTML의 body 안에는 화면을 구성하는 여러 구조 요소가 들어간다.
headernavsectionarticleasidefooter
🏷️ header
정의
header는 페이지나 섹션의 머리말 영역이다.
- 로고
- 제목
- 검색창
- 상단 메뉴
🧭 nav
정의
nav는 다른 페이지나 현재 페이지의 다른 위치로 이동하기 위한 탐색 링크 모음이다.
- 메뉴 링크
- 목차 링크
- 페이지 이동 링크
🗂️ section
정의
section은 주제별로 내용을 구획화할 때 사용하는 영역이다.
- 문서의 큰 주제 단위
- 의미 있는 내용 묶음
- 여러 article을 포함할 수 있음
📰 article
정의
article은 독립적으로 읽히는 완결된 콘텐츠를 의미한다.
- 블로그 글
- 뉴스 기사
- 게시글
🧩 aside
정의
aside는 본문과 직접적이지는 않지만 보조적으로 참고할 수 있는 정보를 담는다.
- 사이드바
- 관련 링크
- 광고
- 보충 설명
🧾 footer
정의
footer는 문서나 섹션의 마무리 정보를 담는 영역이다.
- 저작권 정보
- 연락처
- 관련 링크
- 페이지 하단 안내
🧪 body 구성 예시
<body>
<header>상단 영역</header>
<nav>메뉴</nav>
<section>
<article>주요 콘텐츠</article>
</section>
<aside>보조 정보</aside>
<footer>하단 정보</footer>
</body>
🔍 정리
body는 화면에 보이는 실제 본문 전체를 감싼다.header,nav,section,article,aside,footer같은 시맨틱 태그를 함께 사용하면 문서 구조가 더 명확해진다.- 구조를 잘 나누면 가독성과 유지보수성이 좋아진다.
댓글남기기