약관도 키보드로 다 읽을 수 있게

KRDS BP-034 — 키보드를 이용하여 약관 내용을 확인할 수 있도록 제공하고 있다.

0. 들어가며 — 600편, 약관을 마우스로만 읽을 수 있으면

이번 600편은 키보드를 이용하여 약관 내용을 확인할 수 있도록 제공하라는 규칙입니다. 시리즈 600편째네요.

약관 내용이 — 작은 스크롤 박스 안에 있을 때, 마우스로만 스크롤되고 키보드로는 못 읽으면, 키보드 사용자는 동의할 내용을 확인 못 하죠. BP-034는 약관을 키보드로 확인할 수 있게 하라고 규정합니다. 키보드 접근성(KWCAG 2.1.1)의 동의 적용이죠. 이번 편을 풀어냅니다.

1. 원문 — 키보드로 약관 확인

BP-034 (기본 패턴 > 동의) “키보드를 이용하여 약관 내용을 확인할 수 있도록 제공하고 있다.”

약관 내용을 키보드만으로 스크롤·확인할 수 있게 제공하라는 뜻입니다.

정리: 약관을 키보드로 확인할 수 있게 제공하라. 이게 BP-034입니다.

2. 왜 키보드 약관 확인인가

동의 화면에서 약관(이용약관, 개인정보처리방침)은 사용자가 동의하기 전에 읽고 확인할 내용입니다. 그런데 약관이 흔히 작은 스크롤 박스(고정 높이 영역에 긴 약관을 스크롤로) 안에 표시되죠. 이 스크롤 박스가 마우스 로만 스크롤되고 키보드로는 안 되면, 키보드 사용자는 약관을 다 못 읽습니다. BP-034는 키보드 확인을 요구합니다.

키보드로 약관을 못 읽을 때의 문제:

약관 스크롤 박스 키보드 미지원 약관을 작은 <div> 스크롤 박스에 넣었는데, 그 박스가 키보드 포커스를 못 받거나 화살표 키로 스크롤이 안 되면, 키보드 사용자는 박스 안의 약관을 스크롤해 읽을 수 없습니다. 첫 화면에 보이는 일부만 보고, 나머지는 못 보죠.

동의할 내용 확인 불가 키보드 사용자가 약관 전체를 못 읽으면, 무엇에 동의하는지 모르고 동의해야 합니다. 이는 충분한 정보에 기반한 동의가 아니죠. 키보드·스크린 리더 사용자가 동의의 권리를 제대로 행사 못 합니다.

그래서 BP-034는 — 약관을 키보드로 확인할 수 있게 하라고 합니다(키보드 접근성 KWCAG 2.1.1):

스크롤 박스 키보드 접근 약관 스크롤 박스를 키보드 포커스 가능하게 하고(tabindex="0"), 화살표 키· PageUp/Down으로 스크롤되게 합니다. 키보드 사용자가 박스에 포커스를 주고 약관을 끝까지 스크롤해 읽게요.

또는 스크롤 박스 대신 약관을 작은 스크롤 박스가 아니라, 별도 페이지·전체 표시로 제공하면 키보드 접근이 더 쉽죠(페이지 자체가 키보드로 스크롤됨). 또는 ‘약관 전문 보기’ 링크로 전체를 펼치게요.

스크린 리더 연계 — 키보드 접근에 더해 — 스크린 리더가 약관을 읽을 수 있게 시맨틱 마크업(BP-035의 구조화, 제목·문단)을 합니다. 키보드(034)·스크린 리더 모두 약관을 확인하게요.

왜 동의에 특히 중요한가. 동의는 사용자가 내용을 알고 해야 유효합니다(informed consent). 약관을 못 읽고 동의하는 건 진정한 동의가 아니죠. 키보드·스크린 리더 사용자도 비장애인과 동등하게 약관을 확인하고 동의할 권리가 있습니다. 약관 키보드 접근은 그 권리의 기본이죠.

