Skip to content

Conversation

@hanheel
Copy link

@hanheel hanheel commented Sep 21, 2025

요구사항

  • 스크린 리더로 성인 승객 수를 늘리거나 줄일 수 있어야 한다.
  • 인원 수는 최소 1명, 최대 3명까지만 가능하게 구현한다.
  • 승객 수를 늘리는 경우 실제 스크린 리더는 아래와 같이 읽을 수 있어야 한다.
const result = ""

항공권 예매
성인
성인 승객 감소, 버튼
1
성인 승객 증가, 버튼
(선택)
성인 승객 증가
2
(선택)
성인 승객 증가
3
(선택)
최대 승객 수에 도달했습니다.

구현 사항

  1. 언어 설정
    index.html 언어를 "ko"로 설정
    ✅ 커밋 해시 : 5b447d6

  2. 버튼 접근성 설정 추가

  • aria-label 속성을 통해 버튼의 명확한 기능 설명
  • 최소 / 최대 인원수에 도달한 경우 명시적으로 메세지 출력
  • 버튼을 누를시 변경 값을 함께 알려주도록 aria-live 속성 추가
  • 최대 / 최소 인원수에 도달할 경우 출력되는 메세지 output 태그로 변경
    ✅ 커밋 해시 : b316d5a, 491ac33
  1. 시맨틱 태그 사용
    App.tsx의 div 태그를 main 및 section 태그로 변경
    ✅ 커밋 해시 : 4a143c1

1. aria-label 속성을 통해 버튼 접근성 설명 대체
2. 최소 / 최대 인원수에 도달한 경우 명시적으로 메세지 출력
3. 버튼을 누를시 변경 값을 함께 알려주도록 aria-live 속성 추가
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant