크기 단계는 5개까지만

KRDS CP-428 — 옵션의 개수가 많아질 수록 인지적 부담이 증가하므로 옵션 개수는 5개 이내로 제공하고 있다.

0. 들어가며 — 크기 단계가 너무 많으면

이번 548편은 화면 크기 조정 옵션 개수를 5개 이내로 제공하라는 규칙입니다.

글자 크기를 — 너무 여러 단계(8단계, 10단계)로 제공하면, 사용자는 어느 걸 골라야 할지 헷갈리고 인지 부담이 커지죠. CP-428은 옵션을 5개 이내로 제한합니다. 단계 표시기 적정 수(CP-321), 코치마크 개수(CP-369)처럼 인지 부담을 줄이는 정신이죠. 이번 편을 풀어냅니다.

1. 원문 — 옵션 5개 이내

CP-428 (컴포넌트 > 화면 크기 조정) “옵션의 개수가 많아질 수록 인지적 부담이 증가하므로 옵션 개수는 5개 이내로 제공하고 있다.”

화면 크기 조정 옵션(크기 단계)을 5개 이내로 제한해, 사용자의 인지적 부담을 줄이라는 뜻입니다.

정리: 화면 크기 조정 옵션을 5개 이내로 제공하라. 이게 CP-428입니다.

2. 왜 5개 이내인가

화면 크기 조정은 글자·화면 크기를 여러 단계로 조정하게 합니다(작게 / 보통 / 크게 같은). 이 단계(옵션)의 개수가 사용성을 좌우하죠. 너무 많으면 오히려 헷갈립니다. CP-428은 5개 이내를 권장합니다.

옵션이 너무 많을 때의 문제:

선택 부담 글자 크기를 8단계, 10단계로 잘게 나누면, 사용자는 ‘어느 크기가 나에게 맞지?’ 하고 고민합니다. 선택지가 많을수록 결정이 어렵고 인지 부담이 커지죠(선택의 역설).

미세한 차이 — 단계가 너무 많으면 — 인접 단계 간 크기 차이가 미미해, 구별이 잘 안 됩니다. ‘120%와 125% 중 뭐가 나아?’ 같은 무의미한 고민이 생기죠.

주 대상 부담 — 화면 크기 조정의 주 대상인 — 노인·저시력 사용자는, 많은 옵션을 비교·선택하는 게 더 부담 스럽습니다. 간단해야 쓰기 쉽죠.

그래서 CP-428은 — 옵션을 5개 이내로 제한하라고 합니다:

적정 단계 글자 크기를 5개 이내의 의미 있는 단계로 제공합니다. 예: ‘작게 / 보통 / 크게’(3단계) 또는 ‘아주 작게 / 작게 / 보통 / 크게 / 아주 크게’(5단계) 정도로요. 각 단계가 체감되는 크기 차이를 갖게요.

간단한 선택 — 적은 단계면 — 사용자가 빠르게 자기에게 맞는 크기를 고릅니다. 노인·저시력 사용자도 부담 없이요.

5개의 근거. 5개 이내는 인간이 한 번에 비교·선택하기 편한 수준입니다(매직 넘버 7±2의 보수적 적용). 단계 표시기 3~7개(CP-321), 코치마크 4개 이하(CP-369)처럼 컴포넌트의 적정 옵션 수를 제한하는 정신이죠. 화면 크기 조정은 더 단순할수록 좋아 5개 이내로 둡니다.

충분한 크기 범위. 적은 단계로도 — 필요한 크기 범위(작은 글자~큰 글자)를 충분히 커버해야 하죠. 5단계 안에서 — 가장 작은 것과 가장 큰 것의 차이를 충분히 둬, 저시력 사용자가 필요한 만큼 크게 볼 수 있게요. 단계는 적되 범위는 넓게입니다.

브라우저 확대와의 관계. 사이트 자체 크기 조정(이 규칙)에 더해 브라우저 기본 확대(Ctrl++)도 사용자가 쓰죠. 사이트 제공 단계는 간단한 5개 이내로 하고, 더 세밀한 조정이 필요하면 브라우저 확대를 안내할 수도 있습니다. 다만 사이트 자체 기능도 노인 사용자에게 친숙하니 제공하되, 단계는 절제하죠.

이 규칙은 화면 크기 조정의 ’선택 단순성’을 담당합니다 — 옵션을 5개 이내로 제한해(428), 사용자가 부담 없이 자기 크기를 고르게 하죠. 노인·저시력 사용자에게 특히 중요한 단순함입니다.

정리하면 — 크기 조정 옵션이 너무 많으면 선택 부담·인지 부담이 커지므로, 옵션을 5개 이내의 의미 있는 단계로 제한 하되 충분한 크기 범위를 커버해야 합니다.

3. 점검 / 개선

무엇을 점검하나

5개 이내 — 화면 크기 조정 옵션이 5개 이내인가.

의미 있는 단계 — 각 단계가 체감되는 크기 차이를 갖는가(미세한 차이 남발 아님).

충분한 범위 — 적은 단계로도 필요한 크기 범위를 커버하는가.

개선 방향

크기 옵션을 3~5개의 의미 있는 단계로(작게/보통/크게 등).

단계는 적되 최소~최대 크기 범위는 충분히. 세밀 조정은 브라우저 확대 안내.

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

역할	책임
기획/UX	크기 단계 수·범위 설계
퍼블리셔/개발	옵션 구현

기관 유형	CP-428 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 조건부 (화면 크기 조정 사용 시)

글자/화면 크기 조정 기능을 쓰는 사이트에 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 화면 크기 조정 옵션이 5개 이내인가요?

□ 각 단계가 체감되는 크기 차이를 갖나요(미세한 차이 남발 아님)?

□ 적은 단계로도 필요한 크기 범위를 커버하나요?

❓ FAQ

Q1. 단계가 많으면 더 세밀하게 조정되지 않나요? 세밀해 보이지만 선택 부담이 커지고 인접 단계 차이가 미미해 무의미합니다. 5개 이내의 체감되는 단계가 낫죠. Q2. 5개로 충분한 크기 범위가 되나요? 단계는 적되 최소~최대 차이를 충분히 두면 됩니다. 단계 수와 범위는 별개죠. Q3. 더 세밀한 조정이 필요하면요? 브라우저 기본 확대(Ctrl++)를 안내할 수 있습니다. 사이트 단계는 간단히 5개 이내로요.

6. 마무리

CP-428의 메시지:

크기 단계는 5개까지만 — 옵션을 5개 이내로 제한하라.

옵션이 너무 많으면 선택·인지 부담이 커집니다. 5개 이내의 의미 있는 단계로 제한하되 충분한 크기 범위를 커버하는 게 핵심이죠. 다음 편은 반응형 레이아웃 고려 값입니다.

다음 편 예고 ▶ 「549. (CP-429) 반응형 레이아웃 사용을 고려하여 사용값을 제공하고 있다.」

ViewCheck는 화면 크기 조정 옵션이 5개 이내인지를 진단합니다.

📚 참고 출처

KRDS 컴포넌트 — 화면 크기 조정(Resize) 가이드 — https://www.krds.go.kr/html/site/component/component_43.html

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

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