페이지네이션
페이지네이션은 많은 양의 콘텐츠를 탐색하기 쉽도록 여러 화면에 나누고, 분할된 화면을 탐색하는 데 사용되는 요소이다.
컴포넌트명
페이지네이션 (Pagination)
-
1.이전/다음 버튼
화면 목록을 앞/뒤로 탐색하는 데 사용되는 버튼. 아이콘과 텍스트를 조합하여 제공하거나, 아이콘과 텍스트를 단독으로 사용할 수 있음
-
2.숫자 링크 목록
표시된 숫자의 화면으로 이동할 수 있는 링크. 목록의 첫 번째 요소는 숫자 '1', 마지막 요소는 가장 마지막 화면의 숫자를 표시함
-
3.현재 화면 식별자
사용자가 현재 탐색하고 있는 화면을 나타냄
가이드
-
페이지네이션에는 첫/마지막 화면, 이전/다음 화면으로 이동할 수 있는 수단을 제공한다.
목록 확장형 페이지네이션을 제외하고 사용자는 어떤 페이지에서든 항상 첫 화면, 마지막 화면, 이전 화면, 다음 화면으로 이동할 수 있어야 한다.
-
전체 화면 수를 표시한다.
사용자가 전체 데이터 목록 수를 알 수 있도록 전체 화면 수를 제공해야 한다.
-
번호 링크에 현재 화면 숫자를 강조하여 표현한다.
사용자가 현재 몇 번째 화면을 탐색하는지 명확하게 변별할 수 있도록 현재 화면 숫자 링크를 적절하게 강조하여 표현한다. 목록 상단에 별도의 텍스트 정보를 제공함으로써 탐색 중인
화면의 인지를 도울 수 있다.
-
페이지네이션은 전체 서비스에서 일관된 영역에 배치한다.
페이지네이션은 유형에 상관없이 목록 하단에 중앙 정렬하여 사용자가 전체 사이트에 걸쳐 일관된 영역에서 접근할 수 있도록 한다.
-
페이지네이션은 한 화면에 하나만 사용한다.
페이지네이션을 이용하여 구분하고 탐색해야 할 항목이 한 화면에 여러 개 제공되면 복잡성이 증가하고 여러 개의 목록 및 페이지네이션의 용도와 역할 구분이 어려워진다.