[부스트코스] 웹 접근성 지침 정리 2

 

 

2. 웹 점근성 지침

7) 콘텐츠 간의 구분

• 이웃한 콘텐츠는 구별될 수 있어야 함
  1. 테두리 이용하여 구분
  2. 콘텐츠 사이에 시각적인 구분선을 삽입하여 구분
  3. 서로 다른 무늬를 이용하여 구분
  4. 콘텐츠 배경색  간의 명도대비(채도)를 달리하여 구분
  5. 줄 간격 및 글자 간격을 조절하여 구분
  6. 기타 콘텐츠를 시각적으로 구분할 수 있는 방법을 통해 구분

---

8)  키보드 사용 보장

• 모든 기능은 키보드만으로도 사용할 수 있어야 함
  • <a> 태그 사용시 href 속성

---

9) 초점 이동

• 키보드에 의한 초점은 논리적으로 이동해야 하며, 시각적으로 구별할 수 있어야 함
  
  • 아래 사용 시 초점이 안 보임. 주의해야 함
    • hideFocus
    • outline: none
    • onfocus="this.blur();"

---

10) 조작 가능

• 사용자 입력 및 컨트롤은 조작 가능하도록 제공되어야 함
  • 컨트롤 대각선 길이 6mm 이상
  • 컨트롤 테두리 안쪽으로 1픽셀 이상의 여백

---

11) 응답 시간 조절

• 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있어야 함
  • 자동로그아웃 기능 사용 시에 사용자가 로그인연장 기능 등을 사용할 수 있어야 함
  • 페이지 자동 전환 시에도 '이용하지 않기' 기능 등을 제공해야 함

---

12) 정지 기능 제공

• 자동으로 변경되는 콘텐츠는 움직임을 제어할 수 있어야 함
  • 이미지가 자동 슬라이드 되는 기능은 사용하지 않는 것이 좋으며, 사용 시에는 재생과 정지를 할 수 있는 컨트롤 버튼을 제공해야 함
  • 마우스 오버 시 정지 + 키보드 접근 시 정지 = 정지 기능 제공
  • 마우스 오버 시, 키보드 접근 시 모든 콘텐츠 노출

---

13) 깜빡임과 번쩍임 사용 제 한

• 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 함

---

14) 반복 영역 건너뛰기

• 콘텐츠의 반복되는 영역은 건너뛸 수 있어야 함
  • 키보드 접근 가능하게 해야 하며, 접근 시 화면에 노출해야 함
    • 마크업상 최 상단에 위치
    • 링크가 페이지 내에 존재
    • 키보드 접근 시 화면에 노출
    • "하단 메뉴로 바로 가기"와 같은 위치 정보 제공은 부적절

---

15) 제목 제공

• 페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야 함

---

16) 적절한 링크 텍스트

• 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 함

 

 

 

부스트코스 '웹 접근성 이해' 강의 정리