HTML : HTML 문서의 구조
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html><!DOCTYPE html> : 웹 브라우저에게 HTML 버전을 알려주는 역할
<!DOCTYPE html><!DOCTYPE html> 웹브라우저에게 HTML버전을 알려주는 역할이며, 버전을 기재하지 않더라도 자동으로 html5로 인식한다.
이전 html버전에서 DOCTYPE에 버전을 기재해주어야 해당 버전으로 작동했기 때문에 작성했었지만 html5 이후에는 기재하지 않아도 정상 작동하지만 명시적으로 작성해준다.
<!DOCTYPE html>은 항상 html 최상단에 기재해주어야 한다.
<html lang="ko"><html>
: 페이지 전체의 콘텐츠를 감싸는 최상의 (루트 /root) 요소이다. 여기서 lang은 현 html에서 사용하는 언어를 지정해준다
<head> : 웹브라우저가 식별할 수 있는 문서정보 (메타데이터)를 담는다.
: 웹브라우저 화면에 직접적으로 나타나진 않는 웹페이지의 정보(메타데이터)를 나타낸다.
주목적은 기계(웹브라우저) 처리를 위한 정보이고 사람이 읽을 수 있는 정보가 아니다.
google에서 검색할 때 나오는 타이틀이나 부가설명이 들어가며, 북마크 추가할 때 제목이나 아이콘 등의 정보가 들어가며
CSS나 JS를 연결할 때 head에 넣는다. (meta데이터)
<head>엔 하나의 <title>만 가질 수 있다.
<meta> :웹페이지의 정보
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">: 문서의 일반적인 정보와 문자 인코딩을 명시한다.
meta charset="uft-8"
: 해당 웹의 글자 포맷이 uft-8을 사용한다는 의미이며, uft-8은 모든언어가 포함되어있는 기본 포맷이다.
meta name="viewport" content="width=device-width"
: viewport 에 대한 정의가 적혀있으며, 해당 디바이스의 너비를 전부 사용한다는 내용이다.
<title> : 웹사이트의 제목
: 웹 브라우저를 실행하였을 때 최상단 탭에 기재되는 title(페이지의 제목)을 말하며, 웹사이트 방문 시 방문 기록에 나오는 제목이 title이다.
<body>
: 웹브라우저 화면에 나타나는 모든 콘텐츠가 들어있다.
한문서에 하나의 <body>요소만 존재할 수 있으며 <body>에서 사용할 수 있는 속성들은 대부분 CSS로 대체되어있기 때문에 필요할 경우 CSS나 javascript를 사용한다.
https://developer.mozilla.org/ko/docs/Web/HTML/Element
HTML 요소 참고서 - HTML: Hypertext Markup Language | MDN
메타데이터는 스타일, 스크립트, 각종 소프트웨어(검색 엔진 (en-US), 브라우저 등)의 탐색 및 렌더링을 도와줄 데이터 등 페이지에 대한 정보를 가집니다. 스타일과 스크립트 메타데이터는 페이
developer.mozilla.org
'STUDY > HTML' 카테고리의 다른 글
| HTML : 블록(Block)요소 와 인라인(Inline)요소 (0) | 2022.04.12 |
|---|---|
| HTML : <head> 와 <body> 태그 (0) | 2022.04.12 |
| HTML : 빈 요소 (Empty elements) (0) | 2022.04.12 |
| HTML : 태그<tag> (0) | 2022.04.07 |
| HTML : 웹 표준, 웹 접근성, 웹 호환성 (0) | 2022.04.07 |