안내는 하나로 모아서

KRDS BP-024 — [안내 영역] 한 화면에서 여러 개의 안내 영역을 사용하고 있지 않다.

0. 들어가며 — 안내 박스가 여기저기 있으면

이번 590편은 한 화면에서 여러 개의 안내 영역을 사용하지 않게 하라는 규칙입니다.

안내 영역이 — 한 화면에 여러 개 흩어져 있으면, 무엇이 중요한지 흐려지고 산만하죠. BP-024는 안내 영역을 하나로 모으라고 규정합니다. BP-023(안내 영역 상단)의 짝이자, 안내의 집중·절제 규칙이죠. 이번 편을 풀어냅니다.

1. 원문 — 여러 안내 영역 미사용

BP-024 (기본 패턴 > 도움 [안내 영역]) “[안내 영역] 한 화면에서 여러 개의 안내 영역을 사용하고 있지 않다.”

한 화면에 안내 영역을 여러 개 두지 말고, 하나로 통합해 사용하라는 뜻입니다.

정리: 한 화면에 안내 영역은 하나만. 이게 BP-024입니다.

2. 왜 안내 영역 하나만인가

BP-023에서 — 안내 영역은 화면 전체에 필요한 포괄 정보를 본문 상단에 두는 것이라고 했죠. BP-024는 — 그 안내 영역을 한 화면에 여러 개 두지 말라고 합니다.

여러 안내 영역의 문제:

중요도 희석 안내 영역이 한 화면에 2개, 3개씩 있으면, 사용자는 ‘어느 게 진짜 중요한 거지?’ 헷갈립니다. 여러 안내가 서로 주목을 다투면, 각각이 묻혀 어느 것도 제대로 안 읽히죠. ’모두 강조하면 아무것도 강조 안 된다’는 원리입니다(태그 개수 절제 CP-306, 스피너 1개 CP-332 정신).

산만함 — 화면 곳곳에 안내 박스가 흩어져 있으면 — 시각적으로 산만하고, 정작 봐야 할 본문이 안내들에 밀리거나 가려집니다.

혼란 — 여러 안내가 — 서로 관련 없거나 심지어 충돌하는 내용이면, 사용자가 혼란스럽죠.

그래서 BP-024는 — 안내 영역을 하나로 통합하라고 합니다:

하나의 안내 영역 화면 전체에 필요한 포괄 안내를 하나의 안내 영역에 모읍니다. 여러 안내할 내용이 있으면 그 하나의 영역 안에서 정리(목록·구분)하죠. 영역을 여러 개로 쪼개지 않습니다.

본문 상단 하나(BP-023) 그 하나의 안내 영역을 본문 상단에 둡니다. 사용자가 한 곳에서 모든 전체 안내를 보게요.

우선순위 정리 안내할 게 많으면 정말 중요한 것 위주로 정리하고, 덜 중요한 건 개별 도움(인라인 BP-026, 툴팁)으로 분산하거나 줄입니다. 안내 영역엔 핵심 포괄 안내만요.

왜 집중이 중요한가. 안내 영역의 목적은 전체에 필요한 핵심 정보를 사용자가 놓치지 않고 보게 하는 것입니다. 여러 개로 흩어지면 그 목적이 깨지죠. 하나로 모아 사용자가 ’여기 전체 안내가 있다’를 한 곳에서 확인하게 하는 게, 안내의 효과를 살립니다.

개별 도움과의 구분. 안내 영역(전체 포괄, 하나)과 개별 항목 도움(인라인 텍스트 BP-026, 툴팁 BP-027, 맥락적 도움말 BP-028)은 다릅니다. 개별 도움은 각 항목 옆에 여러 개 있을 수 있죠(각 필드의 형식 안내 등). BP-024가 ’하나’로 제한하는 건 전체 차원의 안내 영역입니다. 개별 항목 도움까지 하나로 하라는 게 아니죠.

이 규칙은 도움 패턴의 ’안내 집중’을 담당합니다 — 안내 영역을 하나로 모아(024), 전체 안내가 묻히거나 산만해지지 않고 사용자가 한 곳에서 핵심을 보게 하죠. BP-023(상단 배치)과 함께 — 효과적인 전체 안내를 만듭니다.

정리하면 — 안내 영역이 여러 개면 중요도가 희석되고 산만하므로, 화면 전체 안내를 하나의 안내 영역에 통합해 사용 자가 한 곳에서 핵심을 보게 해야 합니다.

3. 점검 / 개선

무엇을 점검하나

하나만 — 한 화면에 전체 안내 영역이 하나인가(여러 개 아님).

통합 — 여러 안내 내용이 하나의 영역에 정리됐는가.

개별 도움 구분 — 개별 항목 도움(인라인·툴팁)은 안내 영역과 구분되는가.

개선 방향

여러 안내 영역을 하나로 통합(상단). 내부에서 목록·구분으로 정리.

핵심 포괄 안내만. 덜 중요한 건 개별 도움으로 분산. 전체 안내 영역은 하나.

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

역할	책임
콘텐츠/UX	안내 통합·우선순위 정리
퍼블리셔/개발	안내 영역 단일화 구현

기관 유형	BP-024 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 조건부 (안내 영역 사용 시)

화면 전체 안내가 필요한 사이트에 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 한 화면에 전체 안내 영역이 하나인가요(여러 개 아님)?

□ 여러 안내 내용이 하나의 영역에 정리됐나요?

□ 개별 항목 도움(인라인·툴팁)은 안내 영역과 구분되나요?

❓ FAQ

Q1. 안내할 게 많으면 여러 개 둬야 하지 않나요? 하나의 영역 안에서 목록·구분으로 정리합니다. 영역을 여러 개로 쪼개면 중요도가 희석되고 산만하죠. Q2. 개별 필드 도움도 하나로 하나요? 아닙니다. BP-024가 제한하는 건 전체 차원의 안내 영역입니다. 개별 항목 도움(인라인·툴팁)은 각 항목에 여러 개 있을 수 있죠. Q3. 왜 하나로 모으나요? 여러 개면 무엇이 중요한지 흐려지고 묻힙니다. 하나로 모아 한 곳에서 핵심을 보게 하는 게 효과적이죠.

6. 마무리

BP-024의 메시지:

안내는 하나로 모아서 — 한 화면에 안내 영역은 하나만.

안내 영역이 여러 개면 중요도가 희석되고 산만합니다. 화면 전체 안내를 하나로 통합해 사용자가 한 곳에서 핵심을 보게 하는 게 핵심이죠. 다음 편은 플레이스홀더입니다.

다음 편 예고 ▶ 「591. (BP-025) [플레이스홀더] 레이블이나 도움말의 대체 수단으로 사용하지 않고 있다.」

ViewCheck는 한 화면에 안내 영역이 하나만 사용되는지를 진단합니다.

📚 참고 출처

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

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

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