로그인됐음을 분명히

KRDS SP-088 — 로그인 상태로 전환되었음을 명확하게 표현하고 있다.

0. 들어가며 — 로그인이 됐는지 안 됐는지 모르면

이번 762편은 로그인 상태로 전환되었음을 명확하게 표현하라는 규칙입니다.

로그인을 했는데 — 정말 됐는지 화면에서 안 보이면, 사용자는 불안하죠. SP-088은 로그인 상태 전환을 명확히 표현하라고 규정합니다. 상태 피드백의 핵심이죠. 이번 편을 풀어냅니다.

1. 원문 — 로그인 상태 전환 명확 표현

SP-088 (서비스 패턴 > 로그인 > 로그인 완료) “로그인 상태로 전환되었음을 명확하게 표현하고 있다.”

로그인 상태로 전환되었음을 명확히 표현하라는 뜻입니다.

정리: 로그인 상태 전환을 명확히 표현하라. 이게 SP-088입니다.

2. 왜 상태 전환 표현인가

로그인을 완료하면, 사용자는 ’내가 로그인됐나?’를 확인하고 싶어 합니다. 그런데 화면에 로그인 상태가 명확히 안 보이면, 불안하죠. SP-088은 상태 전환의 명확한 표현을 요구합니다.

상태 전환이 불명확할 때의 문제:

로그인 여부 모름 로그인을 했는데, 화면이 그대로거나 비로그인 때와 똑같으면, 사용자는 정말 로그인됐는지 모릅니다. 불안하죠.

중복 로그인 시도 됐는지 모르면, 다시 로그인을 시도하거나 헤맵니다.

그래서 SP-088은 — 명확한 표현을 요구합니다:

헤더 상태 변화 로그인 후, 헤더의 로그인 영역(SP-059)이 변합니다. ‘로그인’ → 사용자 이름·‘마이페이지’· ‘로그아웃’으로요. 사용자가 —’○○님, 환영합니다’·자기 이름을 보고 로그인됐음을 알죠.

환영 메시지·개인화 로그인 후, 환영 메시지나 개인화 영역(SP-006)을 보여줍니다. ‘○○님’·자기 정보가 보이면, 로그인이 확실하죠.

완료 피드백 로그인 직후, ‘로그인되었습니다’ 같은 피드백(토스트·메시지)을 줄 수도요. 명확한 전환 신호죠.

상태 일관 표시 로그인 상태를, 모든 화면에서 일관되게 표시합니다(헤더 SP-059). 어느 화면에서든 로그인 됨을 알게요.

접근성(SP-088·089). 로그인 상태 전환을, 스크린 리더 사용자도 알아야 합니다. 시각적 헤더 변화만으론, 스크린 리더가 자동 인지 못 할 수 있죠. 완료 메시지를 aria-live로, 또는 로그인 후 초점 관리(SP-089)로 상태를 전달 합니다.

상태 가시성의 원칙. ’시스템 상태의 가시성’은, UX의 기본 원칙(닐슨 휴리스틱 #1)입니다. 사용자가 지금 어떤 상태(로그인됨/안 됨)인지 항상 알 수 있어야 하죠. 로그인 상태도 그 하나입니다.

이 규칙은 로그인(SP)의 ’로그인 상태 피드백’을 담당합니다 — 로그인 상태 전환을 명확히 표현해(088), 사용자가 로그인 됐음을 분명히 알고 안심하게 하죠. SP-087(화면 이동)·SP-089(초점)과 함께 갑니다.

정리하면 — 로그인 후 상태가 명확히 안 보이면 됐는지 몰라 불안하므로, 헤더 변화(사용자 이름·로그아웃)·환영 메시지·개인화 ·완료 피드백으로 로그인 상태 전환을 (접근성 포함) 명확히 표현해야 합니다.

3. 점검 / 개선

무엇을 점검하나

헤더 변화 — 로그인 후 헤더가 사용자 이름·’로그아웃’으로 변하는가.

환영·완료 피드백 — 환영 메시지·개인화·완료 피드백이 있는가.

접근성 — 상태 전환이 스크린 리더에 전달되는가(aria-live·초점 SP-089).

개선 방향

로그인 후 헤더 변화(이름·로그아웃)·환영 메시지·개인화(SP-006).

완료 피드백(토스트). 스크린 리더 전달(aria-live·SP-089). 일관 표시.

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

역할	책임
디자이너/기획	상태 표현 설계
개발	상태 전환·피드백 구현

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

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

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 로그인 후 헤더가 사용자 이름·’로그아웃’으로 변하나요?

□ 환영 메시지·개인화·완료 피드백이 있나요?

□ 상태 전환이 스크린 리더에 전달되나요(aria-live·초점 SP-089)?

❓ FAQ

Q1. 로그인 상태가 안 보이면 왜 문제인가요? 로그인을 했는데 화면이 그대로면 정말 됐는지 모릅니다. 불안하고, 다시 로그인을 시도하거나 헤매죠. 상태를 명확히 표현해야 합니다. Q2. 어떻게 표현하나요? 헤더가 ‘로그인’→사용자 이름·‘로그아웃’으로 변하고, 환영 메시지·개인화 영역(SP-006)을 보여 줍니다. ’로그인되었습니다’ 피드백도 좋고요. Q3. 스크린 리더에도 알리나요? 네. 시각적 헤더 변화만으론 스크린 리더가 자동 인지 못 할 수 있습니다. 완료 메시지를 aria-live로, 또는 로그인 후 초점 관리(SP-089)로 상태를 전달하죠.

6. 마무리

SP-088의 메시지:

로그인됐음을 분명히 — 로그인 상태 전환을 명확하게 표현하라.

로그인 후 상태가 안 보이면 됐는지 몰라 불안합니다. 헤더 변화·환영 메시지·완료 피드백으로 로그인 상태를 명확히 표현해 안심하게 하는 게 핵심이죠. 다음 편은 로그인 후 초점 문서 처음부터입니다.

다음 편 예고 ▶ 「763. (SP-089) 로그인 완료 후 화면이 로딩되었을 때 키보드 및 스크린 리더 초점은 문서 가장 처음부터 접근하도록 구현되어 있다.」

ViewCheck는 로그인 상태 전환이 명확히 표현되는지를 진단합니다.

📚 참고 출처

KRDS 서비스 패턴 — 로그인 가이드 — https://www.krds.go.kr/html/site/service/service_03.html

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

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