HTML 버전 확인 - HTML beojeon hwag-in

HTML 버전 확인 - HTML beojeon hwag-in

DOCTYPE이란 어떤 SGML이나 XML 기반 문서 내에 그 문서가 특정 문서 형식 정의를 따름을 지정하는 것이다.

모든 웹 문서는 문서형 정의(DTD:Document Type Definition)의 선언으로 시작하여 해당 웹문서의 버전과 종류를 나타낸다.

'문서형 정의'는 HTML5, XHTML, HTML의 세 가지가 있으며, 웹 브라우저가 '문서형 정의'에 따라 웹 문서를 랜더링 한다

만약 '문서형 정의'를 생략하게 되면 웹 브라우저는 비표준모드(Quirks mode)로 랜더링 하여 의도하지 않는 동작이 발생할 수 있다

DOCTYPE 유형별 차이점

○ Strict

엄격한 규격으로 구조와 표현을 분리했고 단계적으로 없어질 요소와 속성을 제외 시킨 문서 타입이다. 따라서 비표준 태그인 center, font 등을 사용할 수 없다. 이런 태그는 css로 대체해야 동작한다.

○ Transitional

표준이 정립되지 않은 때에 만들어진 문서들과의 호환성을 유지하기 위해 만들어진 문서 타입이다. iframe과 새창 띄우기(target="_blank")등을 사용하기 위해 선택할 수 있는 문서 타입이다.

○ Frameset

프레임셋을 지원하기 위한 문서타입이다. 지금은 거의 사용하지 않는 태그인데 프레임셋을 사용하기 위해 선택할 수 있는 문서 타입이다

DOCTYPE 종류 및 버전별 선언 방법

○ HTML5

<!DOCTYPE html>

○ HTML 4.01 Strict

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

○ HTML 4.01 Transitional

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

○ HTML 4.01 Frameset

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

○ XHTML 1.0 Strict

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

○ XHTML 1.0 Transitional

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

○ XHTML 1.0 Frameset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

○ XHTML 1.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

이상으로 DOCTYPE(문서형정의) 종류와 버전별 차이를 알아봤습니다.

[팁]

DOCTYPE 버전별 지원 테그는 아래 링크에서 확인

https://www.w3schools.com/tags/ref_html_dtd.asp

[참조]

http://www.w3schools.com

https://html5please.com/ 사이트에서 확인 가능하다.

여기에서는 익스플로어 8이상 버전을 확인해 준다.
use 사용해도 된다는 의미이고, use with caution 주의를 기울여서 사용 가능하다는 것이고, avoid는 피하라는 것이다.

검색 박스에 원하는 코드를 입력해준다. 예시로 border-radius 를 입력하였다.

HTML 버전 확인 - HTML beojeon hwag-in

link to this search 버튼을 클릭한다.

HTML 버전 확인 - HTML beojeon hwag-in

결과가 하단에 나오는데, css 이고, use 사용 가능하다는 그린라이트가 켜졌다.

HTML 버전 확인 - HTML beojeon hwag-in

상세 설명은 해석이 가능하신 분은 해석하시고, 힘드신 분은 구글 번역기에서 돌려보자.

HTML 버전 확인 - HTML beojeon hwag-in

HTML 버전 확인 - HTML beojeon hwag-in

정의 : HTML 4개, XHTML 4개 중 어떤 버전으로 작성되었는지 선언합니다.

HTML DocType 이해하기

doctype은 Document Type의 줄임말입니다.
HTML은 버전별로 지원하는 태그의 사용이나 출력에서 미묘한 차이가 발생하기 때문에, 어떤 버전으로 작성되었는지 미리 선언을 하여 “웹브라우저가 내용을 올바르게 표시”할 수 있도록 해줍니다.
선언하지 않을 경우 브라우저가 임의로 지정하게 되어 원치 않은 결과가 발생 할 수도 있습니다.

SEO Friend의 등급체크

SEO 등급 설명
Good 버전별로 선언문을 바르게 사용
Bad 선언문을 바르게 사용하지 않음

Doctype 버전별 선언

Doctype 선언은 HTML5, HTML4.0, XHTML1.0, XHTML1.1 버전에 따라 선언 방식이 다릅니다.
HTML 구버전의 경우 종류에 따라 다르게 선언이 되었지만 현재 최신버전인 HTML5는 복잡한 과정없이 단 한줄의 문서 유형을 선언합니다.
HTML 5 (최신버전이며, 가장 많이 쓰입니다.)

HTML 4.01 Strict

HTML 4.01 Transitional

HTML 4.01 Frameset

XHTML 1.0 Strict

XHTML 1.0 Transitional

XHTML 1.0 Frameset

XHTML 1.1

HTML DocType 적용 확인(HTML5)

웹페이지에서 마우스의 오른쪽을 클릭 후 ‘소스보기’에서 확인해보세요!

HTML 버전 확인 - HTML beojeon hwag-in