[mdn web docs 정리하며 읽기] _ head 태그, html의 메타데이터, head란?

HTML의 head는 페이지를 열 때 웹 브라우저에 표시되지 않는다.
head는 <title>과 같은 페이지, CSS의 링크, 파비콘, 그리고 다른 메타데이터를 포함한다.

1. HTML head란?

head는 페이지를 열 때 브라우저에 표시되는 <body> 요소와는 다르게 head의 내용은 페이지에 표시되지 않는다.

대신 head의 내용이 하는 일은 페이지에 대한 metadata를 포함하는 것이다.

<head>
  <meta charset="utf-8">
  <title>My test page</title>
</head>

action에서 <title> 요소를 이미 봤을 것이다. 이것은 문서의 title을 추가하기 위해 사용하고 <body>의 최상위에 사용하는 <h1>은 가끔 title을 가리키기도 하지만 엄연히 다르다.

<h1> : 일반적으로 페이지당 한 번 사용하는데 페이지의 내용물의 제목, 뉴스의 헤드라인을 표시하기 위해 사용
<title> : 문서의 컨텐츠가 아닌 HTML문서 전체 타이틀을 표현하기 위한 메타데이터이다. title은 브라우저에서 사이트를 북마크 할때에도 title의 내용물을 추천하는 북마크 이름으로도 사용된다. 또한 검색 결과로도 사용

메타데이터란? 데이터를 설명하는 데이터라고 할 수 있다. HTML에서 문서에서 <head> 안에 다양한 형태의 <meta>가 있다.

간단한 메타데이터들만 다뤄보면,,

<meta charset="utf-8">

이 요소는 문서의 character로 문서에서 허용하는 문자 집합 인코딩에 대해서 간단히 표시하는 것이다.

utf-8은 전 세계적인 character 집합으로 많은 언어들을 포함한다. 즉, 웹 페이지에서 어떤 문자라도 취급할 수 있다는 뜻이다.

....

head 태그에는 무엇이 있을까? HTML의 메타데이터 - Web 개발 학습하기 | MDN

HTML의 head는 페이지를 열 때 웹 브라우저에 표시되지 않습니다. head는 <title> 같은 페이지나, CSS의 링크(HTML 컨텐츠를 CSS로 스타일링하기를 원한다면), 파비콘(favicon), 그리고 다른 메타데이터(작성

developer.mozilla.org

아직 정리중...

HTML 핵심 요소 정리, 블록(상자)요소, 인라인(글자)요소, 인라인(글자)요소 + 블록(상자)요소 = inline-block, 테이블 요소 (0)	2023.08.09
HTML 기본 문법, 요소, 부모와 자식관계, 태그 속성과 값, span, div 태그 (0)	2023.08.08
[mdn web docs 정리하며 읽기] _ HTML 시작, html 이란? html 요소의 구조, html 속성, html 문서 구조, html 특수문자 (0)	2023.07.22