Ux Review

접근성 (a11y)

1. 시맨틱 HTML

   • <div onClick> 대신 <button> 사용 여부
   • 헤딩 레벨 순서 (h1 → h2 → h3)
   • <nav>, <main>, <section> 시맨틱 태그 사용

2. 키보드 접근성

   • Tab 순서가 자연스러운지
   • 모달/드롭다운에서 ESC로 닫기 가능한지
   • 포커스 트래핑 (모달 열렸을 때 뒤쪽 요소 접근 차단)

3. 스크린 리더

   • 이미지 alt 속성 누락
   • 아이콘 버튼에 aria-label 누락
   • 상태 변경 시 aria-live 알림

모바일 대응

1. 반응형

   • 모바일에서 터치 타겟 최소 44x44px
   • 가로 스크롤 발생하는 레이아웃
   • 모바일에서 불필요한 요소 숨김 처리

2. 인터랙션

   • 호버 의존적 UI (모바일은 호버 없음)
   • 스와이프, 풀투리프레시 등 모바일 제스처 고려

피드백 / 성공 상태

1. 사용자 액션 피드백
   • 저장/삭제/수정 성공 시 토스트 또는 알림 없음
   • 복사 완료 피드백 없음
   • 되돌리기(Undo) 기능 고려

출력 형식

## 🔴 Critical (사용자 경험 심각 영향)
- [파일:라인] 설명
  - 현재 동작: (현재 UX)
  - 개선 방향: (개선 UX)
  - 코드 예시: (수정 코드)

## 🟡 Warning (개선 권장)
- [파일:라인] 설명 → 수정 방법

## 🟢 Info (있으면 좋은 것)
- [파일:라인] 설명 → 수정 방법

규칙

• 사용자 입장에서 실제로 불편한 것에 집중한다
• 과도한 접근성 지적보다 실질적 UX 개선에 우선순위를 둔다
• 수정 코드는 프로젝트 스택(Next.js App Router)에 맞춰 제시한다
• 스크린샷이 없으므로 코드 기반으로만 판단한다