HTML은 웹사이트에서 콘텐츠 서식 지정, 제목 작성, 텍스트 정렬, 섹션 추가 등 다양한 작업을 수행할 수 있도록 여러 태그를 제공합니다. 그중에서도 HTML 문서를 구성하는 데 반드시 필요한 핵심 태그는 doctype, <html>, <head>, <title>, <body>입니다.
1. doctype — 문서 유형 선언
doctype은 문서 유형 선언(DOCTYPE Declaration)으로, 해당 문서가 어떤 버전의 HTML을 사용하는지 브라우저에 알려주는 역할을 합니다. HTML5에서는 아래와 같이 간단하게 한 줄로 선언할 수 있습니다.
<!DOCTYPE html>
2. <html> — 최상위 컨테이너 태그
HTML의 <html> 태그는 <!DOCTYPE html> 선언을 제외한 모든 HTML 요소를 감싸는 최상위 컨테이너입니다. 즉, 문서를 구성하는 모든 요소는 <html>과 </html> 태그 사이에 중첩되어 작성됩니다.
3. <head> — 문서 정보 영역
<head> 태그는 HTML 문서의 머리 부분(헤더 영역)을 나타냅니다. 이곳에는 문서의 메타 정보, 외부 스타일 시트 연결, 자바스크립트 등이 포함되며, <head> 안에 작성된 내용은 브라우저 화면에는 직접 표시되지 않습니다.
4. <title> — 문서 제목 태그
<title>...</title> 태그는 <head> 태그 내부에 위치하며 문서의 제목을 정의합니다. 이 제목은 웹 브라우저의 탭과 제목 표시줄에 나타나며, 검색 엔진 최적화(SEO) 측면에서도 매우 중요한 요소입니다.
<head> <title>HTML Document</title> </head>
5. <body> — 본문 콘텐츠 영역
<body> 태그는 HTML 문서의 본문, 즉 사용자에게 실제로 보여지는 주요 콘텐츠가 담기는 영역을 나타냅니다. 단락을 만드는 <p> 태그, 굵은 글씨를 위한 <strong> 태그, 순서 없는 목록을 위한 <ul> 태그 등 대부분의 콘텐츠 관련 태그가 <body>...</body> 안에 작성됩니다.
마무리: 기본 HTML 문서 구조 예시
위에서 살펴본 필수 태그들을 조합하면 다음과 같은 기본적인 HTML 문서 구조가 완성됩니다.
<!DOCTYPE html> <html> <head> <title>HTML Document</title> </head> <body> <p>안녕하세요! HTML 학습을 시작해 보세요.</p> </body> </html>
이 다섯 가지 태그만 확실히 이해해도 HTML 문서의 전체 구조를 파악할 수 있으며, 앞으로 더 다양한 태그와 속성을 익히는 데 탄탄한 기반이 될 것입니다.