HTML 이란?
다양한 인터넷 상의 정보를 웹 브라우저에 보여줄 때 사용하는 언어가 바로 HTML이다.
즉 HTML은 웹 문서를 만드는 언어이다.
HTML(Hyper Text Markup Language)
하이퍼텍스트란 문서를 서로 연결해주는 링크를 의미한다. html로 작성된 여러 문서들을 서로 연결하여 사용자가 원하는 정보를 제공한다. 마크업이란 표시한다는 의미를 가진다. 따라서 웹 브라우저에 내용을 보여주는 텍스트, 이미지, 영상 등의 위치를 표시한다는 것을 의미한다.
HTML의 기본 기능은 웹 브라우저에 보여줄 내용에 마크업하고 문서끼리 링크하는 것이다. 그리고 보여줄 컨텐츠를 꾸미거나 보기 쉽게 배치하는 것은 CSS의 기능이다.
HTML 구조
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>웹 개발 시작하기</title>
</head>
<body>
<h1>웹 개발 기초</h1>
<hr>
<p>HTML</p>
<p>CSS</p>
<p>자바스크립트</p>
</body>
</html>위의 코드는 HTML 파일의 구조를 간단히 나타낸다. HTML 문서는 정해진 형식에 맞춰 내용을 입력해야 한다.
웹 문서는 보통 <!DOCTYPE html>로 시작해 <html>, <head>, <body> 라는 3개의 영역으로 구성되어 있다.
* <!DOCTYPE html> : 현재 문서가 HTML5 언어로 작성된 웹 문서라는 의미이다.
*<html> ~ </html> : 웹 문서의 시작과 끝을 나타내는 태그이다. 웹 브라우저는 <html> 태그를 만나면 </html>까지의 소스를 읽어 화면에 표시한다.
*<head> ~ </head> : 웹 브라우저가 웹 문서를 해석하는 데 필요한 정보를 입력하는 부분이다.
*<body> ~ </body> : 실제로 웹 브라우저 화면에 나타나는 내용이다. 우리가 사용하는 대부분의 태그가 이 부분 안에 포함된다.
<meta>태그
메타 데이터는 데이터에 대한 데이터를 일컫는 말이다. html파일의 <meta>태그에서는 따라서 웹 문서와 관련된 정보를 저장하는 역할을 한다. <meta>태그의 가장 중요한 역할은 화면에 글자를 표시할 때 어떤 인코딩을 사용할지 지정하는 것이다. 웹 서버는 영어가 기본이므로 한글로 된 내용을 정상적으로 화면에 출력하기 위해서는 UTF-8이라는 인코딩 정보를 html 파일에 명시해주어야 한다. 그 외에도 <meta>태그를 사용하여 웹 사이트의 키워드나 간단한 설명, 제작자 등의 정보를 저장할 수 있다.
<title>태그
<head> 태그 안에서 가장 중요한 태그라고 말할 수 있는 것이 title 태그이다. <title>웹 개발 시작하기</title>과 같이 웹 페이지의 제목을 입력한다.
title 태그안에 입력한 내용은 위의 그림과 같이 웹 브라우저의 제목을 나타낸다.
<body>태그
위의 두 태그에서 문서 유형을 정의하고 문서 정보를 입력하였다. <body>와 </body>사이에 우리는 실제 웹 브라우저에 표시할 내용을 입력한다.