티스토리 뷰

웹 접근성

09. 견고성 | sohinggu๑°⌓°๑

댕발자 (●'-'●) 2019. 6. 24. 04:24

견고성

학습목표
1. 마크업 오류의 방지 방법을 알 수 있다.
2. 웹 어플리케이션 접근성 준수 제공 방법을 설명할 수 있다.

견고성(Ruggedness)

웹 사이트를 만들 때 다양한 기술이나 환경에서도 문제없이 잘 동작하고, 오류 없이 정보를 잘 전달할 수 있도록 만들자는 원칙

  • 문서의 뻐대라고 할 수 있는 마크업 언어를 문법적으로 오류가 없도록 제작하는 것이 가장 기본이다.
  • 문법적인 오류가 있다면 사용하는 브라우저 및 보조기기에 따라 오류를 해석하는 방법이나 정보를 전달하는 기능등에서 차이가 발생할 수 있고 이러한 차이로 인해서 사용자는 웹 콘텐츠의 인식, 이해, 사용에 영향을 받게 된다.

웹 접근성 검사항목 - 견고성

 

<항목23> 마크업 오류 방지: 마크업 언어의 요소는 열고 닫음, 중첩 관계 및 속성 선언에 오류가 없어야 한다.

<항목24> 웹 어플리케이션 접근성: 콘텐츠에 포함된 웹 어플리케이션은 접근성이 있어야 한다.

마크업 오류 방지

1. 마크업 오류의 개념

마크업 오류: 웹 페이지의 기본이 되는 HTML이나 XHTML과 같은 마크업 언어에서 정한 문법에 맞지 않게 구현한 경우 발생되는 것

  • W3C에서 제공하는 유효성 검사기를 통해 확인할 수 있다.
  • 문법에 맞지않게 개발된 마크업 문서는 화면 출력 이상, 기능 동작 이상 등의 문제가 발생할 수 있다.

 

2. 마크업 오류 방지의 필요성/목적

마크업 언의 문법 오류를 방지함으로써 브라우저 뿐만 아니라 다양한 보조기기 등에서 콘텐츠를 문제없이 해석할 수 있도록 제공할 수 있게되며 앞으로 새로운 기술들이 계속 발전되는 상황에서 견고성을 목적으로 한다.

 

3. 마크업 오류 방지의 검사항목 해설

  • 마크업 언어는 문서의 구조를 만들기 때문에 사실상 표준 문법을 모두 준수하는 것이 원칙이다.
  • 표준 문법 중에서도 가장 기본이 되는 최소한의 사항으로 마크업 언어의 요소는 열고 닫음, 중첩 관계 및 속성 선언에 오류가 없어야 한다.

 

4. 마크업 오류 방지 제공 방법

(1) 제공 방법

기준: 상기 항목을 오류 없이 제공한 경우 기준을 준수한 것으로 인정한다.

(2) 오류 유형

a. 태그의 열고 닫음 오류

마크업 오류 방지 오류 유형1 (출처: 배움나라)

 

[Tip] 오류의 숫자 vs 오류의 유형

문서타입 선언에 따라 문법 검사가 되므로 DTD선언이 잘 되어 있는지 보고, 오류의 숫자가 많다 하더라도 몇몇 오류를 제거하면 같은 유형의 오류들이 사라지거나 열고 닫는 태그들이 순차적으로 밀려서 오류가 한꺼번에 해결되는 경우가 많다. 따라서 오류의 숫자에 연연하는 것보다 해당 오류유형이 적은가 많은가가 관건이 된다는 점을 유의해야 한다.

 

b. 태그의 중첩 오류 (요소나 속성이 반영되지 않음)

마크업 오류 방지 오류 유형2 (출처: 배움나라)

c. 중복 선언된 속성 오류(표현이나 동작에 대한 목표점이 어디인지 해석하지 못함)

마크업 오류 방지 오류 유형3 (출처: 배움나라)

(3) 주의사항

a. id값 중복 선언은 오류유형 23-3에서 심사한다.

  • 웹 접근성 품질 마크 인증 심사에서는 감점이 어느 항목에서 감점되는지를 알기 어렵다.
  • ex) 레이블 제공에서 label for와 input id를 연결해주는 과정에서 id가 중복되면 오류유형 23-3에서 감점
  • id값 뿐만 아니라 속성을 중복시키는 경우에도 23번 검사항목에서 지적할 수 있지만 id중복이 많음

