HTML 입문 | HTML 시작 | HTML 기본 구조

Tags:

HTML 기본 구조

다음은 HTML 문서의 기본적인 구조를 보여주는 그림이다.

HTML 기본구조

<!DOCTYPE> : 현재 문서가 HTML 문서 타입을 명시한다. (HTML5 문서 타입은 <!DOCTYPE html> 이다.)

<html> : HTML 문서의 루트(root) 요소를 정의한다.

<head> : HTML 문서의 메타데이터(metadata)를 정의한다.

  • 메타데이터(metadata)란 HTML 문서에 대한 정보(data)로 웹 브라우저에는 직접적으로 표현되지 않는 정보를 의미한다.
  • 이러한 메타데이터는 <title>, <style>, <meta>, <link>, <script>, <base>태그 등을 이용하여 표현할 수 있다.

<title> : HTML 문서의 제목(title)을 정의하며, 다음과 같은 용도로 사용된다.

  • 웹 브라우저의 툴바(toolbar)에 표시된다.
  • 웹 브라우저의 즐겨찾기(favorites)에 추가할 때 즐겨찾기의 제목이 된다.
  • 검색 엔진의 결과 페이지에 제목으로 표시된다.

<body> : 웹 브라우저를 통해 보이는 내용(content) 부분이다.

<h1>~<h6> : 제목(heading)을 나타낸다.

<p> : 단락(paragraph)을 나타낸다.

<! DOCTYPE> 종류

HTML 5

HTML 5 버전이다.

 <!DOCTYPE html>

HTML 4.01 Strict

이 DTD는 모든 HTML 요소와 속성을 포함하고 있지만, 표상적인 또는 사용되지 않는 요소가 포함되어 있지 않는다. (글꼴 등) 프레임 셋은 허용되지 않는다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">

HTML 4.01 Transitional (권장)

이 DTD는 표상적인 및 사용되지 않는 요소를 포함하여 모든 HTML 요소와 속성이 포함되어 있다. (글꼴 등) 프레임 셋은 허용되지 않는다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">

HTML 4.01 Frameset

이 DTD는 HTML 4.01 Transitional 동등하지만, 프레임 콘텐츠의 사용을 허용한다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0 Strict

이 DTD는 모든 HTML 요소와 속성을 포함하고 있지만, 표상적인 또는 사용되지 않는 요소가 포함되어 있지 않는다.(글꼴 등) 프레임 셋은 허용되지 않는다. 태그는 또한 제대로 구성된 XML을 작성해야 한다.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional (권장)

이 DTD는 표상적인 및 사용되지 않는 요소를 포함하여 모든 HTML 요소와 속성이 포함되어 있다. (글꼴 등) 프레임 셋은 허용되지 않는다. 태그는 또한 제대로 구성된 XML을 작성해야 한다.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 Frameset

이 DTD는 XHTML 1.0 Transitional과 동일하지만, 프레임 콘텐츠의 사용을 허용한다.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1

이 DTD는 XHTML 1.0 Strict과 동일하지만, 모듈을 추가 할 수 있다. (예를 들어 동아시아 언어에 대한 루비의 지원을 제공하기 위해)

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">



최종 수정 : 2021-08-27