<!DOCTYPE html>
DTD (Document type Definition) 라고 부르며 문서의 타입에 대한 정보를 제공합니다. 만약 제거하면 브라우저는 쿼크 모드(quirks mode : 하위 호환성 모드)로 html을 랜더링하게 됩니다. 쿼크 모드에서는 브라우저마다 구현 방식이 조금씩 다르기 때문에 다르게 동작할 가능성이 있으므로 반드시 문서 최상단에 선언을 해야합니다.
<html>
HTML은 document element 즉, 문서의 최상위 요소입니다. lang 속성을 통해 문서의 주 언어가 무엇인지 설정 할 수 있습니다. 주 언어 설정은 검색엔진과 스크린 리더의 작동에 영향을 미치게 됩니다.
<head>
문서에 적용되는 메타데이터의 집합입니다.
<title>
문서의 제목을 의미합니다. 반드시 한번만 사용되어야 합니다.
<link>
외부의 자원을 문서와 연결하는 역할을 합니다.
<meta>
해당 문서의 메타데이터를 나타내는 요소입니다.
charset: 문서의 문자 인코딩 상태를 의미합니다. 보통 UTF-8 로 설정하여 전 세계 모든 언어를 지원하도록 합니다.
name=”author”: 페이지를 작성한 개발자의 이름입니다.
name="description": 페이지에 대한 설명 정보를 나타냅니다. 검색엔진이 사용자에게 결과 화면을 출력할 때 중요한 고려 요소입니다.
name=”viewport”: 모바일 장치에서 사용자 화면의 사이즈에 대한 값을 설정합니다. 필수는 아니지만 스마트폰이나 태블릿 같은 모바일 기기에서도 많은 접속이 이뤄지는 요즘은 반드시 넣어주는게 좋습니다.
http-equiv="X-UA-Compatible”: 프라그마 지시문(pragma directive : 컴파일러에게 특정 기능을 지정)이라고 합니다. 브라우저에 어떤 행동을 지시하려는 목적으로 사용합니다.X-UA-Compatible속성값은 IE브라우저에서 페이지를 어떠한 형식으로 랜더링할지 지정할 수 있으며content=’IE=edge’는 IE8 버전 이상에서 항상 표준모드로 랜더링 되도록 합니다.