지금 몇 단계인지 들리게

KRDS SP-139 — 현재 단계를 스크린 리더로 확인할 수 있도록 제공하고 있다.

0. 들어가며 — 다단계 신청서에서 지금 어디인지 안 들리면

이번 813편은 현재 단계를 스크린 리더로 확인할 수 있도록 제공하라는 규칙입니다.

다단계 신청서(BP-068·SP-117)에서 — 지금 몇 단계인지, 시각 사용자는 단계 표시기로 보지만 스크린 리더 사용자는 안 들리면 길을 잃죠. SP-139는 현재 단계의 스크린 리더 확인을 규정합니다. 단계 표시기 접근성이죠. 이번 편을 풀어냅니다.

1. 원문 — 현재 단계 스크린 리더 확인

SP-139 (서비스 패턴 > 신청 > 신청서 작성) “현재 단계를 스크린 리더로 확인할 수 있도록 제공하고 있다.”

현재 단계를 스크린 리더로 확인할 수 있게 제공하라는 뜻입니다.

정리: 현재 단계를 스크린 리더로 확인하게 제공하라. 이게 SP-139입니다.

2. 왜 현재 단계 스크린 리더인가

신청서가 다단계(BP-068·SP-117)면, 단계 진행률(BP-069)을 표시합니다. 시각 사용자는, 단계 표시기(‘1.개인 정보 > 2.신청내용 > 3.확인’ 중 현재 강조)를 보고 지금 어디인지 알죠. 그런데 스크린 리더 사용자는, 이를 들을 수 있어야 합니다. SP-139는 현재 단계의 스크린 리더 확인을 요구합니다.

현재 단계가 안 들릴 때의 문제:

위치 모름 다단계 신청서에서, 스크린 리더 사용자가 지금 몇 단계인지, 전체 몇 단계 중 어디 인지를 모르면, 길을 잃습니다. ‘얼마나 남았지?’, ‘여기가 어디지?’ 모르죠.

진행 파악 불가 단계 표시기가 시각적으로만 강조되면(색·굵게), 스크린 리더는 그 강조를 못 읽어 현재 단계를 모릅니다.

그래서 SP-139는 — 스크린 리더 확인을 요구합니다:

현재 단계 알림 현재 단계를, 스크린 리더가 읽게요. 단계 표시기의 현재 단계에 aria-current="step" 을 주면, 스크린 리더가 ’현재 단계’로 인지하죠. 또는 ’2단계 신청내용 (현재)’처럼 텍스트로요.

전체 중 위치 전체 단계 수와 현재 위치를요. ’3단계 중 2단계’처럼요. 스크린 리더 사용자가 진행을 파악하게요(진행률 BP-069의 스크린 리더 버전).

단계 전환 안내 다음 단계로 넘어가면, 그 변화를 스크린 리더에 알립니다(aria-live·초점 관리 SP-089 정신). 새 단계 제목을 읽게요.

단계 표시기 시맨틱 단계 표시기를, 시맨틱·ARIA로 구조화합니다(단계표시기 컴포넌트 CP-307~315 접근성). 목록·aria-current 등으로요.

단계 표시기(BP-069·CP-307~315) 접근성. 단계 진행률(BP-069)·단계표시기 컴포넌트(CP-307~315)의 접근성을, 신청서에 적용한 게 SP-139입니다. 시각 표시(강조)뿐 아니라, 스크린 리더 인지(aria-current·텍스트)를요. 시각· 청각 양쪽으로 현재 단계를요.

다단계 폼 접근성. 다단계 신청서는, 시각 사용자에겐 단계가 보이지만, 스크린 리더 사용자에겐 들려야 합니다. 현재 단계(SP-139) + 섹션 구조(SP-140 헤딩) + 초점 관리(SP-089 정신)가 함께, 스크린 리더 사용자 도 다단계 신청서를 끝까지 따라가게 하죠.

이 규칙은 신청(SP)의 ’단계 접근성’을 담당합니다 — 현재 단계를 스크린 리더로 확인하게 해(139), 스크린 리더 사용자도 다단계 신청서에서 위치를 알고 진행하게 하죠. SP-140(섹션 헤딩)과 함께 갑니다.

정리하면 — 다단계 신청서에서 현재 단계가 스크린 리더에 안 들리면 위치를 모르고 길을 잃으므로, aria-current·텍스트로 현재 단계·전체 중 위치를 스크린 리더가 확인하게 해야 합니다.

3. 점검 / 개선

무엇을 점검하나

현재 단계 알림 — 현재 단계가 스크린 리더에 전달되는가(aria-current·텍스트).

전체 중 위치 — 전체 단계 수·현재 위치(‘3단계 중 2단계’)가 들리는가.

단계 전환 안내 — 단계 전환 시 변화가 스크린 리더에 알려지는가.

개선 방향

단계 표시기 현재 단계에 aria-current="step"·텍스트. 전체 중 위치 안내.

단계 전환 시 aria-live·초점(SP-089). 단계 표시기 시맨틱(CP-307~315).

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

역할	책임
퍼블리셔/개발	단계 표시기 접근성 구현
QA/접근성	현재 단계 스크린 리더 검증

기관 유형	SP-139 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 필수 (다단계 신청서·웹접근성 의무)

웹접근성 의무 대상이며 다단계 신청서를 쓰는 사이트가 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 현재 단계가 스크린 리더에 전달되나요(aria-current·텍스트)?

□ 전체 단계 수·현재 위치(‘3단계 중 2단계’)가 들리나요?

□ 단계 전환 시 변화가 스크린 리더에 알려지나요?

❓ FAQ

Q1. 현재 단계가 안 들리면 왜 문제인가요? 다단계 신청서에서 스크린 리더 사용자가 지금 몇 단계인지, 전체 중 어디인지 모르면 길을 잃습니다. ‘얼마나 남았지?’, ‘여기가 어디지?’ 모르죠. Q2. 어떻게 전달하나요? 단계 표시기 현재 단계에 aria-current="step"을 주면 스크린 리더가 ‘현재 단계’로 인지합니다. 또는 ’2단계 신청내용 (현재)’·’3단계 중 2단계’처럼 텍스트로요. Q3. SP-140과 어떻게 함께 가나요? 현재 단계(SP-139) + 섹션 구조(SP-140 헤딩) + 초점 관리(SP-089 정신)가 함께, 스크린 리더 사용자도 다단계 신청서를 끝까지 따라가게 하죠.

6. 마무리

SP-139의 메시지:

지금 몇 단계인지 들리게 — 현재 단계를 스크린 리더로 확인하게 제공하라.

현재 단계가 스크린 리더에 안 들리면 위치를 모르고 길을 잃습니다. aria-current·텍스트로 현재 단계·위치를 확인하게 하는 게 핵심이죠. 다음 편은 입력 폼 섹션 헤딩 — 신청서 작성 서브섹션의 마지막입니다.

**다음 편 예고 ▶ 「814. (SP-140) 스크린 리더 사용자가 신청서 입력 폼 섹션의 구조와 정보를 인지하고 섹션 단위로 건너뛸 수 있도록

~

헤딩을 제공하고 있다.」**

ViewCheck는 현재 단계가 스크린 리더로 확인되는지를 진단합니다.

📚 참고 출처

KRDS 서비스 패턴 — 신청 가이드 — https://www.krds.go.kr/html/site/service/service_04.html

WAI-ARIA aria-current — https://www.w3.org/TR/wai-aria-1.1/#aria-current

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

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