Skip to content

접근성 ​

Hoardly는 모든 사용자를 위해 플랫폼을 접근 가능하게 만드는 데 최선을 다하고 있습니다. 저희는 WCAG 2.1 레벨 AA 표준을 준수하는 것을 목표로 합니다.

키보드 탐색 ​

모든 인터랙티브 요소는 키보드를 통해 접근하고 사용할 수 있습니다:

키동작
Tab인터랙티브 요소 위로 순차적으로 이동
Shift + Tab인터랙티브 요소 뒤로 순차적으로 이동
Enter버튼 및 링크 활성화
Space체크박스 및 버튼 토글
Esc대화 상자 및 드롭다운 닫기
화살표 키메뉴 및 목록 내 탐색

스크린 리더 지원 ​

Hoardly는 애플리케이션 전체에 ARIA 속성을 구현합니다:

  • 올바른 문서 구조를 위한 의미론적 HTML 요소
  • 모든 인터랙티브 요소에 대한 ARIA 레이블
  • 복잡한 UI 구성 요소(메뉴, 대화 상자, 탭)에 대한 ARIA 역할
  • 동적 콘텐츠 업데이트를 위한 라이브 영역
  • 본문으로 바로 이동할 수 있는 스킵 링크
  • 이미지에 대한 설명적인 대체 텍스트
  • 양식 레이블 및 오류 메시지가 올바르게 연결됨

저희는 NVDA 및 JAWS (Windows), VoiceOver (macOS/iOS) 및 TalkBack (Android)을 포함한 일반적인 스크린 리더를 사용하여 테스트합니다.

시각적 사용자 정의 ​

Hoardly에는 접근성을 고려하여 설계된 20개 이상의 내장 색상 테마가 있습니다:

  • 다크 모드: 어두운 환경에서 눈의 피로를 줄여줍니다.
  • 라이트 모드: 밝은 환경에서 높은 대비를 제공합니다.
  • 다양한 색상 테마: 다양한 시각적 선호도와 조건에 맞게 선택 가능합니다.
  • OKLCH 색상 공간: 더 나은 가독성을 위한 인지적으로 균일한 색상입니다.
  • WCAG AA 대비 비율: 모든 테마에서 유지됩니다.

TIP

헤더(오른쪽)의 테마 컨트롤을 사용하여 테마를 둘러보고 변경할 수 있습니다. 선택 사항은 이 장치에 저장되며, 로그인하면 계정에 동기화됩니다.

반응형 디자인 ​

인터페이스는 다양한 화면 크기와 입력 방식에 맞게 조정됩니다:

  • 터치 장치를 위한 모바일 친화적인 레이아웃
  • 브라우저 확대 기능을 존중하는 반응형 텍스트 크기 조절
  • WCAG 2.1 레벨 AAA 기준을 충족하는 최소 44x44 픽셀의 터치 타겟
  • 콘텐츠가 수평 스크롤 없이 리플로우됩니다.
  • 브라우저 텍스트 확대 기능을 최대 200%까지 지원합니다.

접근성 문제 보고 ​

접근성 문제가 발생하면 support@hoardly.app으로 문제에 대한 설명과 해당 문제를 발견한 페이지 또는 기능에 대해 알려주시기 바랍니다.

Hoardly Wiki