HTML이란
HTML에 대해 한번이라도 찾아보셨다면 Hyper Text Markup Language라는 말을 들어봤을 겁니다. HTML에서 HT를 담당하는 Hyper Text란 문서와 문서가 연결되어있음을 의미하며 M은 Markup 즉 마크업 언어로 태그 등을 이용하여 문서나 데이터의 구조를 설계하는 언어를 의미합니다.
구조
HTML은 웹페이지를 만드는데 가장 난이도가 쉬운 측에 속합니다. 이미 정의되어있는 태그들과 속성을 사용해 구성하면 됩니다. 태그는 여는 꺽쇠(<)와 태그명, 닫는 꺽쇠(>)로 사용할 수 있습니다. 태그의 시작을 알렸다면 닫는 태그 역시 사용하셔야 합니다. 아래 코드를 확인해주세요.
<div> div라는 태그로 시작했으며 시작한 태그에 /만 추가하여 닫는태그를 알립니다. </div>
<태그이름> // 시작 태그
</시작태그이름> //닫는 태그
<h1>제목</h1>
<p>단락</p>
<d iv clas s="item"> // 이와같이 태그명과 속성명엔 공백이 존재할 수 없음, 공백시 모두 각각의 속성으로 간주함
코드에도 설명했지만 태그를 시작했으면 같은 태그명으로 끝내야 합니다. 끝내는 방법은 단지 /
만 추가하면됩니다.
<img src="https://~~" alt="picture" />
<br>
<hr>
예외적으로 <img>
<br>
<hr>
등과 같은 닫는 태그가 없는 태그도 존재하는데 이는 빈 태그(empty tag)라고 합니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>title</title>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
HTML은 모두 위와 같은 구조를 이룹니다. DOCTYPE html은 웹문서가 어떤 버전의 HTML 언어로 작성되어있는지 결정하는 기능이며 웹브라우저에 해당 정보를 전달합니다. 브라우저는 이 정보를 통해 버전에 맞는 HTML 기술을 이용해 페이지를 로드해줍니다.
HTML에도 버전이 존재합니다. HTML5에는 존재하는 태그가 있지만 HTML4에는 없는 태그가 있습니다. 만약 DOCTYPE 선언 없이 구버전의 HTML이나 신버전의 HTML을 사용한다면 오류가 발생할 것입니다.
과거에 조금이라도 HTML을 공부하신 분이라면 <center>
와 같은 태그명을 알 것입니다. 이는 중앙으로 정렬하는 태그이나 HTML5에서는 표준적이지 않아 더 이상 사용하지 않습니다.
하지만 여전히 구버전의 표준대로 작성된 웹이 수없이 많으며 이 를 모두 수정하기에는 천문학적 시간이 투자될 것입니다. 그렇다고 오류로 간주한다면 엄청난 양의 데이터를 모두 손실하게 됩니다. 이에 따라 호환성을 위하여 선언을 해주는 겁니다.
HTML5에서는 <!DOCTYPE html>이라는 코드를 문서 최상단에 작성함으로써 간단하게 선언할 수 있습니다.
HTML 버전 선언법
버전 | 선언법 |
HTML 4.01 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
XHTML 1.0 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
HTML 5 | <!DOCTYPE html> |