DOCTYPE 을 왜 지정해야 할까?
- HTML5 에서는 웹 표준을 따르는 Full Standards Mode 로 렌더링하기 위함이다.
- DOCTYPE 을 선언하지 않는 경우 Quirks Mode 로 렌더링이 되어 웹 사이트가 깨지는 등의 문제가 생길 수 있다.
배경
과거 웹페이지들은 대부분 두가지 버전으로 쓰여졌다.
1) 넷스케이프 네비게이터 버전
2) 마이크로소프트 인터넷 익스프롤러 버전
넷스케이프와 마이크로소프트의 경쟁이 과열되며 웹표준에 대한 필요성이 대두되었고, W3C에서 웹표준을 만들었으나, 브라우저는 해당 웹표준을 바로 사용할 수 없었다.
웹표준 이전의 기존 웹페이지들에 웹표준을 적용하면 깨져 보였기 때문이다.
따라서, 기존의 웹사이트들과는 다른, 새로운 웹표준을 다루는 두가지 모드를 소개하게 되었다.
이것이 바로 Quirks Mode, Standard Mode 이다.
지금은 웹 브라우저의 레이아웃 엔진에 아래와 같이 세가지 모드가 있다.
Quirks Mode, Almost Standards Mode, Full Standards Mode
Quirks Mode 에서는 레이아웃이 네비게이터4, IE5를 모방했다.
이는 웹표준이 보편화되기 이전의 웹사이트들도 지원하기 위함이었다.
Full Standards Mode 에서는 HTML, CSS (W3C 표준) 에 의해 웹 페이지가 표현된다.
Almost Standards Mode 는 몇몇개의 Quirks Mode 요소만 지원한다.
HTML 에서는 문서 초반에 DOCTYPE 선언을 통해 해당 문서의 호환 모드를 나타낸다.
HTML5 에서는 <!DOCTYPE html> 와 같이 입력하는 것이 제안된다. 해당 DOCTYPE 은 Full Standards Mode 로 렌더링한다.
즉, HTML5에서 DOCTYPE 을 선언하는 이유는 Full Standards Mode 를 활성화하기 위함이다.
실무를 하며 프로젝트의 일부로 이메일 템플릿을 생성한 적이 있는데 이때는 DOCTYPE 을 아래와 같이 설정해주었다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
위와 같이 DOCTYPE 을 설정해주면 이메일 클라이언트에서 해당 HTML을 정상적으로 렌더링해줄 수 있었다.
실수로 DOCTYPE 을 지정하지 않았을때는 스타일 속성에 제대로 적용되어 보이지 않는 점도 확인할 수 있었다.
이메일 템플릿과 관련해서 내가 겪었던 시행착오들도 추후에 포스팅해야겠다!
댓글남기기