날짜 입력 키보드(CP-390) 등과 통함. 모든 기능의 키보드 접근(KWCAG 2.1.1) 원칙을 — 약관 확인이라는 동의의 핵심 행위에 적용한 것입니다.

이 규칙은 동의 패턴의 ’약관 키보드 접근’을 담당합니다 — 약관을 키보드로 확인하게 해(034), 키보드 사용자도 동의할 내용을 다 읽고 동의하게 하죠. 충분한 정보에 기반한 동의의 접근성입니다.

정리하면 — 약관이 마우스로만 스크롤되면 키보드 사용자가 동의할 내용을 확인 못 하므로, 약관 스크롤 박스를 키보드 접근 가능하게 하거나 별도 페이지·전체 표시로 키보드로 약관을 확인하게 해야 합니다.

3. 점검 / 개선

무엇을 점검하나

스크롤 박스 키보드 — 약관 스크롤 박스가 키보드 포커스·화살표 스크롤이 되는가.

전체 확인 — 키보드로 약관 전체를 끝까지 읽을 수 있는가.

스크린 리더 — 스크린 리더가 약관을 읽을 수 있는가(구조화 BP-035).

개선 방향

약관 스크롤 박스에 tabindex="0" + 키보드 스크롤. 또는 별도 페이지·전체 표시·전문 보기 링크.

시맨틱 구조화(BP-035)로 스크린 리더 접근. 키보드 단독 약관 확인 검증.

4. 누가 담당하나 / 우리 사이트에 해당될까?

역할	책임
퍼블리셔/개발	약관 키보드 접근 구현
QA/접근성	키보드 약관 확인 검증

기관 유형	BP-034 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 필수 (약관 동의 받는 경우)

웹접근성 의무 대상이며 약관 동의를 받는 사이트에 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 약관 스크롤 박스가 키보드 포커스·화살표 스크롤이 되나요?

□ 키보드로 약관 전체를 끝까지 읽을 수 있나요?

□ 스크린 리더가 약관을 읽을 수 있나요(구조화)?

❓ FAQ

Q1. 약관이 작은 스크롤 박스에 있으면 왜 문제인가요? 마우스로만 스크롤되면 키보드 사용자가 박스 안 약관을 다 못 읽습니다. 동의할 내용을 확인 못 하죠. Q2. 어떻게 키보드 접근을 하나요? 박스에 tabindex="0"+화살표 스크롤을 주거나, 별도 페이지·전체 표시·전문 보기 링크로 키보드로 읽게 합니다. Q3. 왜 동의에 중요한가요? 동의는 내용을 알고 해야 유효합니다(informed consent). 키보드 사용자도 약관을 다 읽고 동의할 권리가 있죠.

6. 마무리

BP-034의 메시지:

약관도 키보드로 다 읽을 수 있게 — 키보드로 약관 내용을 확인할 수 있게 제공하라.

약관이 마우스로만 스크롤되면 키보드 사용자가 동의할 내용을 확인 못 합니다. 약관을 키보드 접근 가능하게 해 모든 사용자가 읽고 동의하게 하는 게 핵심이죠. 다음 편은 약관 구조화입니다.

다음 편 예고 ▶ 「601. (BP-035) 약관 내용을 제목, 문단 등으로 적절하게 구조화하여 제공하고 있다.」

ViewCheck는 약관이 키보드로 확인 가능한지를 진단합니다.

📚 참고 출처

KRDS 기본 패턴 — 동의 가이드 — https://www.krds.go.kr/html/site/pattern/pattern_03.html

WCAG 2.1 SC 2.1.1 Keyboard — https://www.w3.org/WAI/WCAG21/Understanding/keyboard.html

KRDS #ViewCheck #공공웹사이트 #전자정부 #디지털정부 #웹접근성 #디자인시스템 #UIUX #UI컴포넌트 #웹표준

KRDS,ViewCheck,공공웹사이트,전자정부,디지털정부,웹접근성,디자인시스템,UIUX,UI컴포넌트,웹표준