메뉴

국가 선택 필드 테스트: 검색과 정렬, 키보드 조작

국가 선택 필드의 여러 형태별로 무엇을 확인해야 하는지, 검색이 여러 표기를 받아들이는지와 정렬·키보드 접근성까지 정리합니다.

게시일

  • 폼 검증
  • 접근성

국가 선택 필드 테스트는 “고를 수 있는가”에서 끝나지 않습니다. 같은 필드라도 목록을 어떻게 보여 주고, 무엇으로 찾게 하고, 고른 뒤에 무엇이 따라오는지에 따라 확인할 지점이 달라집니다. 이 글은 그 지점을 형태별로 나눠 봅니다. 국가와 언어를 어떻게 구분해 다루는지는 국가와 언어의 차이에서 먼저 다뤘습니다.

국가 선택 필드는 어떤 형태로 만들 수 있나요?

가장 단순한 형태는 긴 목록을 그대로 펼치는 방식입니다. 항목이 많지 않으면 빠르게 고를 수 있지만, 목록이 길어질수록 스크롤이 부담이 됩니다. 이 형태에서는 기본값과 첫 항목의 처리, 그리고 목록 끝까지 스크롤했을 때의 동작을 확인합니다.

다음은 입력한 글자로 후보를 좁히는 방식입니다. 항목이 많은 화면에서 흔히 쓰이고, 사용자가 이름 일부만 기억해도 고를 수 있다는 장점이 있습니다. 대신 무엇을 입력했을 때 무엇이 나오는지가 곧 사용성이며, 여기서 실패가 가장 많이 생깁니다.

지역별로 묶어서 보여 주는 방식도 있습니다. 처음에는 지역만 보이고, 하나를 고르면 그 안의 국가가 나옵니다. 이 형태는 목록을 짧게 보여 주지만, 분류가 맞지 않는 국가를 찾기 어려워지는 위험이 있습니다.

마지막으로 지원하는 국가만 보여 주는 방식입니다. 목록이 짧아지는 대신, 보이지 않는 국가를 사용자가 직접 입력했을 때 어떻게 처리할지가 새로운 확인 지점이 됩니다.

형태 강점 확인할 지점
펼친 목록 빠른 선택 기본값, 목록 끝 처리
입력으로 좁히기 이름 일부로 검색 어떤 표기가 잡히는가
지역 묶음 목록이 짧아짐 분류 밖 국가의 접근
지원 국가만 오류가 줄어듦 목록 밖 입력의 처리

검색은 어떤 표기까지 잡아야 하나요?

사용자는 자기 나라를 부르는 방식으로 입력합니다. 그래서 최소한 네 가지 표기를 받아들일 수 있어야 합니다. 그 나라 언어로 쓴 이름, 널리 쓰이는 다른 언어 이름, 두 글자 코드, 그리고 흔히 쓰는 줄임말입니다.

이 가운데 하나만 잡히면 나머지 사용자는 검색에 실패합니다. 특히 자기 언어로 쓴 이름이 잡히지 않을 때 사용자는 목록 자체가 자기 나라를 빠뜨렸다고 생각합니다. 실패 문구가 무엇을 말하든 인상은 같습니다.

검색이 잡아야 할 것은 정확한 이름만이 아닙니다. 띄어쓰기가 다른 형태, 앞뒤에 붙는 관사, 대소문자가 섞인 입력도 같은 결과로 이어져야 합니다. 이때 표시는 사용자가 입력한 그대로 두고 매칭만 관대하게 하는 편이 안전합니다.

이름을 정렬할 때 언어 규칙이 필요한 이유는 무엇인가요?

문자 하나하나의 순서를 그대로 쓰면 사람이 기대하는 순서와 달라집니다. 언어마다 어떤 글자를 어디에 두는지에 대한 관례가 다르고, 같은 글자라도 위치가 달라질 수 있기 때문입니다. 사용자는 목록에서 자기 나라를 찾을 때 그 관례를 기준으로 훑습니다.

이 문제는 국가 목록에서 특히 잘 드러납니다. 여러 문자 체계의 이름이 한 목록에 섞이기 때문입니다. 정렬을 어느 한 언어의 규칙으로만 정하면 다른 언어 사용자에게는 목록이 무작위처럼 보입니다.

