신청 가능한지 한눈에

KRDS SP-103 — 신청 상태 정보를 명확하게 인지할 수 있도록 표현하고 있다.

0. 들어가며 — 신청할 수 있는지 없는지 모르면

이번 777편은 신청 상태 정보를 명확하게 인지할 수 있도록 표현하라는 규칙입니다.

신청 목록에서 — 각 서비스가 ’신청 가능’인지 ’마감’인지 ’예정’인지가 안 보이면, 사용자는 헛걸음하죠. SP-103은 신청 상태를 명확히 표현하라고 규정합니다. 배지·상태 표시의 신청 적용이죠. 이번 편을 풀어냅니다.

1. 원문 — 신청 상태 정보 명확 표현

SP-103 (서비스 패턴 > 신청 > 신청 대상 탐색) “신청 상태 정보를 명확하게 인지할 수 있도록 표현하고 있다.”

신청 상태 정보를 명확히 인지되게 표현하라는 뜻입니다.

정리: 신청 상태(가능/마감/예정 등)를 명확히 표현하라. 이게 SP-103입니다.

2. 왜 신청 상태 표현인가

신청 서비스는, 각각 상태가 있습니다: 신청 가능, 마감, 신청 예정, 진행 중 등이요. 사용자는 지금 신청 할 수 있는지를 알아야, 헛걸음 없이 신청하죠. SP-103은 상태의 명확한 표현을 요구합니다.

상태가 불명확할 때의 문제:

헛걸음 신청 상태가 안 보이면, 사용자는 마감된 서비스를 신청하려다 헛걸음합니다. 또는 신청 가능한 걸 마감된 줄 알고 놓치죠.

혼란 가능/마감/예정이 구분 안 되면, 어느 걸 신청할 수 있는지 헷갈립니다.

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

상태 배지·라벨 각 서비스에, 신청 상태를 배지·라벨로 표시합니다. ‘신청 가능’, ‘마감’, ‘예정’, ‘진행 중’ 처럼요(배지 컴포넌트 CP-186~193). 사용자가 한눈에 상태를 알게요.

시각적 구분 상태별로 시각적으로 구분합니다. ’신청 가능’은 활성 색, ’마감’은 회색·비활성 등으로요. 단 색만 의존 말고 텍스트도(WCAG 1.4.1).

마감 임박 강조 마감이 임박한 건, 강조(SP-104 기한 정보)합니다. ’마감 D-3’처럼요. 사용자가 서두르게요.

접근성 상태를, 스크린 리더도 인지하게요. 배지가 시각만이 아니라 텍스트로 전달되게요(SP-110 접근가능한 이름).

신청 가능 여부의 중요성. 신청 서비스에서, 가장 중요한 정보 중 하나가 ’지금 신청할 수 있나’입니다. 이를 명확히 표현하면, 사용자가 가능한 것만 골라 효율적으로 신청하죠. 마감된 걸 시도하는 헛걸음을 막고요.

한시 서비스와 연계(SP-101·104). 한시 서비스는, 신청 가능 우선 정렬(SP-101) + 상태 표시(SP-103) + 기한 정보 (SP-104)가 함께, 사용자가 지금 가능한 걸 빨리 찾고 신청하게 하죠.

이 규칙은 신청(SP)의 ’신청 상태 가시성’을 담당합니다 — 신청 상태를 명확히 표현해(103), 사용자가 신청 가능 여부를 한눈에 알고 헛걸음 없이 신청하게 하죠. 신청 대상 탐색의 핵심 정보입니다.

정리하면 — 신청 상태가 불명확하면 마감된 걸 시도하거나 가능한 걸 놓치므로, 신청 가능/마감/예정 등 상태를 배지·라벨로 (색만 아닌 텍스트·접근성 포함) 명확히 표현해야 합니다.

3. 점검 / 개선

무엇을 점검하나

상태 표시 — 각 서비스에 신청 가능/마감/예정 등 상태가 표시되는가.

시각 구분·색 외 단서 — 상태별 시각 구분 + 색만 아닌 텍스트가 있는가(WCAG 1.4.1).

접근성 — 상태가 스크린 리더에 전달되는가(SP-110).

개선 방향

신청 상태 배지·라벨(가능/마감/예정, CP-186~193). 마감 임박 강조(SP-104).

색만 의존 금지(WCAG 1.4.1). 스크린 리더 전달(SP-110).

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

역할	책임
기획/디자이너	상태 표현 설계
개발	상태 표시 구현

기관 유형	SP-103 적용
중앙행정기관(대표·운영) / 공공기관 / 지자체	✅ 권장 (신청 서비스 제공 시)

신청 서비스 목록을 제공하는 사이트가 해당됩니다.

5. 30초 자가진단 + FAQ

✅ 30초 자가진단

□ 각 서비스에 신청 가능/마감/예정 등 상태가 표시되나요?

□ 상태별 시각 구분 + 색만 아닌 텍스트가 있나요(WCAG 1.4.1)?

□ 상태가 스크린 리더에 전달되나요(SP-110)?

❓ FAQ

Q1. 신청 상태가 왜 중요한가요? 가장 중요한 정보 중 하나가 ‘지금 신청할 수 있나’입니다. 안 보이면 마감된 걸 시도 하거나(헛걸음) 가능한 걸 놓치죠. 명확히 표현해 효율적으로 신청하게 합니다. Q2. 어떻게 표현하나요? ’신청 가능’·‘마감’·‘예정’·‘진행 중’ 배지·라벨로요(CP-186~193). 상태별 시각 구분(활성/회색) 하되 색만 의존하지 않고 텍스트도요(WCAG 1.4.1). Q3. 마감 임박은요? ’마감 D-3’처럼 강조합니다(SP-104 기한 정보). 사용자가 서두르게요. 한시 서비스는 가능 우선 정렬 (SP-101)·상태(SP-103)·기한(SP-104)이 함께 작동하죠.

6. 마무리

SP-103의 메시지:

신청 가능한지 한눈에 — 신청 상태 정보를 명확하게 표현하라.

신청 상태가 불명확하면 마감된 걸 시도하거나 가능한 걸 놓칩니다. 상태를 배지·라벨로 명확히 표현해 헛걸음 없이 신청하게 하는 게 핵심이죠. 다음 편은 한시 서비스 신청 기한 정보입니다.

다음 편 예고 ▶ 「778. (SP-104) 한시적으로 운영되는 서비스인 경우 신청 목록에 신청 가능 기한 정보를 제공하고 있다.」

ViewCheck는 신청 상태 정보가 명확하게 표현되는지를 진단합니다.

📚 참고 출처

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

WCAG 2.1 SC 1.4.1 Use of Color — https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html

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

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