Pagination
대량의 콘텐츠를 관리 가능한 크기의 페이지로 나누어 탐색할 수 있게 하는 네비게이션 요소입니다. 사용자가 콘텐츠를 효율적으로 탐색하고, 특정 페이지로 직접 이동하며, 현재 위치를 파악할 수 있도록 돕습니다.
- 1. Per page
- 2. Backward navigation
- 3. First page
- 4. Ellipsis
- 5. Current page
- 6. Last page
- 7. Forward navigation
- 8. Move to page
정보 탐색에 용이할 수 있도록 Leading, Trailing content 위치에 컴포넌트에서 제공하고 있는 ‘Per page’, ‘Move to page’ 옵션을 자유롭게 배치하여 사용성을 높일 수 있습니다. 해당 요소 이외에도 커스터마이징 요소 역시 위치할 수 있습니다. 760px 이하의 해상도에서만 Contents option을 사용할 수 있습니다.
- Per page: 페이지의 표시할 아이템 수를 조정할 수 있습니다.
- Move to page: 원하는 페이지의 번호를 입력하여 이동할 수 있습니다.
Total page가 20개 이상일 시 Boundary 옵션을 적용함으로써 탐색 시 가장 처음 페이지와 끝 페이지로 이동하는 편의성을 제공하는 것을 권장합니다.
기본적으로 말줄임을 포함하여 11개의 페이지 버튼이 보여집니다. Total page가 20개 이상일 시 Boundary=1, Sibling=3을 기본값으로 두어 처음과 끝 페이지의 탐색 편의성을 제공합니다. 탐색 데이터 수가 40개 이상일 시 Per page, Move to page를 제공하는 것을 권장합니다.
