웹 표준

웹 표준이란 W3C(World Wide Web Consortium)에서 권고하는 ‘웹에서 표준적으로 사용되는 기술이나 규칙’으로, 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동등하게 보이고 정상적으로 작동할 수 있도록 하는 웹 페이지 제작 기법을 담고 있다.

웹 표준의 장점

유지 보수의 용이성

웹 표준이 생기기 전에는 구조, 표현, 동작이 뒤섞인 코드도 많았고, 이 탓에 어느 한 부분을 수정하려면 전부 뜯어고쳐야 할 때도 있었다. 하지만 각 영역이 분리되며 유지 보수의 용이성 및 코드 경량화로 인한 트래픽 비용 감소 효과를 얻을 수 있게 된다.

웹 호환성 확보

웹 표준을 준수하여 웹 사이트를 제작하면 웹 브라우저의 종류나 버전, 운영 체제나 사용 기기 종류에 상관없이 항상 동등한 결과가 나오도록 할 수 있다.
이때 필요한 작업을 크로스 브라우징(Cross Browsing)이라고 한다. MDN, Can I use 등의 사이트에서 웹 호환성을 확인하고, 여러 브라우저와 기기를 번갈아 테스트를 진행하며 수정을 반복하는 것이다.

검색 효율성 증대

웹 표준에 맞춰 웹 사이트를 작성하는 것 만으로도 검색 엔진에서 더 높은 우선 순위로 노출될 수 있다. (적절한 시멘틱 태그 사용, 웹 페이지에 대한 정확한 정보 작성 등의 On-Page SEO 작업)

웹 접근성 향상

웹 표준은 말 그대로 브라우저, 기기, 사용자에 상관없이 최대한 동등한 결과를 제공하기 위한 기술이기 때문에, 웹 표준을 지키는 것만으로도 웹 접근성을 향상시킬 수 있다.

웹 접근성

웹 접근성이란

웹 접근성(Web Accessibility) 이란 장애인, 고령자 등이 웹 사이트에서 제공하는 정보에 비장애인과 동등하게 접근하고 이해할 수 있도록 보장하는 것이다. 그렇다고 해서 웹 접근성이 그들만을 위한 전유물이라는 이야기는 아니다. 웹 접근성이 보장될수록 비장애인을 포함한 모두가 사용하기 편리한 사이트가 되기 때문이다.

웹 접근성 지침 2.1

한국형 웹 콘텐츠 접근성 지침 2.1에 따른 24개의 검사 항목은 다음과 같다.

인식의 용이성 (Perceivable)

모든 콘텐츠는 사용자가 인식할 수 있어야 한다.

• (적절한 대체 텍스트 제공) 텍스트 아닌 콘텐츠는 그 의미나 용도를 이해할 수 있도록 대체 텍스트를 제공해야 한다.
• (자막 제공) 멀티미디어 콘텐츠에는 자막, 원고 또는 수화를 제공해야 한다.
• (색에 무관한 콘텐츠 인식) 콘텐츠는 색에 관계없이 인식될 수 있어야 한다.
• (명확한 지시사항 제공) 지시사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 한다.
• (텍스트 콘텐츠의 명도 대비) 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상이어야 한다.
• (자동 재생 금지) 자동으로 소리가 재생되지 않아야 한다.
• (콘텐츠 간의 구분) 이웃한 콘텐츠는 구별될 수 있어야 한다.

운용의 용이성(Operable)

사용자 인터페이스 구성요소는 조작 가능하고 내비게이션 할 수 있어야 한다.

• (키보드 사용 보장) 모든 기능은 키보드만으로도 사용할 수 있어야 한다. (PC웹)
• (누르기 동작 지원) 터치(touch) 기반 모바일 기기의 모든 컨트롤은 누르기 동작으로 제어할 수 있어야 한다. (모바일웹)
• (초점 이동) 키보드에 의한 초점은 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다.
• (조작 가능) 사용자 입력 및 컨트롤은 조작 가능하도록 제공되어야 한다.
• (응답시간 조절) 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있어야 한다.
• (정지 기능 제공) 자동으로 변경되는 콘텐츠는 움직임을 제어할 수 있어야 한다.
• (깜빡임과 번쩍임 사용 제한) 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 한다.
• (반복 영역 건너뛰기) 콘텐츠의 반복되는 영역은 건너뛸 수 있어야 한다.
• (제목 제공) 페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야 한다.
• (적절한 링크 텍스트) 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 한다.

이해의 용이성(Understandable)

콘텐츠는 이해할 수 있어야 한다.

• (기본 언어 표시) 주로 사용하는 언어를 명시해야 한다.
• (사용자 요구에 따른 실행) 사용자가 의도하지 않은 기능 (새 창, 초점 변화 등)은 실행되지 않아야 한다.
• (콘텐츠의 선형화) 콘텐츠는 논리적인 순서로 제공해야 한다.
• (표의 구성) 표는 이해하기 쉽게 구성해야 한다.
• (레이블 제공) 사용자 입력에는 대응하는 레이블을 제공해야 한다.
• (오류 정정) 입력 오류를 정정할 수 있는 방법을 제공해야 한다.

견고성(Robust)

웹 콘텐츠는 미래의 기술로도 접근할 수 있도록 견고하게 만들어야 한다.

• (마크업 오류 방지) 마크업 언어의 요소는 열고 닫음, 중첩 관계 및 속성 선언에 오류가 없어야 한다.
• (웹 애플리케이션 접근성 준수) 콘텐츠에 포함된 웹 애플리케이션은 접근성이 있어야 한다.