본문 바로가기

HTML_CSS/HTML

HTML의 뜻과 구조

HTML

HTML은 HyperText Markup Language의 약어로써 웹 페이지를 위한 마크업 언어이다. 우리가 현재 보고, 사용하는 웹 페이지들은 전부 이 HTML 을 이용하여 구성되어있다.

HTML이 마크업 언어라고 했다. 마크업 언어라는 것은 태그를 이용하여 문서나 데이터의 구조 정의하는 언어이다. 그렇기에 HTML 또한 태그를 이용하여 문서를 정의 한다. 하지만 일반 마크업 언어와는 다르게 HTML은 각 태그들이 규칙으로 지정되어 있고 그 태그들이 가진 기능들도 각각 다르다.

태그는 꺽쇠(< , >)로 이루어져 있으며 태그 내부에 내용이 어떠한 역할을 하는지 알려주는 것이다. 

 

h1 태그의 내용은 제목의 역할을 한다

 

이처럼 태그는 여는 태그와 닫는 태그가 있고, 태그를 열은 순서대로 다시 닫아야 한다. 

단지 문서를 정의해주는 언어이고 하나의 문서 파일일 뿐이기에 프로그래밍 언어라고 할 수 없다.

하지만 프로그래밍 언어의 컴파일 처럼 html 문서안에 있는 태그들의 기능을 실체화 하여 우리가 볼 수 있게 하는 프로그램이 있고 그것이 웹 브라우저이다.

HTML의 기본 구조

HTML의 뜻과 구조.html
<!DOCTYPE html>
<html>
    <head>
        <title>HTML의 뜻과 구조</title>
        <meta charset="utf-8">    
    </head>
    <body>
        <h1>HTML</h1> 
        <p>HTML의 뜻</p>
        <p>HTML의 구조</p>
    </body>
</html>

<!DOCTYPE html>

<!DOCTYPE html>은 html파일의 최상단에 위치해 있어야되며 역할은 이 문서가 HTML5 버전으로 이루어져 있다는것을 명시하는 것이다.

<html>
</html>

<html>태그는 이 태그 내부는 html로 이루어져있다라고 알려주는 태그이다. 이 태그는 태그들 중에서 가장 바깥에 있어야 하는 태그이다.

<head>
</head>

<head>태그는 눈에 보이지 않는 부분으로써 메타데이터(metadata)들을 지정하는 부분이다. 

메타데이터(metadata)란 HTML 문서에 대한 정보로 웹 페이지 상에는 표시되지 않으며 주로 <title><meta><link> 등의 태그들을 이용해서 메타데이터를 정의한다.

<body>
</body>

<body>태그는 웹 브라우저를 통해 실질적으로 보여지는 부분이다.

'HTML_CSS > HTML' 카테고리의 다른 글

줄바꿈 기능이 있는 <br> 태그  (0) 2021.02.28
단락을 나누는 <p> 태그  (0) 2021.02.28
이미지를 삽입하는 <img> 태그  (0) 2021.02.27
리스트를 표현하는 <li> 태그  (0) 2021.02.27