웹표준 검사 벨리데이터 : W3C Validator를 소개합니다.
내가 코딩을 잘했을까?
마크업에는 문제가 없을까?
CSS 코딩은 잘했는지?
잘 모르겠죠?
이럴 때는 W3C Valiadtor를 사용하여 검사해 보면 됩니다.
웹표준에 맞는지 검사하는거죠!
웹 표준이란 어떤 운영체제나 어느 브라우저에서든 상관없이 웹사이트가 항상 동일하게 보여지도록 표준을 맞추는 것입니다.
W3C validator는 소스파일 또는 url 검사를 통하여 모든 브라우저에서 제대로 표현이 되고 있는지, 마크업에는 오류가 없는지를 간편하게 확인해 주는 사이트입니다.
자체 CMS를 가지고 있는 업체에서는 Validator도 자체적으로 운영을 하기도 합니다.
하지만 우리 같은 개인이 이용하기에는 W3C Validator 만한게 없습니다.
또한 정확하기도 하구요.
코딩을 이제 막 배우면서 내가 짠 코드에 대하여 많이 자시감이 없을 때, 어디가 잘못이 있는지 찾기 힘들 때 이 웹표준 검사를 사용하여 내 자신의 잘못을 잡아간다면 내 코딩에 자신감을 빨리 가지게 될 것입니다.
우선 html 검사 방법을 소개합니다.
소스파일 업로드, url 링크, 소스코드의 직접적인 입력으로 html 검사를 진행할 수 있습니다.
이렇게 해 보면 코딩 실력자들도 생각지도 못했던 부분에서 문법오류를 발견하기도 합니다.
바로 태그 열고 닫기를 깜빡한 것들........
실제로도 이런 오류가 많이 나옵니다.
url은 아래와 같습니다.
The W3C Markup Validation Service
Validate by File Upload Note: file upload may not work with Internet Explorer on some versions of Windows XP Service Pack 2, see our information page on the W3C QA Website.
validator.w3.org
홈페이지 화면은 아래와 같습니다.
소스코드를 바로 직접 검사하고자 할 때에는 "Direct Input"탭을 클릭하고 작성한 코드를 복사해서 붙여넣기를 하면 됩니다.
두번째는 CSS 검사에 대하여 알아보겠습니다.
홈페이지 주소는 아래와 같습니다.
https://jigsaw.w3.org/css-validator/
W3C CSS 검사 서비스
파일 업로드를 통한 검사 직접 입력을 통한 검사
jigsaw.w3.org
페이지 화면은 아래와 같습니다.
css 검사 방법도 기본적으로 html 검사 방법과 동일합니다.
참고로 html과 css 벨리데이터 사이트 모두 간단한 한국어 서비스를 제공하고 있습니다.
마지막으로 W3C mobile validator를 소개합니다.
url은 아래와 같으며, 사용방법은 제일 처음 소개한 Markup Validator와 동일합니다.
https://dev.w3.org/2008/mobileok-webui/
W3C mobileOK Checker
Validate by File Upload Note: mobileOK tests cannot all be run when file upload is used. In particular, checks at the HTTP level and tests that apply on resources linked from the HTML document cannot be run. Also note that file upload may not work with Int
dev.w3.org
벨리데이터를 통해서 내가 코딩을 하면서 자주 하는 실수는 무엇인지 배워 나가세요.
그러면서 하루 하루 코딩실력을 키워 나가시기를 바랍니다.
'프론트엔드' 카테고리의 다른 글
| 웹접근성 자가진단 도구 : WATCH 2.0 (0) | 2020.10.06 |
|---|---|
| 웹표준과 웹접근성에 대하여 (0) | 2020.09.30 |
| 통합진단 클릭닉, 웹개방성 / 웹연결성 진단 : Korea Html 5 (0) | 2020.09.27 |
| 웹접근성 평가 항목 관련 몇 줄 (0) | 2020.09.26 |
| JQuery는 여기에서 받아 가세요! (0) | 2020.09.24 |
댓글