본문 바로가기
HTML

HTML | 웹 표준, 웹 접근성, 웹 호환성

by 코딩하자9 2022. 8. 9.
728x90

웹 표준 / 웹 접근성 / 웹 호환성

웹 표준, 웹 접근성, 웹 호환성에 대해 차근차근 알아봅시다.


1. 웹 표준이란?

웹 표준이란 브라우저 종류 및 버전에 따른 기능 차이에 대하여 호환이 가능하도록 제시된 표준을 말합니다. 다른 기종 혹은 플랫폼에 따라 달리 구현되는 기술을 동일하게 구현하며, 어느 한쪽에 최적화되어 치우치지 않도록 공통요소를 사용하여 웹 페이지를 제작하는 기법입니다. 표준화 단체인 W3C(World Wide Consortium)가 권고한 표준안에 따라 웹사이트를 작성할 때 이용하는 HTML, CSS, JavaScript 등에 대한 규정을 담고 있습니다. 이러한 웹 표준의 궁극적인 목적은 웹사이트에 접속한 사용자(장애인, 노약자를 포함한)가 어떠한 운영체제나 브라우저를 사용하더라도 동일한 결과를 보이게 하는 것 입니다.

1-1. 웹 표준을 잘 준수한다면?

#웹 접근성 향상
웹 표준을 준수한 웹 사이트는 다양한 브라우저나 기기에서도 올바르게 표시되기 때문에 웹 접근성은 자연스레 향상됩니다.

#구조와 표현 분리
예전 방식에서는 구조와 표현을 같이 사용하여 코드의 양도 많아지고 복잡하였으나 웹 표준 방법론을 따르면 구조는 HTML, 디자인 같은 표현은 css로 분리하여 더 빠른 속도로 간편하게 사용할 수 있게 되었습니다.

#수정 및 운영관리 용이
구조와 표현의 분리 제작으로 나중에 수정을 할 경우 기존 코드는 재사용하고 CSS 코드만 재작성하는 등 운영관리가 용이합니다.

#호환성 향상
웹 표준을 지켜 올바른 마크업과 css로 웹 사이트를 제작할 시 오래된 버전의 웹 브라우저나 최신 버전의 브라우저 어디에서든지 항상 동일한 결과를 보여주어 호환성이 좋습니다.


2. 웹 접근성이란?

웹 접근성이란 장애인, 고령자를 포함한 모든 사용자가 어떠한 브라우저나 기기를 사용하느냐에 관계없이 웹에 접근하여 이용할 수 있도록 보장하는 것을 말합니다.

2-1. 웹 접근성을 잘 준수한다면?

#사용자층의 확대
장애인, 고령자를 포함한 모든 사용자가 편히 사용할 수 있게 되며, 그에 따라 새로 유입되는 사용자층이 많아집니다.

#다양한 브라우저와 기기 사용 가능
다양한 OS 및 웹 브라우저의 사용 가능 범위가 확대됩니다.

#기업 이미지 향상
기업의 사회적 이미지가 계속해서 중요해지는 만큼, 사회의 공헌하며 복지에 힘을 쓰는 등 기업 이미지 향상에 효과가 있습니다.

2-2. 웹 접근성 지침

#인지성
_텍스트가 아닌 콘텐츠의 대체 텍스트는 사용자가 쉽게 인지할 수 있도록 표시되어야 합니다.

#운용성
_사용자 인터페이스 요소와 탐색은 운용 가능해야 합니다. _키보드로 모든 기능을 사용할 수 있어야 합니다.
_콘텐츠를 읽고 사용하는데에 사용자에게 충분한 시간을 제공해야 합니다.

#이해성
_정보와 사용자 인터페이스 운용은 이해할 수 있어야 합니다. _텍스트를 일고 이해할 수 있도록 만들어야 합니다.

#견고성
_콘텐츠는 보조 기술을 포함한 다양한 사용자에 의존하여 해석될 수 있도록 내구성을 가져야 합니다.

3. 웹 호환성이란?

웹 호환성이란 표준 웹 기술을 사용하여 운영체제, 브라우저 등 어느 한 쪽으로 최적화되거나 종속되지 않도록 공통 요소를 사용하여 웹 페이지를 제작하는 기법입니다.

4. 웹 표준/ 웹 호환성/ 웹 접근성

구분 목적 준수 내용 차이
웹 표준(Web Standards) 웹의 사용성 및 접근성 보장 HTML, CSS 등에 대한 WC3규격(문법) 준수 등
- HTML, CSS, Javascript 등 구조와 표현, 동작 분리 권고
웹의 내용, 표현, 행동에 관련된 기술표준
웹 호환성(Cross Browsing) 웹 브라우저 버전, 종류와 관계없는 웹사이트 접근 웹 표준 준수를 통한 브라우저 호환성 확보
- HTML, CSS 문법 준수
- 동작, 레이아웃, 플러그인 호환성
웹 표준을 공통으로 포함
웹 접근성(Web Accessibility) 인적, 환경적 요인에 제약없는 웹 정보 접근 W3C 웹 접근성 이니셔티브(WAI)
한국형 웹 콘텐츠 접근성 지침2.0
- 인식의 용이성, 운용의 용이성, 이해의 용이성, 견고성

'HTML' 카테고리의 다른 글

HTML | 블록 구조 / 인라인 구조  (4) 2022.08.20
HTML | 구조 요소  (7) 2022.08.15

댓글


It's cording time

코딩 여기서 정리하고 배워보자구 :9

광고 준비중입니다.