한눈에 구분, 한 번에 정확히

KRDS SP-007 — 사용자가 정보를 빠르게 구분하고 정확하게 이동할 수 있는 방법을 제시하고 있다.

0. 들어가며 — 어디로 가야 할지 한눈에 안 보이면

이번 681편은 사용자가 정보를 빠르게 구분하고 정확하게 이동할 수 있는 방법을 제시하라는 규칙입니다.

메인 페이지에서 — 정보가 한눈에 구분되고, 원하는 곳으로 정확히 이동할 수 있어야 사용자가 헤매지 않죠. SP-007은 빠른 구분 + 정확한 이동 수단을 규정합니다. 내비게이션·시각 구분의 화면 적용이죠. 이번 편을 풀어냅니다.

1. 원문 — 빠른 구분 + 정확한 이동

SP-007 (서비스 패턴 > 방문) “사용자가 정보를 빠르게 구분하고 정확하게 이동할 수 있는 방법을 제시하고 있다.”

정보를 빠르게 구분하고 정확하게 이동할 방법을 제시하라는 뜻입니다.

정리: 정보를 빠르게 구분하고 정확하게 이동하는 방법을 제시하라. 이게 SP-007입니다.

2. 왜 빠른 구분·정확한 이동인가

메인 페이지에서 사용자는 두 가지를 합니다: 정보를 구분(무엇이 무엇인지 파악)하고, 원하는 곳으로 이동(클릭 해 가기)이죠. 이 둘이 빠르고 정확해야, 사용자가 원하는 걸 효율적으로 찾습니다. SP-007은 이를 요구합니다.

구분·이동이 어려울 때의 문제:

구분 안 됨 정보가 시각적으로 안 구분되면(다 비슷하게 보이면), 사용자는 무엇이 무엇인지 파악하느라 헤맵 니다. 어디로 가야 할지 모르죠.

잘못된 이동 링크·메뉴가 모호하면, 사용자가 잘못된 곳으로 갑니다. 원하는 게 아닌 데로 가, 뒤로 가기를 반복하죠.

시간 낭비·이탈 구분·이동이 비효율적이면, 사용자가 지쳐 떠납니다.

그래서 SP-007은 — 두 가지 방법을 제시하라고 합니다:

① 빠른 구분.

시각적 구분 정보·영역을 시각적으로 명확히 구분합니다. 제목·간격·구분선·카드·색 등으로요(섹션화 SP-004, 타이포 위계 BP-052·053). 사용자가 한눈에 무엇이 무엇인지 파악하게요.

명확한 레이블 메뉴·링크·섹션의 이름을 명확·일관되게요(SP-009 용어). 무엇인지 바로 알게요.

② 정확한 이동.

명확한 내비게이션 GNB·카테고리 메뉴·바로가기 등 이동 수단을 명확히 제공합니다(메인 메뉴 CP, 내비게이션). 어디로 가는 링크인지 분명하게요(링크 목적 WCAG 2.4.4).

정확한 링크 목적지 링크·버튼이 예상한 곳으로 정확히 이동하게요. 레이블과 목적지가 일치하게요. ’민원 신청’을 누르면 정말 민원 신청으로 가게요.

여러 이동 경로 메뉴 + 검색(SP 검색 그룹) + 바로가기 + 사이트맵 등 다양한 경로로요. 사용자가 자기 방식 으로 정확히 가게요.

구분 + 이동의 연결. 빠른 구분(무엇인지 파악)이 정확한 이동(거기로 가기)으로 이어집니다. 구분이 잘 되면 어디로 갈지 알고, 이동 수단이 명확하면 정확히 가죠. 둘이 함께 효율적 탐색을 만듭니다.

여러 규칙의 종합. SP-007은 — 시각 구분(SP-004 섹션화, BP 타이포)·내비게이션(메인 메뉴·브레드크럼 CP)·링크 명확성 (WCAG 2.4.4)·용어 일관성(SP-009) 등을, ’빠른 구분 + 정확한 이동’이라는 — 사용자 목표로 종합한 규칙입니다.

이 규칙은 방문(SP)의 ’탐색 효율’을 담당합니다 — 빠른 구분과 정확한 이동 방법을 제시해(007), 사용자가 원하는 정보를 효율적으로 찾아가게 하죠.

정리하면 — 정보가 안 구분되고 이동이 부정확하면 사용자가 헤매므로, 시각적 구분(섹션·위계·레이블)과 정확한 이동 수단 (명확한 내비게이션·링크 목적지·다중 경로)을 제시해야 합니다.

3. 점검 / 개선

무엇을 점검하나

빠른 구분 — 정보·영역이 시각적으로 명확히 구분되고 레이블이 명확한가.

정확한 이동 — 내비게이션·링크가 명확하고 목적지가 일치하는가.

다중 경로 — 메뉴 + 검색 + 바로가기 등 여러 이동 경로가 있는가.

개선 방향

시각 구분(섹션·위계·구분선) + 명확한 레이블(SP-004·009).

명확한 내비게이션·링크 목적지 일치(WCAG 2.4.4). 다중 경로.

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

역할	책임
기획/IA	정보 구분·이동 경로 설계
디자이너/퍼블리셔	시각 구분·내비게이션 구현

기관 유형	SP-007 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 권장 (방문·메인 페이지)

메인 페이지를 운영하는 모든 사이트가 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 정보·영역이 시각적으로 명확히 구분되고 레이블이 명확한가요?

□ 내비게이션·링크가 명확하고 목적지가 일치하나요?

□ 메뉴 + 검색 + 바로가기 등 여러 이동 경로가 있나요?

❓ FAQ

Q1. 빠른 구분을 어떻게 돕나요? 정보·영역을 제목·간격·구분선·카드·색으로 시각 구분하고(SP-004, BP-052·053), 메뉴·링크 이름을 명확·일관되게(SP-009) 합니다. 한눈에 파악하게요. Q2. 정확한 이동이 뭔가요? 링크·메뉴가 예상한 곳으로 정확히 가는 것입니다. 레이블과 목적지가 일치하게요. ’민원 신청’을 누르면 정말 거기로 가게(WCAG 2.4.4)요. Q3. 이동 경로가 하나면 안 되나요? 여러 경로가 좋습니다. 메뉴 + 검색 + 바로가기 + 사이트맵 등으로 사용자가 자기 방식으로 정확히 가게요.

6. 마무리

SP-007의 메시지:

한눈에 구분, 한 번에 정확히 — 빠른 구분과 정확한 이동 방법을 제시하라.

정보가 안 구분되고 이동이 부정확하면 사용자가 헤맵니다. 시각 구분과 정확한 이동 수단으로 효율적으로 찾아가게 하는 게 핵심이죠. 다음 편은 최신·정확한 정보 제공입니다.

다음 편 예고 ▶ 「682. (SP-008) 최신의 정확한 정보를 제공하고 있다.」

ViewCheck는 정보의 빠른 구분과 정확한 이동 방법이 제시되는지를 진단합니다.

📚 참고 출처

KRDS 서비스 패턴 — 방문 가이드 — https://www.krds.go.kr/html/site/service/service_01.html

WCAG 2.1 SC 2.4.4 Link Purpose — https://www.w3.org/WAI/WCAG21/Understanding/link-purpose-in-context.html

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

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