글로벌 툴 허브
현재 언어: Korean
가이드 목록으로

가이드

피해야 할 접근성 대비 실수

디자인/프론트엔드 작업에서 반복되는 대표적인 대비 실수를 빠르게 점검합니다.

대비 문제는 대부분 예측 가능합니다. 늦은 점검, 단일 상태만 확인, 감각 중심 판단이 반복되는 핵심 원인입니다.

Mistake: checking only default state

Hover, focus, disabled, and active states often fail while default passes.

Always test full component state sets.

Mistake: treating brand colors as untouchable

Brand identity can stay intact while adjusting lightness for readability.

Document accessible alternates for text and interactive UI use.

Mistake: testing large text only

Body copy and helper text require stricter contrast thresholds.

Include small text in every accessibility review.

Mistake: skipping real-background testing

A color can pass on white but fail on cards, banners, and gradients.

Validate color pairs in real layouts.

Useful for

  • Design QA checklists.
  • Frontend accessibility reviews.
  • Component library updates.

Prevent mistakes upstream

Catch contrast problems in design tokens and component specs, and you will fix fewer issues later in QA.

관련 도구

대비 검사기

텍스트와 배경 색상을 비교해 대비 비율과 WCAG 기준 충족 여부를 확인하세요.

Open Contrast Checker

더 읽어볼 가이드

비슷한 작업 흐름을 다룬 다른 짧은 가이드도 함께 살펴보세요.