막히기 전에 미리 도와주기

KRDS BP-017 — [공통] 사용자가 문제에 직면하기 전에 필요한 도움을 받을 수 있도록 도움말을 적절히 제공하고 있다.

0. 들어가며 — 도움 패턴의 시작

이번 583편부터 BP 둘째 그룹 도움(Help) 패턴입니다(14개). 첫 규칙은 사용자가 문제에 직면하기 전에 도움말을 적절히 제공하라는 규칙입니다.

도움말은 — 사용자가 이미 막힌 뒤가 아니라, 막히기 전에 미리 제공돼야 효과적이죠. 입력 형식·주의사항을 미리 알려주면 오류 자체가 안 생깁니다. BP-017은 사전 도움말을 규정합니다. 오류 예방의 핵심 원칙이죠. 이번 편을 풀어 냅니다.

1. 원문 — 문제 직면 전 도움말 제공

BP-017 (기본 패턴 > 도움 [공통]) “[공통] 사용자가 문제에 직면하기 전에 필요한 도움을 받을 수 있도록 도움말을 적절히 제공하고 있다.”

사용자가 오류·막힘을 만나기 전에 미리 필요한 도움말을 적절히 제공하라는 뜻입니다.

정리: 막히기 전에 미리 도움말을 제공하라. 이게 BP-017입니다.

2. 왜 사전 도움말인가

도움말은 제공 시점이 중요합니다. 사용자가 이미 오류를 만나거나 막힌 뒤에 도움말을 주는 것(사후)과, 막히기 전에 미리 주는 것(사전)은 효과가 다르죠. BP-017은 사전 도움말을 강조합니다.

사후 도움말만 있을 때의 문제:

이미 실패함 — 사용자가 — 잘못 입력해 오류를 만난 뒤에야 ‘이렇게 입력하세요’ 도움말이 뜨면, 이미 한 번 실패한 거죠. 좌절·시간 낭비가 생긴 뒤입니다. 다시 고쳐야 하고요.

반복 실패 사전 안내가 없으면 사용자가 추측으로 입력하다 여러 번 실패할 수 있죠.

이탈 — 막힘과 오류가 반복되면 — 사용자가 좌절해 서비스를 떠납니다.

그래서 BP-017은 — 문제에 직면하기 전에 도움말을 제공하라고 합니다:

입력 전 안내 입력 형식·요건·주의사항을 사용자가 입력하기 전에 미리 보여줍니다. ‘YYYY-MM-DD 형식으로’ (날짜 형식 안내 CP-386·BP-008), ‘휴대폰 번호를 입력하세요’(BP-011), ‘최대 10MB’(파일 제한 CP-408) 등. 미리 알면 처음부터 올바로 입력해 오류가 안 생기죠.

주의사항 사전 고지 — 막힐 수 있는 지점(개명 사용자 BP-006, 특정 조건)을 — 미리 안내해 대비하게 합니다.

적절한 위치·시점 — 도움말을 — 그 항목·작업의 근처에, 필요한 시점에 둡니다. 너무 일찍·많이 주면 산만하고, 너무 늦으면 사후가 되죠. ’적절히’가 핵심입니다.

오류 예방 원칙. 이는 사용성·접근성의 ‘오류 예방(Error Prevention)’ 원칙입니다(WCAG 3.3.2 레이블/설명). 오류를 사후에 고치게 하기보다, 사전에 예방하는 게 사용자에게 훨씬 친화적이죠. 도움말의 본질이 바로 ‘막히지 않게 미리 돕는’ 것입니다.

사후 도움도 함께. 사전 도움말이 우선이되 — 그래도 오류가 나면, 명확한 사후 도움(구체적 오류 메시지 CP-413)도 필요합니다. 사전(예방) + 사후(해결)가 함께 가죠. 다만 — BP-017의 강조점은 사전 예방입니다.

도움 패턴 그룹의 출발. 이 도움 그룹(BP-017~030)은 — 다양한 도움 방식(안내 영역·인라인 텍스트·툴팁·맥락적 도움말·도움 패널·코치마크 등)을 다룹니다. BP-017은 — 그 모든 도움의 시점 원칙(사전 제공)을 먼저 세우죠.

이 규칙은 도움 패턴의 ’시점 원칙’을 담당합니다 — 막히기 전에 미리 도움말을 제공해(017), 오류 자체를 예방하죠. 이후 도움 규칙들이 ’어떤 방식으로 도울지’를 다룹니다.

정리하면 — 도움말을 사후에만 주면 이미 실패·좌절한 뒤이므로, 사용자가 문제에 직면하기 전에 입력 형식·요건·주의 사항을 미리 적절히 안내해 오류를 예방해야 합니다.

3. 점검 / 개선

무엇을 점검하나

사전 안내 — 입력 형식·요건·주의사항을 입력 전에 미리 안내하는가.

막힘 지점 대비 — 막힐 수 있는 지점을 미리 고지하는가.

적절한 시점·위치 — 도움말이 너무 일찍·많지도, 늦지도 않게 적절한가.

개선 방향

입력 형식·요건·주의사항을 입력 전 안내(오류 예방). 막힘 지점 사전 고지.

그 항목·작업 근처에 적절한 시점으로. 사후 오류 메시지(CP-413)와 병행.

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

역할	책임
기획/UX	도움 시점·방식 설계
콘텐츠	사전 안내 문구 작성

기관 유형	BP-017 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 필수

도움말을 제공하는 모든 사이트가 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 입력 형식·요건·주의사항을 입력 전에 미리 안내하나요?

□ 막힐 수 있는 지점을 미리 고지하나요?

□ 도움말이 너무 일찍·많지도, 늦지도 않게 적절한가요?

❓ FAQ

Q1. 오류 메시지로 도와주면 되지 않나요? 그건 사후입니다. 이미 실패·좌절한 뒤죠. 막히기 전에 미리 안내해 오류 자체를 예방하는 게 낫습니다. Q2. 도움말을 다 미리 보여주면 산만하지 않나요? 그래서 ’적절히’입니다. 필요한 시점·위치에 핵심만요. 너무 많으면 산만하죠. Q3. 사후 도움은 필요 없나요? 사전이 우선이되, 그래도 오류 나면 명확한 사후 도움(CP-413)도 필요합니다. 함께 가죠.

6. 마무리

BP-017의 메시지:

막히기 전에 미리 도와주기 — 문제에 직면하기 전에 도움말을 적절히 제공하라.

도움말을 사후에만 주면 이미 실패·좌절한 뒤입니다. 막히기 전에 입력 형식·요건·주의사항을 미리 안내해 오류를 예방 하는 게 핵심이죠. 다음 편은 도움말의 명확·간결성입니다.

다음 편 예고 ▶ 「584. (BP-018) [공통] 도움말 콘텐츠는 명확하고 간결한 내용으로 제공하고 있다.」

ViewCheck는 도움말이 문제 직면 전에 사전 제공되는지를 진단합니다.

📚 참고 출처

KRDS 기본 패턴 — 도움 가이드 — https://www.krds.go.kr/html/site/pattern/pattern_02.html

WCAG 2.1 SC 3.3.2 Labels or Instructions — https://www.w3.org/WAI/WCAG21/Understanding/labels-or-instructions.html

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

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