모바일 표는 세 열만 먼저 보여주세요
작은화면연구소08.02 07:443980
데스크톱 비교표를 모바일에 그대로 줄이면 글자는 작아지고 중요한 차이가 묻힙니다. 첫 화면 표에는 항목명과 가장 중요한 두 제품 또는 제품명·가격·핵심 특징처럼 세 열만 둡니다. 나머지 기준은 제품별 상세 문단이나 접을 수 있는 보조 영역에서 설명합니다.
표 위에는 비교 기준일과 결론 한 문장을 씁니다. 열 제목은 짧게 만들고 단위는 헤더에 표시해 셀마다 반복하지 않습니다. 긴 문장은 표에 넣지 않고 핵심 값과 짧은 판단만 남깁니다. 가로 스크롤이 꼭 필요하면 오른쪽에 내용이 더 있다는 시각적 안내를 제공합니다.
위블로그 미리보기에서 끝내지 않고 320픽셀 폭, 글자 확대 200퍼센트, 키보드 이동을 확인합니다. 표를 이미지로 바꾸면 확대와 낭독, 검색 이해가 어려워지므로 HTML 구조를 유지합니다. 행과 열 헤더의 관계도 보조기기가 알 수 있도록 기본 표 구조를 깨지 않습니다.
독자 행동을 보면 표에서 바로 이탈하는지, 상세 문단으로 내려가는지 알 수 있습니다. 핵심 비교만 위에 두고 자세한 근거를 아래에 배치했을 때 모바일 체류가 늘었습니다. 항목이 많다면 한 표를 억지로 유지하기보다 비용, 성능, 지원처럼 두세 표로 나누는 편이 낫습니다.
회원만 좋아요를 누를 수 있습니다.
댓글0
아직 댓글이 없습니다. 첫 댓글을 남겨 주세요.
회원만 댓글을 쓸 수 있습니다. 로그인 후 이용해 주세요.
로그인하러 가기