어떻게 입력하는지 바로 알게

KRDS SP-073 — 로그인 방식과 입력 항목에 대한 직관적인 안내를 제공하고 있다.

0. 들어가며 — 로그인 화면에서 뭘 입력할지 막막하면

이번 747편은 로그인 방식과 입력 항목에 대한 직관적인 안내를 제공하라는 규칙입니다.

로그인 방식을 골랐는데 — 무엇을·어떻게 입력하는지 안내가 없으면 사용자는 막막하죠. SP-073은 방식·입력 항목의 직관적 안내를 규정합니다. 입력 안내(BP-074)의 로그인 적용이죠. 이번 편을 풀어냅니다.

1. 원문 — 방식·입력 항목 직관 안내

SP-073 (서비스 패턴 > 로그인 > 로그인 방식 확인/선택) “로그인 방식과 입력 항목에 대한 직관적인 안내를 제공하고 있다.”

로그인 방식·입력 항목에 직관적인 안내를 제공하라는 뜻입니다.

정리: 로그인 방식·입력 항목을 직관적으로 안내하라. 이게 SP-073입니다.

2. 왜 직관 안내인가

로그인 방식을 골라 입력 화면에 가면, 무엇을(아이디·비밀번호·인증번호 등) 어떻게 입력하는지가 명확해야 합니다. 안내가 부족하면 사용자가 막막하죠. SP-073은 직관적 안내를 요구합니다.

안내가 부족할 때의 문제:

입력 막막 로그인 화면에, 입력 항목만 덩그러니 있고 안내가 없으면, 사용자는 무엇을 어떻게 넣어야 할지 모릅니다. 특히 익숙하지 않은 인증 방식이면요.

오류·중도 포기 안내 없이 추측으로 입력하다 오류가 나거나, 막혀 포기하죠.

그래서 SP-073은 — 직관적 안내를 요구합니다:

입력 항목 레이블 각 입력 항목에, 명확한 레이블을요(‘아이디’, ‘비밀번호’, ‘인증번호’). 무엇을 넣는 칸 인지 알게요(BP-074, SP-076). 플레이스홀더가 아니라 진짜 레이블로요(SP-076).

방식별 안내 그 로그인 방식의 진행을, 직관적으로 안내합니다. 예: ‘휴대폰으로 전송된 인증번호를 입력하세요’, ’인증서 비밀번호를 입력하세요’처럼요. 사용자가 지금 무엇을 해야 할지 알게요.

형식·단서 입력 형식·단서를요(‘6자리 인증번호’ 등). 단, 중요 단서는 플레이스홀더가 아닌 레이블·도움말로 (SP-021·076).

시각적 직관성 아이콘·예시·단계 표시 등으로, 직관적으로요. 복잡한 인증 과정은, 단계별로 명확히 안내 (단계 표시기 CP)하면 좋죠.

BP-074(레이블·설명·단위)의 로그인 적용. BP-074(입력 필드 레이블·설명·단위 제공)를, 로그인 입력에 적용한 게 SP-073입니다. 로그인도 입력 폼이므로, 입력 안내 원칙이 같죠. 거기에 로그인 방식별 진행 안내를 더한 거고요.

인증의 직관성. 공공 인증은, 절차가 복잡하고 낯섭니다(SP-067·072). 그래서 각 단계에서 ’무엇을 입력·해야 하는지’를 직관적으로 안내하는 게 중요하죠. 안내가 명확하면, 낯선 인증도 따라 하게요.

이 규칙은 로그인(SP)의 ’입력 안내’를 담당합니다 — 로그인 방식·입력 항목을 직관적으로 안내해(073), 사용자가 무엇을·어떻 게 입력하는지 알고 막힘없이 로그인하게 하죠. SP-074(도움말)·SP-076(레이블)과 함께 갑니다.

정리하면 — 로그인 입력 화면에 안내가 부족하면 무엇을 어떻게 넣을지 막막하므로, 입력 항목 레이블·방식별 진행 안내·형식 단서를 직관적으로 제공해야 합니다.

3. 점검 / 개선

무엇을 점검하나

입력 레이블 — 각 입력 항목에 명확한 레이블이 있는가(BP-074, SP-076).

방식별 안내 — 그 방식의 진행을 직관적으로 안내하는가(‘인증번호 입력’ 등).

형식·시각 직관 — 형식 단서·아이콘·단계 표시로 직관적인가.

개선 방향

입력 항목 레이블(진짜 레이블, SP-076) + 방식별 진행 안내.

형식 단서(도움말). 복잡한 인증은 단계별 명확히. 시각적 직관성.

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

역할	책임
UX 라이터/기획	입력·방식 안내 문구
퍼블리셔/개발	레이블·안내 구현

기관 유형	SP-073 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 권장 (로그인 제공 시)

로그인 기능을 제공하는 모든 사이트가 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 각 입력 항목에 명확한 레이블이 있나요(BP-074, SP-076)?

□ 그 방식의 진행을 직관적으로 안내하나요(‘인증번호 입력’ 등)?

□ 형식 단서·아이콘·단계 표시로 직관적인가요?

❓ FAQ

Q1. 안내가 부족하면 왜 문제인가요? 입력 항목만 있고 안내가 없으면 무엇을 어떻게 넣을지 막막합니다. 특히 낯선 인증 방식이면요. 추측으로 입력하다 오류가 나거나 포기하죠. Q2. 무엇을 안내하나요? 입력 항목 레이블(‘인증번호’), 방식별 진행(‘휴대폰으로 전송된 인증번호를 입력하세요’), 형식 단서(‘6자리’)요. 사용자가 지금 무엇을 해야 할지 알게요. Q3. BP-074와 같나요? BP-074(입력 필드 레이블·설명·단위)를 로그인 입력에 적용한 것입니다. 로그인도 입력 폼이라 같은 원칙이고, 거기에 방식별 진행 안내를 더한 거죠.

6. 마무리

SP-073의 메시지:

어떻게 입력하는지 바로 알게 — 로그인 방식·입력 항목을 직관적으로 안내하라.

안내가 부족하면 무엇을 어떻게 넣을지 막막합니다. 입력 항목 레이블·방식별 진행 안내·형식 단서를 직관적으로 제공해 막힘 없이 로그인하게 하는 게 핵심이죠. 다음 편은 로그인 도움말·매뉴얼 링크입니다.

다음 편 예고 ▶ 「748. (SP-074) 로그인에 대한 도움을 받을 수 있는 도움말 정보, 매뉴얼 링크를 제공한다.」

ViewCheck는 로그인 방식·입력 항목이 직관적으로 안내되는지를 진단합니다.

📚 참고 출처

KRDS 서비스 패턴 — 로그인 가이드 — https://www.krds.go.kr/html/site/service/service_03.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컴포넌트,웹표준