Interaction in web design: A brief discussion on paging issues

Interaction: Pagination 123WORDPRESS.COM

Function: Jump to the previous page or the next page.
Elements: The basic elements of paging are: previous page + page number + next page (such as marked 1); total page number (such as marked 2); jump page (such as marked 3); "confirm" button (such as marked 4);

Scenario: Based on the above basic elements, there will be different combinations in different scenarios (Scenario 1) 19th floor forum:
When the number of forum pages is large, it may reach thousands; most of the paginated content is top posts or original posts that are updated continuously, so most users will check the original posts on the homepage, and then selectively check some message pages. The chance of manually flipping through all of them is almost zero; therefore, forum-style paging will have the following features:
1. Most users will turn the page directly or choose to return to the post list after reading the original post, so in addition to the bottom, a page turn is added to the top and a "return to list" shortcut is set. 2. Therefore, the "1st" page is the home page, and there is always a "1st" page. "..." is used in the middle to indicate the page number that is not displayed;
3. Only provide "home page 1 + 5 consecutive page numbers + last page" page numbers; the developer should consider that the average user can view at most 5 pages of content in a row. Or you can jump directly to the last page to view, so the last page number and the shortcut button to jump directly to the last page are displayed;

(Scene 2) Weibo:
The information that users browse is the information they are interested in, and they browse it page by page like reading a newspaper, so "previous page" and "next page" are used most often; the second is page jump. In order to reflect the concept of lightweight microblogs, the middle page number part of the traditional page turn is simplified into a drop-down menu, which can both mark the current page position and switch pages;
Sina Weibo: 45 microblogs per page, more will turn the page, previous page, next page and page number, default push 10 pages

(Scene 3) Baidu search page:
1. The search results only provide 10 pages for the first time; generally, users should change the search content if they still cannot find what they want within these 10 pages. The footprint graphic and the corresponding page number below can be clicked to turn the page, which increases the interest of the page. 2. Because users generally do not return to the homepage when searching for pages, the page only has shortcut buttons for the previous page and the next page. 3. Click any page number to continue browsing, and you will find that the subsequent page number provided is: current page + 9; this is convenient for users to expand the search range.
4. Provide up to 20 page numbers; more suitable for page width

(Scene 4) Information scrolling:
1. Tencent Weibo: 45 microblogs per page, more than one button is displayed by default, click it and 45 more will be displayed below, and so on; Tencent also launched a page turning mode for users to choose, which is more user-friendly

2. Petal "infinite scrolling", when the user browses to the bottom of the page, the page will be automatically refreshed to display new information; after turning many pages in a row, when there is no more content to display, the related information button "View more information" will automatically appear to guide the user to browse other related information; if the page is too long, a "Back to top" button will be provided;