그래서 정렬 기준을 정할 때는 화면 언어를 기준으로 삼는 편이 자연스럽습니다. 같은 목록이라도 화면 언어가 바뀌면 순서가 바뀔 수 있고, 그 사실을 문서에 적어 두면 나중에 순서 차이를 오류로 오해하지 않습니다.

키보드와 화면 읽기 도구는 어떻게 확인하나요?

항목이 많은 목록은 마우스로만 다룰 수 있어서는 안 됩니다. 키보드로 열고, 이동하고, 닫을 수 있는지가 첫 번째 확인 지점입니다. 목록을 열었을 때 초점이 어디에 있는지도 함께 봅니다.

두 번째는 글자로 건너뛰는 동작입니다. 목록이 길 때 첫 글자를 눌러 그 글자로 시작하는 항목으로 이동하는 방식은 흔히 쓰입니다. 이 동작이 화면 언어의 정렬 순서와 맞는지도 확인해야 합니다.

세 번째는 방향키와 닫기 키입니다. 위아래로 이동하다가 목록 밖으로 나가지 않는지, 닫기 키를 눌렀을 때 처음 열었던 자리로 돌아오는지 봅니다. 마지막으로 화면 읽기 도구가 지금 몇 번째 항목인지, 무엇이 선택되었는지 읽어 주는지 확인합니다.

국가를 바꾸면 어떤 값이 따라 바뀌어야 하나요?

국가를 바꾸는 순간 이전 국가를 전제로 채워진 값들이 남습니다. 도시, 하위 행정구역, 우편번호처럼 국가에 종속된 값입니다. 이 값들을 그대로 두면 화면에는 두 국가가 섞인 주소가 남고, 저장되면 나중에 어느 쪽도 맞지 않는 데이터가 됩니다.

처리 방식은 두 가지로 나눌 수 있습니다. 하나는 국가가 바뀌면 종속 값을 비우고 다시 입력하게 하는 방식이고, 다른 하나는 새 국가의 목록에서 다시 고르게 하는 방식입니다. 어느 쪽을 골랐든 사용자에게 무엇이 바뀌었는지 알려 주어야 합니다. 말없이 지워지면 사용자는 자기가 뭘 잘못했다고 생각합니다.

또 하나 확인할 것은 되돌리기입니다. 실수로 국가를 바꾼 뒤 원래 국가로 돌아왔을 때 이전 값이 살아 있는지, 아니면 처음부터 다시 입력해야 하는지가 정해져 있어야 합니다. 이 동작이 문서에 없으면 담당자마다 다르게 만듭니다.

개발자를 위한 메모: 표시 이름과 코드를 나눠 저장하라

  • 저장에는 안정된 코드를 쓰고, 화면에는 현재 언어의 이름을 보여 줍니다. 이름을 저장하면 그 나라의 표기가 바뀌는 순간 과거 값이 해석되지 않습니다.
  • 검색용 색인에는 이름, 코드, 별칭을 함께 넣습니다. 화면에 보이는 값과 검색에 쓰는 값을 같은 것으로 두면 별칭을 넣을 자리가 없습니다.
  • 목록 항목의 식별자를 표시 이름으로 대신하지 않습니다. 같은 이름이 두 번 나오는 순간 어느 쪽을 골랐는지 알 수 없습니다.
  • 국가 변경 시 초기화할 항목 목록을 데이터로 둡니다. 코드에 흩어 두면 항목을 하나 추가할 때마다 빠뜨립니다.
  • 목록이 아주 길어지면 한 번에 그리는 양을 줄입니다. 다만 이때도 키보드 이동과 화면 읽기 도구가 같은 결과를 보는지 함께 확인합니다.

다음 단계

지금 쓰는 선택 필드에 이름 일부, 두 글자 코드, 줄임말을 차례로 넣어 보고 결과가 같은지 확인해 보세요. 세 입력이 다른 결과를 낸다면 사용자마다 다른 목록을 보는 셈입니다. 국가가 여러 개 얽히는 화면은 국경을 넘는 주소 시나리오에서 다루고, 어떤 국가를 목록에 둘지는 국가 선정 기준에서 이어집니다. 실제 목록과 이름 표기는 국가와 지역 디렉터리에서 비교할 수 있습니다.

여기 적힌 목록 형태와 입력 예시는 확인 지점을 설명하려고 지어낸 합성 데이터이며, 실제 사용자가 제출한 값이나 어떤 서비스의 실제 항목 구성이 아닙니다.

이어 읽기

국가별 주소 및 신원 데이터 형식 관련 글