An ultra-comprehensive guide to the design of Electronic Business website product page

The Product Details page is the most easy to connect with the user in the electronic Commerce website to resonate the page, the detail page design most likely will have the direct influence to the user's purchase behavior. Therefore, the design of the Product Details page will involve the operation level, on the basis of aesthetics and practicality, the information to be expressed can be displayed with visual visual angle as far as possible, and then consciously avoid the conflict between design and operation.

　　First, the merchandise display map should not be too large, mouse hover show details

The picture display in the Product detail page is the first visual point after the user enters the page, the designer may therefore think that this picture size should enlarge as far as possible, lets the user to the commodity overview at a glance. However, as a designer should also consider the importance of the right text information to the user, the ratio between the two to avoid a large deviation, to reduce the user's visual discomfort.

Ikea's website because of the picture and the ratio between the text of the problem, so that the overall look is not clear, the picture around the white is crowded with the right side of the text formed a sharp contrast.

When the mouse hovers over the picture, the picture on the right side shows the details of the product, which is a common feature on the Product Details page. However, the use of the process will be found, even if the user's unconscious mouse across the picture, the details of the display will still appear immediately, which will more or less affect the user experience, and Ikea's website is very natural to solve the problem.

Ikea's details are displayed after a click, not allowing the "come on" image to disturb the user's browsing experience.

　　Second, to meet the user's psychology of parity

"Price than three" is the consumer habits of online shopping groups, therefore, the design of the Product Details page should also be integrated into and meet the user's psychological state of choice price. In consumer psychology, it is said that most customers buy things based on personal feelings, may not be the real price of cheap, but businesses can make customers feel cheap.

Discount or the display of preferential lines can make the consumer psychology of subtle changes, as Dangdang's approach, so that the original price and discount prices, and then directly show discounts, this repeated expression can deepen the user's feelings of the strength of the concessions.

　　Third, add the Share button

The power of social media is absolutely not to be underestimated in today's marketing, so sharing buttons becomes essential. In most E-commerce sites we can see:

The Share button is set below the display picture or text, mainly to share the current page of the product. But in fact, the real share of marketing promotion should not be limited to the commodity itself.

For example, the record of successful purchases, or the interesting interaction between buyers and sellers, can be a shared content, which may be more appealing than the product itself.

　　Four, call to Action

Call to action can be interpreted as user behavior calls, which we often call user guidance. The call to action typically starts with a two-point color and copy, and color is the most intuitive form of expression. Emphasize highlighting with colors that are different from the big environment on the page, and make them more willing to click while appealing to the user.

Prices, labels, and the "Add Shopping Bag" button all use bright rose red; Shopping bags are also more life-dependent than "shopping carts".

　　V. Evaluation opinion is the necessary plate

The lack of trust in the network is a problem for most users, while others ' evaluations and suggestions can have a great impact on the purchase behavior at that time. Therefore, customer reviews are not optional in E-commerce, but must be options.

The cat will be the customer's comments on the automatic summary of statistics, so that users in view of the time more intuitive and convenient.

No printing products on the website of the Product Details page in this respect do not have, perhaps the self-confidence of their own products? There is no need for users to listen to other customers! But as a website, still try not to so high cold.

　　Vi. Navigation following

The content of the Product Details page is more, so it is necessary to follow the navigation design. Following the appearance of navigation in the Product Details page to provide users with a great convenience, but also need to master the size of the design, stealth comprehensive navigation is the user's favorite navigation.

Jingdong Product Details page whether in the navigation color or size are more in line with the user experience, not only to allow users to browse more convenient, but also does not affect the user's visual experience.

Beautiful said to follow the navigation in two forms, the first is the main navigation of the site, browsing to a certain area, navigation automatically changed for the product details navigation. Such a practice seems to be a bit superfluous. When the user has been browsing a page in fact, there is little need to jump. In addition, it is not necessary to design level two navigation in the following navigation, which will only make the user's line of sight narrow.

　　Vii. Description of priority function use

Many product Details page of the brand plot is too obvious, this will let the user feel the commercial color too thick, lack of intimacy. Description of the Product Details page The first screen usually has new products or hot recommendations, this approach and the most should be focused on the user experience is completely opposite, this kind of behavior will cause users to dislike.

Gap's Product Details page has almost no spare parts, the content of the page is centered around a commodity, for the user to create a good and comfortable shopping environment.

　　Eight, reduce the copy, good at displaying keywords

Research has shown that 60% of the text information on the Internet users will not read, we can conclude that the Internet appeared on the copy must be the most concise, should be good at grasping the keyword.

Gome online on the Product Details page first lists a series of key points that users really need to know, and then one by one in detail in the next section.

　　Nine, maintain page consistency

On the Product Details page, from the user's point of view, they need to clearly understand the full information of the goods, or how to bring their own benefits, therefore, the logical order of product description becomes particularly important, designers can be based on the description of the cognitive rules to consider this.

Suning's easy to buy site in the page consistency of the performance is very smooth, clear, so that users can follow the clues to find the part of their needs.

　　Ten, the page should not be too long

The length of the page in the design of the Product Details page is a very common problem to be solved, the length of the page is too long will not only lead to slow loading speed, but also will allow users to produce visual fatigue. In general, the PC is displayed within 20 screens, and the mobile end is controlled in 10 screens, or within 4 pages.

A Shop Details Page page length control is more appropriate, as far as possible to account for the relevant matters clearly, do not add other dispensable ingredients.

　　Summarize:

The design of the product detail page embodies not only the pure visual effect, but also the process of guiding the user, regardless of the conception or typesetting. Impress users, stimulate the purchase, designers should hold such a concept for users to spread a fantasy, and not just design a page.