Chapter 12

웹 접근성

  • 12.1 웹 접근성이란
  • 12.2 쉬운 문제부터 해결하기
  • 12.3 모두가 혼란스러워하는 문제 먼저
  • 12.4 접근성을 위한 첫걸음

접근성. 많은 개발자와 디자이너가 중요하다는 건 아는데 실천은 안 하는 주제지. 크룩은 이 챕터에서 접근성의 기술적 세부사항보다는 **"왜 해야 하고, 어디서부터 시작해야 하는지"**에 초점을 맞춰.

**웹 접근성(accessibility)**은 장애를 가진 사람도 웹을 사용할 수 있게 만드는 거야. 시각 장애, 청각 장애, 운동 장애, 인지 장애 등 다양한 장애를 가진 사용자들이 웹 콘텐츠에 접근하고 사용할 수 있어야 하거든.

크룩이 지적하는 현실:

  • 대부분의 사이트가 접근성을 고려하지 않아
  • 개발자 대부분이 "나중에 할게"라고 미루다 안 하지
  • 접근성은 법적 요구사항인 경우도 많은데 무시되고 있어

접근성을 안 하는 이유? 크룩은 이렇게 봐:

  • **"어렵다"**는 인식 — 접근성 가이드라인(WCAG)이 방대하고 복잡해서 어디서 시작해야 할지 모르겠다는 거지
  • **"우리 사용자 중에 장애인이 없다"**는 착각 — 실제로는 인구의 상당수가 어떤 형태로든 장애를 가지고 있어. 영구적 장애뿐 아니라 일시적 장애(팔이 깁스 중), 상황적 장애(밝은 햇빛 아래에서 화면을 보는 것)도 포함돼
  • **"비용이 많이 든다"**는 걱정 — 처음부터 고려하면 추가 비용이 크지 않아. 나중에 고치는 게 비싸지

크룩의 핵심 주장: 접근성은 **"특별한 사람을 위한 특별한 작업"**이 아니라, **"모든 사용자를 위한 더 나은 디자인"**이야. 접근성을 개선하면 장애가 없는 사용자의 경험도 좋아지거든. 예를 들어 영상에 자막을 달면 청각 장애인만 아니라 소리를 켤 수 없는 환경에 있는 모든 사용자에게 도움이 되잖아.

접근성의 가장 큰 진입 장벽은 **"어디서 시작하지?"**야. WCAG 가이드라인은 수백 개의 항목이 있고, 전부 다 지키려면 막막하거든.

크룩의 접근법: 쉬운 것부터 해. 완벽을 목표로 하면 시작도 못 해.

바로 할 수 있는 쉬운 접근성 개선:

  • 이미지에 alt 텍스트 달기 — 스크린 리더가 이미지를 읽어줄 수 있게. 가장 기본적이고 가장 쉬운 접근성 개선이야
  • 양식 요소에 레이블 연결하기<label> 태그를 <input>과 연결. 스크린 리더가 "이 입력란이 뭔지"를 알려줄 수 있게
  • 색만으로 정보를 전달하지 않기 — 빨간색으로 에러를 표시하는 건 색맹 사용자에게는 안 보여. 색 + 텍스트 + 아이콘으로 중복 표시해야 해
  • 충분한 색 대비 — 배경과 텍스트의 명암 대비가 충분해야 저시력 사용자도 읽을 수 있어
  • 키보드만으로 사용 가능하게 — 마우스 없이 탭 키와 엔터 키만으로 모든 기능을 쓸 수 있어야 해
  • 제목 태그를 올바르게 사용하기<h1>, <h2>, <h3>을 논리적 순서로. 스크린 리더 사용자는 제목으로 페이지 구조를 파악하거든

이 정도만 해도 접근성의 상당 부분이 개선돼. 그리고 이건 큰 비용이 들지 않아. 코드 몇 줄 수정하는 수준이야.

크룩이 제안하는 영리한 접근법이 있어. 접근성 전용 작업을 따로 하기보다, **"모든 사용자가 혼란스러워하는 문제"**를 먼저 고치라는 거야.

왜냐면 — 모든 사용자에게 어려운 것은 장애를 가진 사용자에게는 더더욱 어렵기 때문이지. 내비게이션이 혼란스러우면, 시력이 좋은 사용자도 힘든데 스크린 리더를 쓰는 사용자는 오죽하겠어.

그래서 전략은:

  1. 사용성 테스트를 해서 모든 사용자가 겪는 문제를 찾아 (9장에서 배운 방법)
  2. 그 문제를 고쳐. 이건 접근성 전용 작업이 아니라 모든 사용자를 위한 개선이야
  3. 그 과정에서 접근성 기본도 같이 챙겨. alt 텍스트, 레이블, 색 대비 같은 것들

이러면 접근성이 별도의 부담이 아니라 **"그냥 좋은 디자인의 일부"**가 돼. 따로 시간 내서 "접근성 프로젝트"를 하는 게 아니라, 일상적인 디자인 개선의 일부로 녹아드는 거지.

크룩이 권하는 실천적 첫걸음:

  • 한번 스크린 리더로 자기 사이트를 써봐. NVDA(무료) 같은 스크린 리더를 켜고 눈 감고 사이트를 써보면, 접근성이 얼마나 안 되어 있는지 바로 체감돼
  • 키보드만으로 써봐. 마우스 치우고 탭 키만으로 사이트를 탐색해봐. 포커스가 어디에 있는지 안 보이거나, 특정 기능에 접근 못 하는 경우가 많을 거야
  • 접근성 검사 도구를 돌려봐. axe, WAVE 같은 무료 도구가 자동으로 접근성 문제를 잡아줘. 물론 자동 검사가 모든 걸 잡지는 못하지만, 시작점으로는 충분해

크룩의 메시지는 실용적이야. 완벽한 접근성을 한 번에 달성하려고 하면 시작도 못 해. 그 대신 **"오늘 하나라도 개선하자"**는 마인드로 접근하면 돼. alt 텍스트 하나 추가하는 것, 색 대비 하나 고치는 것 — 이런 작은 것들이 모이면 큰 차이를 만들어.


정리

12장 읽고 기억할 거:

  1. 접근성은 특별한 사람을 위한 특별한 작업이 아니야. 접근성을 개선하면 모든 사용자의 경험이 좋아져
  2. 쉬운 것부터 해. alt 텍스트, 레이블, 색 대비, 키보드 접근성. 이것만 해도 큰 차이야
  3. 모든 사용자가 혼란스러워하는 문제를 먼저 고쳐. 그게 접근성 개선의 가장 효율적인 경로야