YourWorldTime

접근성

이 사이트는 WCAG 2.2 AA 등급을 목표로 합니다. 그중 자동으로 검사할 수 있는 부분은 빌드마다 검사하며, 후퇴가 생기면 빌드가 실패합니다.

빌드가 강제하는 것

  • 색 대비. 모든 텍스트 조합을 4.5:1 비율에, 모든 초점 표시를 3:1에 견주어 검사합니다. 밝은 테마와 어두운 테마 모두에서요. 색상표는 테스트에 복사해 두는 대신 스타일시트에서 읽어 오므로, 색 하나를 바꾸면 그것만으로 검사가 돌아갑니다.
  • 마크업 의미. 린터가 모든 구성 요소에 접근성 규칙을 적용합니다. 빠진 레이블, 잘못된 ARIA, 핸들러가 붙은 비대화형 요소는 모두 빌드를 떨어뜨립니다.
  • 가로 넘침 없음. 아랍어의 오른쪽에서 왼쪽 배치까지 포함해, 실제 브라우저에서 검사합니다.

설계상의 결정

  • 색이 유일한 신호인 경우는 결코 없습니다. 회의 플래너의 근무 시간은 채움과 함께 테두리를 지니고, 서머타임 경고는 호박색 색조가 아니라 말로 적혀 있습니다.
  • 결과가 스스로 알립니다. 모든 결과 영역이 aria-live="polite"이므로, 변환이 바뀌면 읽어 줍니다. 찾아 나설 필요가 없습니다.
  • 모든 입력란에 진짜 레이블이 있습니다. 자리표시자를 레이블 대신 쓴 곳은 어디에도 없습니다.
  • 움직임은 여러분의 설정을 따릅니다. prefers-reduced-motion이 켜져 있으면 애니메이션과 부드러운 스크롤이 꺼집니다.
  • 자바스크립트 없이도 동작합니다. 모든 시차, 전환 날짜, 참고 표, 설명이 미리 만들어진 페이지 안에 있습니다. 스크립트가 필요한 것은 실시간 시계와 대화형 도구뿐이며, 스크립트 없이는 작동하지 않을 조작 요소는 죽은 채로 보여 주는 대신 숨깁니다.
  • 시각은 고정폭 서체와 표 형식 숫자로 조판했습니다. 열이 맞고, 움직이는 숫자가 옆 글자를 밀지 않게 하기 위해서입니다.

알려진 한계

  • 회의 플래너의 24시간 띠는 폭이 넓은 표입니다. 다시 흐르게 하는 대신 자체 컨테이너 안에서 가로로 스크롤합니다. 다시 흐른 띠는 형태로 읽히기를 멈추기 때문입니다. 같은 정보는 그 위 요약에 글로도 실려 있습니다.
  • 자동 검사가 잡아내는 접근성 문제는 일부에 지나지 않습니다. 여기서 무언가가 여러분에게 작동하지 않는다면 그것은 결함이고, 저희는 알고 싶습니다.

알려 주시는 방법

문의 페이지의 주소로 해당 페이지와 무엇이 잘못됐는지 적어 보내 주세요. 보조 기술에 관한 제보는 특히 소중합니다. 그 기술을 앞에 두지 않고서는 가장 검사하기 어려운 부분이기 때문입니다.