목록 카드는 작은 약속입니다
홈페이지의 목록에서 항목 하나를 누르는 이용자는 그 카드에 적힌 제목과 요약이 상세 화면에서 이어지리라 기대합니다. 카드에 운영시간이 적혀 있었다면 상세 화면에서 곧바로 운영시간을 확인하고 싶어 하고, 신청이라는 단어를 보았다면 신청 방법을 찾고 싶어 합니다.
그런데 상세 페이지를 열었더니 같은 홍보 문구가 더 크게 반복될 뿐이라면 이용자는 왜 이 페이지를 열었는지 모르게 됩니다. 기획 단계에서 목록 카드가 약속한 정보와 상세 페이지 첫 화면에 보이는 답을 나란히 놓고 비교하는 작업을 해 두면 이런 어긋남을 줄일 수 있습니다. 이 글은 그 비교를 어떤 순서로 하고 무엇을 기준으로 고칠지 정리합니다.
카드와 상세 화면을 나란히 놓고 비교합니다
점검 방법은 단순합니다. 목록 화면에서 카드 하나를 캡처하고, 눌렀을 때 나오는 상세 화면의 첫 화면을 옆에 둡니다. 카드의 제목과 요약이 던진 질문이 무엇인지 한 문장으로 적고, 상세 화면 첫 화면에서 그 질문의 답을 찾을 수 있는지 확인합니다.
답이 첫 화면에 없고 스크롤을 한참 내려야 나온다면 순서를 조정해야 한다는 신호입니다. 답이 아예 없다면 카드가 실제 내용보다 많은 것을 약속하고 있을 수 있으므로 카드 문구를 고치는 것도 선택지입니다.
첫 화면에는 적용 대상과 제공 범위를 먼저 둡니다
상세 페이지에서 이용자가 가장 먼저 판단하는 것은 이 내용이 자신에게 해당하는지입니다. 그래서 적용 대상과 제공 범위, 운영시간이나 신청 방법, 장소처럼 결정에 필요한 값을 앞쪽에 둡니다. 이런 값은 확인된 자료에서 가져오고, 추측으로 채우지 않습니다.
예외 조건은 본문 맨 아래에 숨기지 말고 관련된 답 가까이에 둡니다. 조건을 늦게 보여 주면 이용자는 읽고 나서야 해당되지 않는다는 것을 알게 됩니다. 근거가 아직 없는 성과 수치나 실제로 제공하지 않는 선택지를 넣어 페이지를 풍성해 보이게 하는 것도 피해야 합니다.
모든 정보를 한꺼번에 담으려 하지 않습니다
상세 페이지의 목적은 정보를 모두 쏟아 놓는 데 있지 않습니다. 처음 보는 사람이 선택을 판단할 최소한의 답을 주고, 더 깊은 설명이나 별도 절차로 이어지는 길을 분명히 하면 됩니다. 필요하다면 요약 다음에 자세히 보기 같은 이동 경로를 두어 선택권을 줍니다.
목록으로 돌아가 다른 항목을 비교할 수 있는 경로도 필요합니다. 페이지 안에서만 앞뒤로 움직이고 상위 범주로 돌아갈 수 없다면 여러 항목을 비교해 선택하기 어렵습니다. 돌아가는 링크의 위치와 이름이 일관되는지 확인합니다. 비교하던 이용자가 목록의 이전 위치로 돌아왔을 때 처음부터 다시 찾아야 한다면 불편이 커지므로, 가능한 한 보던 자리로 돌아오는지도 시험해 봅니다.
모바일 화면과 확대 화면에서 직접 확인합니다
휴대전화에서 첫 화면을 열어 제목이 잘려 뜻이 달라지지 않는지, 이미지가 핵심 조건을 아래로 밀어내지 않는지, 버튼 이름이 실제로 이어질 화면을 설명하는지 확인합니다. 긴 페이지에 목차가 있다면 눌렀을 때 해당 항목으로 정확히 이동하는지도 시험합니다.
글자 크기를 키워서 보는 이용자도 있으므로 확대한 상태에서 안내가 겹치거나 가려지지 않는지 살핍니다. 필요한 내용이 있어도 읽을 수 없다면 없는 것과 마찬가지입니다. 화면 낭독 도구를 쓰는 이용자를 위해 제목 순서가 자연스러운지도 함께 살펴보면 좋습니다.
여러 경로로 들어오는 경우와 관리 방법을 정해 둡니다
상세 페이지에는 목록뿐 아니라 검색 결과나 오래된 공지의 링크를 통해서도 들어옵니다. 날짜가 바뀌는 정보에는 검토 책임자와 검토 시점을 기록하고, 연결된 화면의 값이 일치하는지 확인합니다. 같은 내용을 여러 상세 페이지에 복사해 두면 수정할 때 하나를 놓치기 쉽습니다.
공통 조건은 관리하기 쉬운 기준 페이지에 정리하고, 각 항목에는 고유한 조건만 남기는 방식이 좋습니다. 발행한 뒤에는 상세 페이지를 읽고도 같은 질문이 문의로 돌아오는지 봅니다. 조건이 빠졌는지, 위치가 숨겨졌는지, 표현이 낯선지 나누어 고치면 됩니다. 상세 페이지가 제 역할을 한다는 것은 길이가 충분하다는 뜻이 아니라, 선택한 사람이 답과 다음 단계를 찾을 수 있다는 뜻입니다. 실제 화면 구성은 사이트마다 다르므로 각자의 환경에서 직접 확인하며 조정하시기 바랍니다.