사이드 메뉴, 왜 손봐야 할까

대부분의 쇼핑몰 사이드 메뉴는 카테고리를 위에서 아래로 쭉 나열한 '리스트형'입니다. 익숙하지만, 카테고리가 많아지는 순간 이 익숙함이 약점이 돼요.

고객이 메뉴를 열고도 원하는 곳을 못 찾으면, 그냥 닫고 나가버리게 됩니다.

리스트형 메뉴에선 고객이 글자를 하나씩 '읽어야' 분류를 파악합니다. 분류가 20개를 넘어가면 이게 은근히 피로한 일이 되죠.

반면 카테고리마다 썸네일을 더하면, 고객은 글자를 읽기 전에 형태로 먼저 길을 찾아요. 같은 메뉴인데 탐색 속도가 달라지는 이유입니다.

카테고리가 많은 쇼핑몰의 모바일 사이드 메뉴를 바꿔봤습니다. 분류가 끝없이 텍스트로만 이어지던 상태였습니다.

BEFORE 텍스트만 나열된 리스트형 사이드 메뉴

각 항목 옆에 분류를 대표하는 썸네일을 더하고, 모바일 화면에 맞는 크기·간격으로 다듬어드렸어요.

포인트는 썸네일과 텍스트의 시각 균형, 그리고 엄지로 누르기 편한 터치 간격이었습니다.

AFTER · 커스텀 3가지 시안

커스텀 시안 A

커스텀 시안 B

커스텀 시안 C

사이드 메뉴에 이미지를 넣을 땐 주의가 필요해요. 링크 연결이나 펼침·접힘 동작이 끊기지 않도록 확인해야 합니다.

작업 전 전체 백업은 늘 기본으로 챙깁니다.

지금 우리 쇼핑몰 사이드 메뉴, 고객이 글자를 다 읽지 않아도 길을 찾을 수 있나요?

카테고리가 10개 이상이거나 모바일 유입이 많은 쇼핑몰이라면 점검해볼 만해요. 패션·뷰티처럼 분류가 많은 업종일수록 차이가 크게 느껴지실겁니다!