b. 위에 언급된 항목 이외의 표준문법 오류는 포함하지 않는다.

  • 현재 웹 접근성 품질 인증 심사에서는 표준 문법에서 태그의 열고 닫음, 중첩 오류, 중복 선언된 속성의 3가지에 대해서만 오류로 보겠다는 내용

 

[Tip] 3가지 오류에 대한 문법 오류 메세지

열고 닫음, 중첩 오류, 속성 중복에 대해 주로 나타나는 문법 오류 메세지를 살펴보면 주로 end tag for, duplicate specification of attribute, already defined이 주요 문자열이 되므로 오류 메세지가 나타났을 때 좀 더 빠르게 판단할 수 있다.

No 오류 구분 오류 설명 오류 예시 Validation 오류 필터링 문자열
1 열고 닫음 여는 태그 미제공 <h1><img src="logo.gif" alt="로고"></a></h1> end tag for element "A" which is not open end tag for
2 ...(중략)</ul> end tag for element "UL" which is not open end tag for
3 ...(중략)</div> end tag for element "DIV" which is not open end tag for
4 닫는 태그 미제공 <a herf="test.html"><img src="logo.gif" alt="로고"> end tag for element "A" omitted, but its declaration does not permit this end tag for
5 <strong>(중략)... end tag for element "STRONG" omitted, but its declaration does not permit this end tag for
6 <h2>(중략)... end tag for element "H2" which is not open end tag for
7 중첩 오류 중첩 오류 발생 <p>마크업 언어의 속성은 <strong> 중복 선언하지 않아야 </p>한다. </strong> end tag for element "STRONG" omitted, but its declaration does not permit this end tag for
8 end tag for element "STRONG" which is not open end tag for
9 <h1><img src="logo.gif" alt="로고"></h1></a> end tag for element "A" omitted, but its declaration does not permit this end tag for
10 end tag for element "A" which is not open
11 <p class="other"><span><a href="test.html"><img src="img.gif" alt="이미지" border="0"></a></p></span> end tag for element "SPAN" omitted, but its declaration does not permit this end tag for
12 end tag for element "SPAN" which is not open end tag for
13 중복 선언된 속성 한 태그 내에 중복된 속성 사용 <p class ="slogan" style="font-size: 0.8em" style="color: #000"> duplicate secification of attribute "STYLE" duplicate secification of attribute
14 <img src="image.gif" alt="이미지" alt="이미지"> duplicate secification of attribute "ALT" duplicate secification of attribute
15 중복된 속성 값 사용(id 사용) <input type="text" name="id_1" id="search">...(중략)...<input input type="text" name="id_2" id="search"> ID "SEARCH" already defined already defined

 

웹 어플리케이션 접근성

1. 어플리케이션 접근성의 개념

웹 애플리케이션: 웹 콘텐츠에 포함되어 특정한 기능을 수행하도록 구성된 애플리케이션

  • 웹 콘텐츠 내에 삽입되는 별도의 응용프로그램, 자바 스크립트로 구현된 프로그램 등은 자체적으로 접근성을 갸지고 있어야 한다.
  • 검사항목 1~23번 항목을 준수한 경우 자체적인 접근성이 있다는 의미이다.

 

2. 어플리케이션 접근성의 필요성/목적

웹 콘텐츠에 포함된 부가적인 애플리케이션이나 기능을 실행하는데 있어 운영체제에서 제공하는 접근성 API를 사용하여 제작되도록 하고 이를 활용하여 웹 애플리케이션 영역에도 접근성을 제공하여 모든 형태의 콘텐츠에서 차없이 이용할 수 있도록 하는데 목적이 있다.

 

3. 어플리케이션 접근성의 검사항목 해설

  • 웹 어플리케이션은 주로 플러그인(플래시, 플렉스, 실버라이트, 자바 애플릿 등) 기술, RIA 기술이 주류를 이루고 있다.
  • 이러한 기술들에 대한 자체적인 접근성 구현 방법은 웹 접근성 연구소에서 제공하고 있으므로 이를 활용하여 접근성을 구현하는 것이 최선의 방법이다.
  • 원본 소스가 없다거나 해당 콘텐츠나 기능의 난이도로 인하여 직접적으로 접근성을 구현하기 어려운 겅우 대체수단을 제공하여 줌으로써 우회할 수 있는 경로를 제공할 수 있다.

 

