Web programing/HTML & CSS

HTML5 규격 표준 검사기

sosal 2014. 12. 4. 03:45
반응형


/*

 http://sosal.kr/
 * made by so_Sal
 */



웹 표준에 맞춰서 HTML5를 프로그래밍 했는지 보기 위한 사이트를 소개합니다.



1. html5 Validator


https://html5.validator.nu/



위 사이트는 정말 간단하게 구성되어 있습니다.

Validator Input: 인풋을 입력하라는 한마디로 텍스트 박스와 버튼 몇개로 구성되어 있습니다.

일단 도메인이나 ip로 웹서비스를 지원하는 사이트가 있다면, 바로 Address에 주소를 입력하면

해당 주소의 HTML5 규격에 맞는지 확인해주게 됩니다.




주소 뿐 만 아니라, html 파일을 직접 업로드 할 수 있고, text로 줄 수 있습니다.

간단한 예제로 Text Field에 소스를 넣어보겠습니다.


<!doctype html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>HTML5 Template</title>

<!--[if lt IE 9]>

<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

<![endif]-->

</head>

<body>

<!--template.html-->

</body>

</html>



간단히 HTML5 규격을 알려주는 doctype과 IE8버전 이하에 해당하는 경우의 html5 shiv 자바스크립트 코드 적용문을 넣고

완전히 비어있는 소스를 그대로 넣어봤습니다.





이미지에 대한 Report도 보여주고, source를 보여주어 어디가 규격에 안맞는지 다 알려주도록 둘 다 체크를 했습니다.

Validate를 누르면 실제로 HTML5 규격에 유효하느냐 결과를 알려줍니다.




이 문서는 HTML5, ARIA, SVG 1.1, MathML 2.0에 적합하다고 끄네요.

HTML5 말고 나머지는 뭐가 뭔지는 모르겠습니다..





2. W3C Markup 검증 서비스



http://validator.kldp.org/

국내에서 무척 유명한 kldp에서 W3C Markup 검증 서비스를 제공하고 있습니다.


이 validator는 KLDP에서 제공하는 W3C의 한국어 HTML Validation 서비스이며, HTML, XHTML, SMIL, MathML 등 웹 문서의 markup 유효성을 검사합니다. 


라고 설명이 나와있습니다. 역시나 뭐 크게 다를것 없는 마크업 검사 서비스 사이트입니다.



인터페이스 역시 기본적으로 주소를 입력하도록 되어있고

상단의 탭을 이용하시면 파일 업로드와 직접입력 모두 가능합니다.


소스가 길지 않은 경우에는 직접 입력이 가장 편할 것 같네요.

역시 직접입력 한다면 위의 HTML5.validator와 별 다른 결과가 나오지 않기에,

제 블로그의 메인 주소를 한번 떄려봅니다 --;


티스토리에서 제공하는 기본 스킨이지만 제대로 말을 들을런지.. 궁금하네요.








무려 결과는 48에러, 4경고 ㅋㅋㅋ ㅠㅠ




웹표준을 정확히 따르며 프로그래밍 하는 사람은 많지 않죠..


하지만 웹프로그래밍을 공부하는 입장에서는 최대한 표준을 따르며 공부하는것이 좋다고 생각합니다.