모바일에서 메뉴를 열었는데 닫는 방법이 분명하지 않으면 이용자는 원하는 페이지를 보기 전에 화면을 새로고침하거나 뒤로 가기를 누를 수 있습니다. 작은 ‘×’ 표시가 있다고 해서 누구나 쉽게 찾는 것은 아닙니다. 메뉴의 열기부터 하위 항목 선택, 닫기까지 한 흐름으로 시험해야 합니다.
먼저 메뉴가 화면 전체를 가리는지, 일부만 덮는지 확인합니다. 전체 화면 메뉴라면 닫기 버튼이 스크롤해도 찾을 수 있는 위치에 있어야 합니다. 일부를 덮는 방식이라면 바깥 영역을 눌렀을 때 닫히는지, 그 동작이 의도하지 않은 다른 링크를 누르게 하지는 않는지 살펴봅니다. 닫기 버튼의 터치 영역이 주변 항목과 겹치지 않아야 합니다.
아이콘만 놓은 경우에는 보조 기술에서도 ‘메뉴 닫기’로 읽히는지 확인합니다. 시각적으로 보이는 모양과 실제 접근성 이름이 다르면 키보드나 화면 읽기 사용자는 버튼의 목적을 알기 어렵습니다. 메뉴를 닫은 뒤 초점이 원래 메뉴 열기 버튼 근처로 돌아오는지도 시험합니다. 화면에 보이지 않는 하위 항목으로 초점이 계속 이동하면 조작하기 어렵습니다.
긴 하위 목록에서 아래로 스크롤한 뒤 닫는 상황도 확인합니다. 닫기 버튼이 화면 위에만 고정되지 않고 함께 사라진다면 다시 맨 위로 올라가야 할 수 있습니다. 화면 회전이나 글자 확대 후에도 버튼이 보이고 작동하는지 봅니다. 기기의 운영체제와 브라우저에 따라 겹치는 영역이 달라질 수 있으므로 여러 화면 크기를 표본으로 확인합니다.
버튼을 누른 뒤 페이지가 예기치 않게 처음으로 이동하거나 읽던 위치를 잃지 않는지도 중요합니다. 메뉴를 단지 닫았는데 새 페이지가 로드되면 이용 흐름이 끊깁니다. 하위 항목을 선택했을 때에는 메뉴가 적절히 닫히고 새 콘텐츠의 시작을 알 수 있어야 합니다.
점검 기록에는 어떤 화면에서 메뉴가 열렸는지, 닫을 수 없었던 입력 방식, 수정 후 결과를 적습니다. 닫기 버튼은 작은 그래픽 요소지만 모바일 사이트의 모든 방문 경로에 영향을 주는 기본 동작입니다.