Design of image preview in content webpage
|
<br />I have written two articles before, "Preview Navigation of Content Page Numbers" and "Analysis of Photo Preview Navigation". What I want to explain is that the preview function occupies a large proportion in the user's mind. If you only give a row of sequential numbers as the title of the link, the user will feel insecure. Although providing a row of sequential numbers as a link is almost the default paging link mode for the entire Internet, it is also because of this that the user's psychological sense of security is ignored and becomes a hidden factor that can be ignored under normal circumstances. But if these hidden factors are triggered by certain things under certain specific circumstances, the damage will be magnified and may even eventually turn into a fierce struggle. If a preview function is added to this navigation that only has numbers, users will naturally feel more secure psychologically, because they don’t have to guess what content will pop up on the next page. Through the preview, they can know the approximate content of the next page they are about to see in advance. Especially for picture news, the picture preview function on the pagination link can bring users a better user experience, because users can know the approximate content of the entire set of news pictures through the preview navigation, so they can choose to skip reading or exit reading directly. Although doing so may result in the loss of some website PV, it is undoubtedly more beneficial for cultivating long-term users. Some people may say that this will lose the sense of mystery, but what I want to say is that compared with the sense of security, the sense of mystery occupies a lighter proportion in the user's mind. Especially for news information content, the sense of mystery occupies an even lighter proportion in the user's mind. News content pursues the relevance of information. If the content is too long and has pages, it also pursues the coherence of information. I have never seen any news that talks about how people live in the city on the first page, and suddenly talks about how heavy a pig can grow on the second page. These are two completely different topics of information. If you have to talk about them together, then it is a good example of misattribution, because "Zhang" and "Li" are both surnames in the Hundred Family Surnames, and "human" and "pig" are both animals. Many websites have content pages that are long and have pictures that need to be paginated. In this way, a link to the next page will be added to the picture. This not only eliminates the trouble of finding the link to the next page from a large amount of content, but also increases the probability of clicking the "next page" link. Entertainment news contains more pictures than text information. The first thing entertainment news should do is to impact the user's eyes visually rather than using text to shock the user. For entertainment news that often contain multiple pictures, paginated display is naturally a good method. It can speed up the loading speed of the page and increase the number of clicks on the page. It is undoubtedly a good way to kill two birds with one stone. Tencent Entertainment's news content page has always adopted the method of clicking on a picture to go to the next page. Although it brings a better user experience than clicking on a number to go to the next page, regrets are still inevitable during use. For example, the title of a piece of news is "Xinhua star steals the show at XYZ award ceremony", so I click on the title to go to the content page, but I find that the picture on the first page is not that "Xinhua star", but the entire news content is divided into more than ten pages. How do I know which page the picture of this "Xinhua star" is on? I went in because I saw this "certain star". I am not interested in other stars. What should I do? I had no choice but to flip through the pages one by one. Maybe if I was lucky I could find it on the first few pages, but maybe if I was unlucky I would have to turn to the second to last page to see the picture I wanted. Although I finally achieved my desired goal, are there any regrets in the process of achieving it? Today I found that some of Tencent Entertainment's picture news content pages have changed. It is no longer just clicking on the picture to go to the next page. Instead, a picture preview navigation has been added to the news content page. Finally, the regret I mentioned above has been made up. I no longer need to look through page by page just to find a page of content I like among a dozen pages. However, this image preview navigation is not perfect, because each time you click on an image, you will jump to a page. If the current group of images still does not have the content I want to see, then I have to click on the next group to see if there is the content I need. It would be more perfect when the image preview navigation of this content page can be made into the same preview navigation as the album.  |
<<: Learn v-model and its modifiers in one article
>>: CSS draw a lollipop example code
Recommend
Solution to the problem of too high penetration of input and textarea levels in WeChat applet
The WeChat mini-program native components camera,...
Provides helpful suggestions for improving website design
<br />Scientifically Design Your Website: 23...
Introduction to CSS style classification (basic knowledge)
Classification of CSS styles 1. Internal style --...
Vue method to verify whether the username is available
This article example shares the specific code of ...
Docker image optimization (from 1.16GB to 22.4MB)
Table of contents The first step of optimization:...
Analysis of the principles of docker containers
Table of contents 01 What is the essence of a con...
Explanation of Linux kernel optimization configuration for high-concurrency nginx server
Since the default Linux kernel parameters are bas...
Introduction and architecture of Apache Arrow, a high-performance data format library package on JVM (Gkatziouras)
Apache Arrow is a popular format used by various ...
How to implement parallel downloading of large files in JavaScript
Table of contents 1. HTTP Range Request 1.1 Range...
The basic use of html includes links, style sheets, span and div, etc.
1. Links Hypertext links are very important in HTM...
Detailed explanation of the code for querying data of a certain day, month, or year in MySQL
today select * from table name where to_days(time...
Linux system prohibits remote login command of root account
ps: Here is how to disable remote login of root a...
How to strike a balance between ease of use and security in the login interface
Whether you are a web designer or a UI designer, ...
Detailed explanation of how to query fields containing '%' in MySQL like (ESCAPE usage)
In the SQL like statement, for example SELECT * F...
XHTML Web Page Tutorial
<br />This article is mainly to let beginner...