웹 접근성

시맨틱 HTML을 제대로 쓰면 접근성의 80%는 해결된다, 키보드, 스크린 리더, 색상, 폼까지

1. 01

   접근성은 HTML이다

   div onclick이 아니라 button을 써야 하는 이유, 시맨틱 마크업이 접근성의 근간인 이유를 시각화합니다

2. 02

   키보드 네비게이션

   마우스 없이 웹을 쓸 수 있는가? Tab 순서, focus 관리, skip link, focus trap을 시각화합니다

3. 03

   스크린 리더와 ARIA

   스크린 리더는 페이지를 어떻게 읽는가? 랜드마크, role, aria-label, aria-live를 시각화합니다

4. 04

   색상, 대비, 모션

   색상만으로 정보를 전달하고 있지 않은가? 대비 비율, 색맹 고려, prefers-reduced-motion을 시각화합니다

5. 05

   폼과 에러 처리

   label 연결, 에러 메시지 전달, 자동완성, 접근 가능한 폼을 만드는 핵심 기법을 시각화합니다