사이트 웹 표준검사 파이어폭스(Firefox)로 최적화하기

사이트 웹 표준검사 파이어폭스(Firefox)로 최적화하기

개발자분들은 웹프로그램 개발하고 나서 웹 표준에 맞는지 크로스 브라우저는 이상 없는지 등의 확인하는 과정을 거칩니다. 개발하시는 분이 아니더라도 블로그를 운영하거나 작은 사이트 등을 만들어서 서비스할 때 W3C의 표준에 맞게 되어 있는지 검사해주는 프로그램이 있는데요.
별도의 프로그램은 아니고 파이어 폭스에서 지원하는 플러그인 프로그램입니다.

바로 Html Validator이란 프로그램인데요. 확장 프로그램을 설치 후 문제가 있는 부분을 표시해주고
소스에 따라 수정 방법 가이드라인도 제시해줍니다.

그럼 방법을 알아보겠습니다.

파이어폭스 실행 후 확장 프로그램을 설치하기 위해 우측 상단 점 3개의 더 보기 아이콘을 클릭합니다.
메뉴가 열리면 [부가 기능]을 선택해주세요.


파이어 폭스 확장 프로그램을


 

 

 

부가 기능 창이 열리면 검색에 Html Validator를 입력 후 엔터키를 눌러줍니다.


부가 기능 창이 열리면 검색에 Html Validator


 

 

 

검색이 되면 Html Validator를 선택합니다.

Html Validator를 선택


 

 

 

설치 화면이 나오면 [+Firefox에 추가] 버튼을 클릭합니다 .
추가 안내 메시지 창이 나오면 확인 버튼을 클릭해서 추가합니다.

 +Firefox에 추가 버튼


 

이제 파이어폭스에서 웹 표준검사하려는 사이트에 접속합니다. 페이지가 열리면 Ctrl+ Shift +I 를 클릭합니다
하단에 개발자 모드가 열리면 가장 우측 Html Validator를 클릭해주세요.

 Ctrl+ Shift +I 개발자모드


 

 


해당 사이트에 빨간색 X와 Warring 등이 나열됩니다.
빨간색 x는 수정해야 할 요소이고 Warring은 필수는 아니지만 수정해줘야 하는 경고 부분입니다.


 

 

 

상태별 아이콘의 상태 내용을 확인할 수 있습니다.

상태별 아이콘의 상태 내용


 

 

 

문제가 되는 부분을 클릭하면 좌측 소스 부분에서 어디가 문제가 있는지 블럭으로 알려줍니다.
하단에는 문제가 되는 부분을 이렇게 고치면 된다는 가이드 코드가 나옵니다.

사이트 웹 표준검사 파이어폭스(Firefox)로 최적화 하기를 알아보았습니다.