꼭 필요한 건 본문에

KRDS CP-340 — 사용자가 작업을 수행하기 위해 반드시 알아야 하는 필수 정보가 패널에서만 제공되지 않게 하고 있다.

0. 들어가며 — 도움말을 안 열면 못 하는 작업

이번 460편은 작업 수행에 반드시 알아야 하는 필수 정보가 패널에서만 제공되지 않게 하라는 규칙입니다.

도움 패널은 — 어디까지나 보조 도움입니다(닫을 수도 있죠, CP-335). 그런데 — 작업에 꼭 필요한 정보를 패널에만 두면, 패널을 닫거나 못 본 사용자는 작업을 못 하죠. CP-340은 필수 정보를 패널에만 두지 말라고 규정합니다. 도움 패널 규칙 중 가장 중요한 원칙이죠. 이번 편을 풀어냅니다.

1. 원문 — 필수 정보 패널 단독 제공 금지

CP-340 (컴포넌트 > 도움 패널) “사용자가 작업을 수행하기 위해 반드시 알아야 하는 필수 정보가 패널에서만 제공되지 않게 하고 있다.”

작업 완료에 꼭 필요한 필수 정보를, 도움 패널에만 두지 말고 본문 등에서도 제공하라는 뜻입니다.

정리: 필수 정보를 도움 패널에만 두지 마라. 이게 CP-340입니다.

2. 왜 필수 정보를 패널에만 두지 않나

도움 패널은 보조 도움 영역입니다. 사용자가 닫을 수 있고(CP-335), 모바일에선 축약되며(CP-343), 아예 안 열어볼 수도 있죠. 즉 패널의 정보는 ’모든 사용자가 반드시 본다’고 보장할 수 없습니다. 그래서 작업에 반드시 필요한 필수 정보를 패널에만 두면 문제가 생깁니다.

필수 정보가 패널에만 있을 때:

패널 닫은 사용자 — 패널을 닫거나 접은 사용자는 — 그 필수 정보를 못 봅니다. 작업을 어떻게 해야 할지 몰라 막히거나, 잘못 입력하죠.

패널 못 본 사용자 — 패널이 있는 줄 모르거나, 모바일에서 축약돼(CP-343) 안 연 사용자도 — 필수 정보를 놓칩니다.

접근성 격차 — 스크린 리더 사용자가 패널을 못 찾거나, 패널 접근에 어려움이 있으면 — 필수 정보에서 배제 되죠.

예를 들어 — ’비밀번호는 영문·숫자·특수문자 포함 8자 이상’이라는 필수 입력 규칙을 도움 패널에만 두면, 패널을 안 본 사용자는 규칙을 모르고 계속 실패합니다. 이건 — 작업 수행에 반드시 필요한 정보라, 패널에만 두면 안 되죠.

그래서 CP-340은 — 필수 정보를 패널에만 두지 말라고 합니다:

본문에 필수 정보 제공 — 작업에 꼭 필요한 정보(입력 규칙·형식·필수 조건·오류 해결법)는 — 본문(입력 필드 옆 안내, 플레이스홀더, 인라인 도움말, 오류 메시지 등)에서도 제공합니다. 패널을 안 봐도 작업할 수 있게요.

패널은 보조·심화 — 도움 패널에는 — 부가 설명, 심화 안내, 예시, 배경 정보 등 있으면 좋은 보조 정보를 둡니다. 없어도 작업은 되는 것들이죠.

필수 vs 보조 구분. 핵심은 — 정보를 ’필수’와 ’보조’로 나누는 것입니다:

필수(본문) — 작업 완료에 반드시 필요. 입력 형식·규칙·필수 조건·오류 해결. → 본문에 제공.

보조(패널 가능) — 있으면 좋지만 없어도 작업 가능. 부가 설명·예시·배경. → 패널에 둬도 됨.

CP-339와의 균형. CP-339(간결한 도움말)와 CP-340(필수는 본문)은 함께 갑니다 — 패널을 간결히 하되(339), 그 간결함이 필수 정보를 빼서 되는 게 아니라, 필수는 본문에 두고 패널엔 보조만 간결히 두는 거죠(340). 즉 정보 배치 (필수=본문, 보조=패널)가 먼저고, 그 위에 간결성을 적용합니다.

이 규칙은 도움 패널의 ’정보 안전성’을 담당합니다 — 필수 정보를 본문에 둬(340), 패널을 안 봐도 모든 사용자가 작업을 완료하게 하죠. 도움 패널을 ’없어도 되는 보조’로 설계하는 핵심 원칙입니다.

정리하면 — 도움 패널은 닫거나 안 볼 수 있는 보조 영역이므로, 작업에 반드시 필요한 필수 정보는 본문에서도 제공하고 패널에는 보조·심화 정보만 두어야 합니다.

3. 점검 / 개선

무엇을 점검하나

필수 본문 제공 — 작업 필수 정보(규칙·형식·조건)가 본문에도 있는가.

패널 단독 배제 — 필수 정보가 패널에만 있지 않은가.

필수/보조 구분 — 정보를 필수(본문)·보조(패널)로 적절히 나눴는가.

개선 방향

입력 규칙·형식·필수 조건·오류 해결을 본문(인라인 안내·오류 메시지)에 제공.

패널엔 보조·심화·예시만. 필수/보조 구분해 배치.

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

역할	책임
기획/UX	필수/보조 정보 구분·배치 정책
콘텐츠	본문 필수 안내·패널 보조 작성
퍼블리셔/개발	본문 인라인 안내 구현

기관 유형	CP-340 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 필수 (도움 패널 사용 시)

도움 패널을 쓰는 사이트에 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 작업 필수 정보(규칙·형식·조건)가 본문에도 있나요?

□ 필수 정보가 패널에만 있지 않나요?

□ 정보를 필수(본문)·보조(패널)로 적절히 나눴나요?

❓ FAQ

Q1. 왜 필수 정보를 패널에만 두면 안 되나요? 패널은 닫거나 안 볼 수 있는 보조 영역입니다. 필수 정보를 거기만 두면 안 본 사용자가 작업을 못 하죠. Q2. 필수와 보조를 어떻게 나누나요? 필수는 작업 완료에 반드시 필요(입력 규칙·형식). 보조는 있으면 좋은 것 (예시·배경). 필수는 본문, 보조는 패널이죠. Q3. CP-339(간결)와 충돌하지 않나요? 아닙니다. 패널은 보조만 간결히 두고, 필수는 본문에 둡니다. 정보 배치 후 간결성을 적용하죠.

6. 마무리

CP-340의 메시지:

꼭 필요한 건 본문에 — 필수 정보를 도움 패널에만 두지 마라.

도움 패널은 닫거나 안 볼 수 있는 보조 영역입니다. 작업 필수 정보는 본문에 두어 패널을 안 봐도 작업을 완료하게 하고, 패널엔 보조·심화만 두는 게 핵심이죠. 다음 편은 패널 링크의 새 창 실행입니다.

다음 편 예고 ▶ 「461. (CP-341) 패널에서 제공하는 웹 페이지 링크는 새 창으로 실행하고 있다.」

ViewCheck는 필수 정보가 패널에만 제공되지 않는지를 진단합니다.

📚 참고 출처

KRDS 컴포넌트 — 도움 패널(Help panel) 가이드 — https://www.krds.go.kr/html/site/component/component_33.html

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

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