![[HTML] [1] html 파일의 골격](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FcKLYml%2FbtqYQwOH7Di%2FAAAAAAAAAAAAAAAAAAAAAO8q4UFptw12o1bTqq7QFGQ9GHm9z0VEzMg_YmCtvMeI%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1756652399%26allow_ip%3D%26allow_referer%3D%26signature%3D716HKoAiMVQrqmemRuZT%252BfXWqe8%253D)
HTML이란 "Hyper Text Markup Language"의 약자로, 웹 페이지를 만들 때 사용하는 언어이다.
웹 페이지의 내용을 짜는 가장 기본적인 언어라고 할 수 있다. 웹 페이지에 출력할 문장 등을 "<"와 ">"로 감싼 "태그"라고 부르는 특수한 문자열로 감싸서 만든다.
이 HTML로 이루어진 파일을 CSS를 이용해 옷을 입히고, javascript를 이용해 동작을 구현하면서 웹 페이지가 생성되는 거이다.
모든 태그는 <태그종류>~</태그종류>로 이루어진다.
웹 페이지의 가장 기본적인 골격(구성요소)는 다음과 같다.
1. <!doctype html>
<!doctype html>은 독 타입(Doctype) 선언이라고 부르며, 해당 페이지가 어떤 버전의 HTML에 맞게 작성되었는지 나타낸다. 현재 가장 최신 버전은 "HTML5" 이며, 웹 브라우저는 특정 버전이 지정되어있지 않으면 HTML5 문서로 인식한다.
2.<html>~</html>
독 타입 바로 뒤에 선언되며, 이는 해당 문서가 HTML 문서라는 것을 나타내는 태그이다.
"lang"은 웹 페이지의 언어를 설정할 수 있는 부분으로, "ko"의 경우 한국어를, "en"의 경우 영어를 나타낸다.
3.<head>~</head>
해당 페이지의 제목과 설명, 사용할 외부 파일 링크 등과 같은 페이지의 정보를 작성하는 부분이다. 웹 브라우저에는 다로 출력되지 않는다.
4.<meta charset = "UTF-8">
문서에 사용되는 문자코드를 "UTF-8"로 하겠다는 지정이다. 이 부분을 설정하고 안하고에 따라 문자가 제대로 출력되지 않는 경우도 있다. "meta"는 "메타 요소"로 부른다.
5.<title>~</title>
페이지의 제목을 작성한다. 여기에 작성한 이름이 브라우저 탭에 출력된다. 혹 사용자가 웹 사이틀르 북마크 할 경우, 또는 검색할 경우의 페이지 제목으로도 출력된다.
6.<meat name="description" content="~">
페이지의 설명을 입력한다. 검색 엔진으로 페이지를 검색했을 때, 페이지 제목과 함께 출력되는 부분이다. 사용자가 검색햇을 때 어떤 사이트인지 빠르게 알려줄 수 있게 필요한 키워드를 섞어 설명을 작성하면 좋습니다.
7.<body>~</body>
HTML 문서의 본체 부분이다. 여기에 입력한 콘텐츠가 실제로 브라우저에 출력된다.
'Language > HTML' 카테고리의 다른 글
| [HTML] [6] 태그(5) - <br>, <blockquote>, <audio>, <video>, <span> (0) | 2021.03.03 |
|---|---|
| [HTML] [5] 태그(4) - <header>, <article>, <section>, <div>, <navigation> (1) | 2021.03.03 |
| [HTML] [4] 태그(3) - 입력 양식 만들기 (0) | 2021.03.03 |
| [HTML] [3] 태그(2) - <ul>, <ol>, <li>, 주석 (0) | 2021.03.03 |
| [HTML] [2] 태그(1) - <h1>, <a>, <img>, <p> (0) | 2021.03.03 |