WCAG 2.1 항공사 WAI-ARIA 적용 사례
  • 모두를 위한 디자인
  • 항공사의 웹 접근성 준수 의무
  • 국내 접근성과 국제 접근성은 어떻게 다를까?
  • 항공사 접근성 위배로 인한 벌금 부과 사례
  • AOA 2023~
    • 주요 UI별 ARIA 적용 사례 (2022~2024)
      • 호버 콘텐츠 적용사례
      • 입력 글자 수 제한 사례
      • 🕹️Form 그룹의 오류 적용 사례
      • 비밀번호 실시간 오류 적용 사례
      • 🖼️SVG 이미지의 접근성 향상 방법
      • 오류메시지 종류별 적용 사례
      • 스낵바(Snack bar) 적용 사례
  • AOA 2019
    • 주요 UI별 ARIA 적용 사례 (2019)
      • 스핀 버튼 적용 사례
      • 페이지 네비게이터 적용 사례
      • 메인 네비게이션 구현 사례
      • 메뉴 적용 사례
      • 캐러셀 적용 사례
      • 채팅 상담 적용 사례
      • 툴팁 적용 사례
      • 그룹명 필수 항목 적용 사례
      • 이해하기 쉬운 데이터 테이블 적용 사례
      • 날짜 입력 적용 사례
    • 알아두면 좋은 TIP!
      • dl, dt, dd 태그를 남용하지 마세요.
      • 제발 나를 무시해 주세요.
      • 띄어쓰기를 주의하세요!
  • AOA 2018
    • 주요 UI별 ARIA 적용 사례 (2018)
      • 로딩 적용 사례
      • Date Picker 적용사례
      • 좌석선택 적용사례
      • 탭 UI 적용 사례
      • 모달 다이얼로그 적용 사례
      • 확장과 축소 콘텐츠 적용 사례
      • 정렬할 수 있는 table 적용 사례
      • 자동완성 적용 사례
      • 접근성 주요 개선 항목
        • 버튼을 왜 링크로 쓰는거지?
        • 그룹에게는 그룹명을 알려주자
        • 에러메세지는 왜 보이기만 하지?
        • 이해하기 어려운 폼 레이블
        • 화면을 보는 스크린리더 사용자
        • 전환되지 않는 페이지의 포커스
        • 동일한 기능의 서로 다른 UI
    • 알아두면 좋은 것들
      • role=application은 언제 사용할까?
      • 대문자로만 표현해야 할 때
      • 화면의 정렬을 위해 중복 태그를 사용하지 말 것
    • Screen Reader 테스트
      • Screen Reader와 Browser 조합
      • Screen Reader 버그
  • WAI-ARIA
    • Landmark Role
    • Widget Role & Attributes
  • Contact
    • 무엇이 궁금하세요?
Powered by GitBook
On this page
  • 체크인 좌석 선택 vs 사전 좌석 배정
  • 해결방안

Was this helpful?

Edit on Git
  1. AOA 2018
  2. 주요 UI별 ARIA 적용 사례 (2018)
  3. 접근성 주요 개선 항목

동일한 기능의 서로 다른 UI

Previous전환되지 않는 페이지의 포커스Next알아두면 좋은 것들

Last updated 5 years ago

Was this helpful?

체크인 좌석 선택 vs 사전 좌석 배정

항공사 웹 사이트에는 2가지 방법으로 좌석을 미리 선택할 수 있다. 웹 체크인에서 좌석을 선택하는 방법과 사전좌석배정으로 좌석을 선택하는 방법이 있다.

사용자에게는 좌석을 선택하는 동일한 기능임에도 불구하고 초기에는 아래 화면과 같이 비행기 방향, 상호 인터랙션 방법이 크게 다르게 되어 있었다.

체크인 좌석 배정

사전 좌석 배정

  1. 비행기의 방향이 체크인 좌석선택은 세로방향, 사전좌석배정은 가로 방향으로 되어 있음.

  2. 좌석등급별 이미지가 다른 스타일로 되어있음.

  3. 좌석을 선택하는 방법이나 플로우가 상이함.

사전좌석배정은 항공권 예매와 함께 좌석을 미리 지정할 수 있는 기능이며, 체크인 좌석배정은 국제선은 출발 48시간 전, 국내선은 24시간 전에 체크인과 함께 좌석 배정을 하는 기능이다.

기본적으로 두 개의 좌석 배정 기능 모두 접근성을 준수하고 있어도, 사용자가 UI 내에서 인터랙션 하는 방법이나 구성 요소, 방향 등이 크게 다르기 때문에 사용자는 동일한 기능임에도 다르게 수행해야 하는 어려움이 있다.

해결방안

해결방안은 딱 한가지이다. 동일한 UI로 통일하여 사용자에게 제공해야 한다는 것이었고, 현재는 사전좌석배정 UI를 체크인 좌석 선택 기능에도 동일한 UI를 제공하고 있다.

좌석배정 기능의 접근성 준수 방법은 다음 섹션에서 자세히 설명하겠다.