Electronic Business website product page Design Super Comprehensive guide: Popular traffic

After reading this article today, the students can do a little exercise, according to the article, the excellent set as an electric business site, the article as a commodity, to analyze which article is hot, what outstanding methods, the article contains what guide the user details and so on, that learning is used, not easy to forget, analysis well, I give you a little praise, Manual sort of.

@AnyForWeb_UDC: The commodity list page in e-commerce is also referred to as the Product aggregation page, in order to provide consumers with a better choice of product categories. This kind of page's biggest characteristic is the information is big, the picture is many, therefore the layout is clear and reasonable, and how to compress the content as far as possible is the Product List page Design key part.

At present, the domestic electricity business website's Merchandise List page common manifestation has three kinds, respectively is the row and column arrangement, the waterfall flow and the special section outstanding. These three forms each have the characteristic, the designer should choose the most suitable expression method according to the commodity characteristic.

If there are many kinds of goods and complex, the regulation of the entire row and column arrangement is more conducive to users to find the law; the waterfall flow forms more in the fashion field of the use of electric dealers; The special section stands out in the form of promotional promotions for some festive events. It will be mentioned in the following case.

　First, show the basic information

Because the Product List page is more crowded than other pages, designers should design Web pages with the mentality of displaying the most useful information within restricted areas. The user who is browsing the Product List page may not be very concerned about the details of the product, and the browsing mode is more on the way, so the simple, concise picture, the name of the product, and the price description have been able to meet the needs of the user on the page.

Shun Fung optimization of the entire Product List page looks very concise, but the display of merchandise information is not weaker than other electronic business sites, users really want to get the information are fully reflected.

　Two, the mouse hovers produces interactive effect

Many sites will ignore the mouse hover should produce interactive effects, including some well-known electric dealers. Although it is only a small effect, but it is not only the meaning of the existence of more than that, and even hosted a website and the user interaction and feedback.

The cat's Merchandise list page is in place to give users instant feedback. When the mouse hovers over the product range, the conspicuous red wireframe immediately distinguishes the product from other items, and the red line frame is the same as the main color of the site, which also makes the overall performance not abrupt.

　Third, the amount of additional information appears

Just mentioned that the Product List page should be as simple and concise as possible, but on the basis of a modest increase in some of the user's choice of goods to help the additional information can play a role in icing on the cake.

Poly-Beauty products in the list page using a special section of the outstanding performance, and to show the user a multiple view of the product picture, so that users do not need to enter the details page to see the full picture of the merchandise, indirectly reducing the rate of jump out of the Product Details page.

Beauty is a trend-oriented, youthful web site, so designers use this kind of people can accept the waterfall flow display method. The beauty of the Product List page is characterized by the addition of other users of the comments module, which is the people in the online shopping is a very important part.

　　Four, always bring to the user guidelines

Perhaps many of the electronic business sites believe that when users in the list of products to stay on the meaning of the upcoming find the goods they need; but the reality tells us, the user is likely to be in the process of page-flipping will unconsciously change before the target commodity, therefore, the website should always provide the guide for the user, bring them the clear direction sense.

The Yoho List page has pros and cons. Side navigation always exists on the page, for the user's page jump provides a large degree of convenience; But the disadvantage is that the side navigation is static, if you can achieve dynamic, you can scroll with the user's mouse and always stay in the screen is better.

　V. Setting up relevant recommendations to promote more consumption

The use of a commodity to promote the sale of another commodity, which is the usual marketing practices in e-commerce sites, but such a way if the use of too blunt users must be ungrateful, the site should try to convey the same meaning in a soft way, the designer may also be able to make a force.

Taobao's approach to this is to incorporate the recommended information into every item on the list page. "Find the same" and "look for similar" words will not let users feel too strong business taste.

　Vi. clearing the corner of the page

Each area of the page has its value and significance, may only be the perception of the user's visual level is different, as long as the layout, the page corner can become non-existent.

The corner of the Product List page is more commonly seen on the side and bottom of the page, and Jingdong will use these two areas as a way to promote other products, such as sales rankings and merchandise selection.

Seven, use the characteristic commodity to stimulate the shopping desire

If you think the characteristics of the main nature of the product can only be placed on the home page you are wrong, the first screen is indeed the entire site the best promotional gold position, but the results are not necessarily the most ideal, according to the type of goods to arrange the layout to achieve a multiplier effect.

As shown in the case of Ishun Network, the recommendation of mobile phone products is put on the head of the list page of the mobile product, so that users can see the real purchase demand.

　Viii. attractive commodity activities as far as possible

There is a saying in China, "the show is always behind," This sentence also applies to the design of the list page of the electrical business. Placing relatively attractive or purposeful commodity activities in the latter position is beneficial to the operation of the entire website.

A store will have targeted "hot recommendations" and "products related to your browsing record" at the end of the page, allowing users who might otherwise want to end their browsing to discover new content.

IX. reduction of operational steps

In the Product List page, the steps you can take are reduced only from the point of entry into the shopping cart. But the premise before this is that the commodity information display is sufficiently comprehensive and complete, it is really difficult to express all content in a small area.

It is not uncommon to display the "Add in cart" button directly on the Product List page, but it is not much to show the purchase quantity at the same time, DHC official website realized this operation, so that users can directly select the number and type of goods.

　Ten, The herd effect

Herd mentality is the general state of online shopping, so the customer who bought the product is very persuasive to the user, and the merchant can make some small changes in the design of the website.

Le Bee network in the Product List page to increase the user's value of the comments and the number of modules, so that users can more intuitively see the popularity of the product index.

Summarize:

We believe that the Product List page is the user's real online shopping status of the first step, so the comfortable user experience becomes particularly important, designers should be based on the commodity or industry, the different business needs as the primary consideration.