7.3.4 반복 입력 정보

요구 사항

하나의 과정(process) 중 특정 단계에서, 이전 단계에 사용자가 이미 입력했거나 사용자에게 제공되었던 같은 정보를 다시 입력해야 한다면 그 정보는 자동으로 채워지거나 선택해 입력할 수 있어야 합니다.

예: 온라인 구매에서 주문자와 수령자 주소가 같을 때, 이전 단계에서 입력한 주문자 주소를 다시 입력하지 않고 선택해 채울 수 있게 합니다.

예외: 비밀번호처럼 보안 등의 이유로 다시 입력하는 것이 꼭 필요한 경우.

KWCAG 2.2에서 새로 추가된 검사 항목입니다.

왜 필요한가요

같은 정보를 반복해 입력하면 기억·인지 기능에 어려움이 있는 사용자는 스트레스와 실수가 늘고, 스위치나 음성 입력을 쓰는 사용자는 입력 부담이 크게 늘어납니다.

도움받는 사용자

• 인지장애·기억력 저하가 있는 사용자
• 스위치·음성 입력 사용자
• 운동 기능에 제약이 있는 사용자
• 고령자

적용 방법

이전 단계의 입력값을 다음 단계에 미리 채우거나 “주문자 정보와 동일” 같은 선택 수단을 제공합니다. 개인 정보 입력란에는 autocomplete를 지정해 브라우저 자동 완성도 활용합니다.

<fieldset>
  <legend>받는 사람</legend>
  <label><input type="checkbox" id="same-as-buyer"> 주문자 정보와 동일</label>
  <label for="rcv-name">이름</label>
  <input id="rcv-name" autocomplete="shipping name">
  <label for="rcv-addr">주소</label>
  <input id="rcv-addr" autocomplete="shipping street-address">
</fieldset>

document.getElementById('same-as-buyer').addEventListener('change', (e) => {
  if (!e.target.checked) return;
  rcvName.value = buyer.name;
  rcvAddr.value = buyer.address;
});

사례

<label><input type="checkbox"> 주문자 주소와 동일</label>

<!-- 1단계에서 휴대전화를 입력했는데 3단계에서 빈 칸으로 다시 요구 -->
<input id="tel-again" type="tel">

자주 하는 실수

• 여러 단계 신청서에서 앞 단계에 입력한 정보를 다시 입력하게 합니다.
• 배송지 입력 시 주문자 정보를 불러올 방법이 없습니다.

검사 방법

• 회원가입, 주문·결제, 신청서 등 여러 단계로 이루어진 과정을 끝까지 진행합니다.
• 이전 단계에서 입력·제공된 정보를 다시 요구하는 곳이 있는지 확인합니다.
• 그런 곳이 있다면 자동으로 채워지거나 선택해 입력할 수 있는지, 보안상 예외인지 확인합니다.

다른 지침의 대응 항목