4. 어플리케이션 접근성 제공 방법

(1) 제공 방법

기준: 자체 접근성을 준수하여 제공한 경우 기준을 준수한 것으로 인정한다.

(2) 오류 유형

a. 웹 어플리케이션이 자체적인 접근성이 없으며 대체 콘텐츠가 존재하지 않는 경우(원본 X) → 플래시 버전은 그대로 두고 플래시를 이용하지 못하는 사용자를 위해 일반 HTML로 제공된 대체 수단을 함께 나열

 

어플리케이션 접근성 오류 유형1 (출처: 배움나라)

[Tip] 웹 애플리케이션 대체 수단

만약 웹 애플리케이션의 자체 접근성을 제공하기 어려워 대체 수단을 제공하는 대체 수단에서 제공되는 정보나 기능이 웹 애플리케이션에서 직접적으로 접근성을 구현한 수준과 동일하지는 않더라도 동등한 수준으로 제공되어야 한다.

동등하게 제공한다는 것은 예를 들어, 3D로 시각화한 지도에서 다양한 연산기능을 제공하더라도 2D형태의 지도로 해당 연산의 주요한 결과 값 정도를 제공해주면 동등한 수준으로 인정된다.

모든 정보가 아니더라도 주요한 정보나 목표된 정보에 대한 구체성이 있다면 준수한 것으로 인정한다. 예를 들어, 찾아오시는 길의 지도 정보에서 지도 안의 모든 정보를 제공하기보다 찾아오는 길 위주의 설명이 제공된다면 준수한 것으로 인정한다.

 

b. 대체 콘텐츠를 제공했지만 핵심기능을 동등하게 재공하지 못한 경우

  • 플래시로 제작된 e-Book 콘텐츠가 자체적인 접근성을 구현할 수 없어 HTML 페이지로 대신 제공한 경우: 대체수단으로 인정
  • e-Book 콘텐츠의 내용을 그대로 제공하지 않고 요약형태로 제공한 경우: 핵심기능을 동등하게 제공하지 못한 것으로 판단

 

(3) 주의사항

a. 자바 스크립트 미지원 환경에서는 평가하지 않는다.

  • 웹 콘텐츠 접근성 지침 1.0의 18번 항목. 마크업 구현 가능한 기능을 자바 스크립트로만 구현하지 말아야 한다.
  • 링크, 입력서식, 버튼 등 마크업 언어로 만들 수 있는 기능을 자바 스크립트로 구현하여 자바 스크립트가 미작동 될 경우, 기능적 문제를 유발하여 웹 접근성을 저해하는 요소로 판단
  • 18번 항목을 검사하기 위해 자바 스크립트 지원환경을 고의로 미지원시켜 평가하는 형태로 잘못 이해되기도 하였다.
  • 따라서, 웹 애플리케이션에 해당하는 자바 스크립트 프로그램 등에 대해서 "자체적인 접근성을 중심으로 검사한다.", "지원 환경을 제거하여 평가하지 않는다."는 것을 주의사항에서 제시한다.

b. 웹 애플리케이션에 대한 자체 접근성은 각 검사항목에서 평가한다.

웹 애플리케이션에 대한 자체 접근성은 웹 어플리케이션 영역에 대해 1~21번 검사항목을 준수하는지를 판단하게 되므로 22번 검사항목은 타 검사항목과 달리 영역에 대한 성격으로 규정한다. 따라서 22번 검사항목은 자동적으로 해당사항이 없다.

 

내용 정리

1. 마크업 오류 방지

  • (1) 태그를 열었다면 반드시 닫아주어서 오류를 방지
  • (2) 태그를 중첩되지 않도록 제공
    - 태그의 중복: 속성의 중복으로 기능의 오류를 일으킴
  • (5) 열고 닫음, 중첩오류, 속성 중복에 대한 주요 오류 메세지
    - end tag for
    - duplicate specification of attribute
    - already defined

2. 웹 어플리케이션 접근성

  • (1) 플래시, 실버라이트, 자바 애플릿 등 웹 애플리케이션에 대해서 자체 접근성이 필요
    - 자체 접근성: 한국형 웹 콘텐츠 접근성 지침 2.1의 1~23번 항목 준수
  • (2) 기술적 제약 등 웹 어플리케이션의 자체 접근성 준수가 어려운 겅우
    - 대체 콘텐츠 및 대체 수단 제공
댓글
© 2018 webstoryboy