The Ultimate Guide for Ecommerce Guidelines and Best Practices in 2023

Sai Ananth

19th February 2023

Starting with best practices & ecommerce guidelines can help you save months of trial-and-error, but it should not be your final destination. To remain competitive in 2023, it is essential to follow these guidelines, which cover everything from homepage structure to checkout process optimization.

If your ecommerce site generates less than 1,000 monthly purchases and you do not have the resources to conduct A/B testing, you can use these guidelines as a list of actionable items.

It is important to note that these are current best practices and what worked in the past may no longer be effective. Tactic fatigue is a real phenomenon, as people, web technologies, and marketing trends are constantly evolving, and past successes may not be sustainable. All guidelines have been developed based on user testing and custom research conducted on some of the world’s most renowned ecommerce brands.

Here are 247 guidelines for optimizing the design and performance of your ecommerce site. To make it easier to understand and apply, we have organized our guidelines into six main categories.

Accessing our ecommerce best practices is free, although some guidelines require you to provide an email address. After you have confirmed your email, you can use it to log in on future visits.

Homepage and site-wide ecommerce guidelines

Ecommerce homepage design guidelines

Ecommerce guidelines Homepage design

Effective ecommerce homepage design, and all web design in general, is based on the principle of visual hierarchy. This principle enables you to convey your message to potential shoppers quickly and clearly. In addition, a strong call-to-action provides a clear next step to guide visitors to your product pages.

Visual hierarchy and call-to-action are two of the most critical components in designing an effective ecommerce homepage. The following 12 guidelines will help you achieve success in both areas.

12 guidelines to create an effective ecommerce homepage design:

Do not include meaningless design elements that can overload cognitive load.
The visual hierarchy should align with the information hierarchy.
The transactional menu should have a higher visual priority than the content menu.
The value proposition should be placed above the fold.
Make the navigation menu stand out by using a different color or contrasting it with the rest of the page.
When possible, include images or thumbnails next to product categories.
Add enough white space to create a clear distinction between content blocks.
Avoid placing site promotions above product lists.
Ensure that the call-to-action (CTA) is visually prominent.
CTA buttons are generally more effective than links.
If you have a secondary CTA, it should be less noticeable than the primary CTA.
Use visual cues to highlight the CTA.

Ecommerce guidelines for Images on website

An essential aspect of a positive user experience is the effective presentation of products. High-quality product images can enhance the clarity of the products offered on your website, thereby increasing the likelihood of conversions.

8 guidelines to create an effective images:

Ensure that your customers are aware of what products you offer by displaying a broad range of product types that reflect the full scope of your catalog.
Promote products and promotions that have the most widespread appeal.
Show products in their usage context to help customers envision using them.
Invest in high-quality photography and product images to showcase your products in the best light possible.
Use custom imagery to maximize perceived value and make a strong first impression.
Limit the number of products to four per row to avoid visual clutter.
Sometimes, featuring a few representative products as thumbnails can be more effective than displaying a single product for each category.
Design site promotions to match the overall website design.

Ecommerce guidelines for Homepage copy

To determine whether copy is effective, we need to examine it word-for-word to see if it’s persuasive and can generate revenue. A useful tool to evaluate copy is the value, clarity, credibility (VCC) test, which involves analyzing each sentence in a piece of copy based on its value, clarity, and credibility.

When evaluating copy for the VCC test, consider the following:

Value: Does the copy communicate the benefits to the user? People need to understand the value to be willing to spend money.
Clarity: Is the sentence simple and clear? Can it be shortened to improve clarity? Clear and concise sentences are more persuasive than complicated jargon and confusing language.
Credibility (covered in the Credibility UX Chapter): Is the statement believable? Convert generalizations and superlatives into specific claims and support them with evidence.

7 guidelines to create an effective homepage copy:

Keep it concise.
Use specific facts instead of exaggerated claims (e.g. “Rated #1 by Runner’s World Magazine” instead of “The best shoes on the planet”).
Avoid using buzzwords and technical jargon.
Choose between “your” and “my” when referring to the user interface and stick to one.
Avoid using generic language.
Use language that reflects your customers’ own words and phrasing. Look at social media mentions and survey your customers.
Maintain a consistent tone across your homepage copy.

Ecommerce guidelines to Call-to-action and Value proposition

As discussed in the previous section on copy guidelines for clarity, the VCC test is a useful tool to determine the value conveyed through a homepage’s messaging.

The value proposition is crucial because customers are busy and often scan through websites quickly, looking for reasons to buy from you. If your website does not clearly communicate your value, your competitors who do will win.

Therefore, it’s essential to not only communicate the value of your products but also to do it in a clear and concise way. Here are some guidelines for presenting a clear value proposition and call to action

7 guidelines to create Ecommerce value proposition & Call-to-action (CTA):

CTA should be easily readable and understood in five seconds or less.
The CTA should address the customers’ primary need.
Stick with only one CTA, unless for segmentation purposes. If you need more than one, add a secondary CTA.
Avoid asking for too much commitment with CTAs. For example, instead of saying “buy now,” focus on what the customers will get.
Emphasize what customers will gain instead of what they will lose. For instance, use “Get shoes” instead of “Pay Rs 500.”
Use bullet points to list the benefits.
Communicate what makes your offer unique and how you solve potential customers’ problems or improve their situation.

Ecommerce guidelines on Homepage design for Clarity guidelines

The primary objective of design is to convey the site’s message, which for ecommerce businesses is typically “buy this product” or “explore our products.” A good design should facilitate the site’s story and create a clear message that explains why and how to buy from the site. Great design contributes to the message, while bad design distracts from the message and frustrates users. To evaluate design clarity, ask yourself the following questions for each page of the site:

Is there a strong visual hierarchy in place that follows the most wanted action?
Are less important things also less important design-wise?
Is there enough white space to draw attention to what matters?
Are the visuals in place that support the content?
Does the call to action stand out enough?
How much top priority information is below the fold? Is it clear that users should scroll? Are there any logical breaks that stop the eye flow?
Is the eye path clear?
Is the body copy font size large enough for easy reading? In most cases, the optimal size is 16px, but that depends on the font.

6 guidelines to create Ecommerce home page design for clarity

Place the CTA in a location that aligns with the customer’s journey.
Remove any design elements that hinder the “most wanted” action.
Avoid putting ads (and ad-like content) in important content areas.
Ensure that relevant promotions (such as seasonal promotions or sales for specific product categories) don’t look like banner ads.
Reserve the prime real estate for content that matters; put social media icons in the footer.
Use personalized homepage content whenever possible.

Ecommerce guidelines on Homepage design for credibility

According to BJ Fogg, a leading researcher in web credibility, credibility is about making a website appear trustworthy and knowledgeable to its users. As the first point of contact for customers, a website’s credibility is responsible for making a good first impression and generating revenue. Companies that design their websites with credibility in mind have a strategic advantage over their competition.

Fogg identifies four types of credibility: presumed credibility, reputed credibility, surface credibility, and earned credibility. Presumed credibility is based on general assumptions, such as the belief that a well-known brand is more credible than an unknown brand. Reputed credibility is based on third-party references, such as when a friend recommends a service. Surface credibility is based on what we find upon initial inspection, such as the quality of a website’s design. Earned credibility is based on personal experience, such as when a website provides friendly customer service.

To maintain website credibility, certain types of content must be avoided, while others can enhance it. The passage suggests that designing a homepage with credibility in mind requires careful consideration of the elements of the page that communicate trustworthiness. The following guidelines will provide more information on what types of content should be avoided and what can enhance credibility.

2 guidelines to create Ecommerce home page design for credibility

It’s important to maintain a modern and relevant design for your website.
Avoid is the use of stock photos & videos.

Ecommerce guidelines of copy for Credibility

Copywriting is an art rather than an exact science, and there are many different approaches or “formulas” to it. However, there is no one right way to go about it. It is best to avoid the 1980s sales letter and 1990s-2000s info marketing style, which is full of hype and ridiculous promises. Consumers today are more skeptical and sophisticated, and you don’t want to sound like a Nigerian scam email. Be careful with the copywriting advice you find online, as the overwhelming majority of it promotes scam-like hype and is not supported by any science or data.

The terminology and tone of the copy on your homepage can enhance credibility. By carefully crafting your copy, users will feel comfortable on your site and will have no unanswered questions. The following guidelines can help ensure that your homepage copy enhances your overall credibility and does not detract from it.

4 guidelines to create Ecommerce copy for credibility

Eliminate any copywriting errors.
Always back up your claims with citations or reference links.
Rather than relying on an FAQ page, try to answer questions as they come up within the context of the website.
Avoid using signups or purchases as your primary call to action.

Ecommerce guidelines of content menu for Credibility

The content menu plays a crucial role in establishing credibility for your website. It is a go-to destination for users seeking help or information. Failing to address the concerns and queries of your customers through the content menu can result in a high bounce rate, as they will switch to other websites that provide them with the desired information.

Certain features of a content menu are critical for enhancing the credibility of your website. Providing simple links to relevant information is one such feature. However, other features, such as live chat or FAQs, need to be monitored and managed regularly to ensure that they are up-to-date and provide accurate information to users. This can help you build trust with your customers and increase their engagement with your website.

4 guidelines to create Ecommerce content menu for credibility

Make shipping, return, and refund policies easy to find and prominently displayed.
Show the human side of your organization by sharing your full office address, phone number, and staff information.
Ensure that your content menu is consistent and provides users with the basic information they need.
Consider using a live chat feature and displaying it in a visible location, such as the bottom right corner of the screen.

Demonstrating social proof on landing pages is incredibly crucial, to the extent that it’s among the very few elements that have never reduced conversion rates in my own experiments. Third-party validation accomplishes multiple objectives simultaneously — it establishes expectations, provides potential customers with a benchmark to compare themselves against, reinforces your messaging, and substantiates your assertions.

According to Cialdini, social proof is when individuals follow the actions of others they observe. This principle is based on the notion that safety lies in numbers.

In summary, display impressive statistics, showcase customer testimonials and social media followers, and highlight what other people are doing to exhibit social proof on your landing pages.

3 guidelines to create Ecommerce Social proof for credibility

Display any features, endorsements, popular clients, or associations related to your product.
Give prominence to user-generated content such as ratings and reviews.
Add trust badges or marks to the header and footer of your website, being mindful not to go overboard with their placement.

Ecommerce guidelines for Pop-ups & Ads

SeeWhy conducted extensive research and found that only 1% of visitors make a purchase on their initial visit to a website. This begs the question: how can we encourage them to return for a second visit?

The study did reveal that 75% of those who left the website have intentions to return to complete the purchasing process.

One effective method to grab visitors’ attention and obtain their email addresses, thereby increasing the likelihood of a return visit, is by utilizing pop-ups. Although this approach may not appeal to everyone, it can prove to be an effective means of implementing the persuasion technique known as “pattern interrupt.” This occurs when an unexpected event jolts the brain out of its routine, making it more receptive to new information. In the context of email and content marketing, this technique works especially well when the “interruption” proposes a solution to the user’s problem.

Naturally, pop-ups are not suitable for every website, so it’s crucial to conduct your own testing to determine their effectiveness for your particular business.

1 guideline to create Ecommerce Pop-ups & Advertisements

Unless you intend to increase your revenue, it’s advisable to avoid using any form of pop-ups, whether for advertising purposes or not.

Ecommerce guidelines on Navigation for usability

It’s worth noting that the entire homepage essentially serves as a navigation page. While it should also convey the site’s benefits and distinguish it from competitors, a key objective is to guide visitors further into the site to make a purchase.

Regarding design, homepage navigation benefits from adhering to established conventions and familiar structures. Users don’t want to spend valuable time searching for complicated, semi-hidden menus or trying to decipher unusual icons.

A conventional navigation layout improves usability and helps users find what they need more quickly. Organizing the most important elements in recognizable locations enhances navigation efficiency.

When asked about their experience on the site, users often cite its ease of use and responsiveness, with comments like “extremely easy to navigate” and “the site is easy to navigate. It has clear categorization, making it easy to find what I’m looking for.”

10 guidelines to create Ecommerce Navigation for usability

Use widely accepted symbols for icons (e.g. shopping cart for checkout, magnifying glass for search).
Change links’ appearance when hovered and/or clicked.
Ensure the logo is clickable and leads to the homepage.
Place the logo in the top left of the page.
Place the main navigation horizontally across the top of the page or vertically down the left side of the page.
Ensure the main navigation bar is sticky.
Limit the number of menu items to increase clarity and focus.
Use one or two words for each ecommerce navigation option.
Make dropdown menus easy to manipulate and scan.
Distinguish content menus from transactional menus visually.

Ecommerce guidelines on Content menu for usability

The content menu contains items that users access when they need help or more information, such as the shopping cart, default language, customer service details, return and privacy policies, shipping information, and FAQs.

The content menu plays a significant role in usability since users turn to it for information. If users can’t locate the content menu, or can’t find what they’re searching for inside it, this can be a significant deterrent that may result in them abandoning the site.

3 guidelines to create Ecommerce Content menu for usability

Content menu items can be designed as a secondary navigation bar in the top right corner or in the footer.
If you sell to multiple countries, denote language and currency in the top right corner.
The shopping cart icon should indicate the number of items in the cart and the total price.

Ecommerce guidelines on Transactional menu for usability

The transactional menu is used for navigation and menus related to the products or services that users can purchase.

Elements of the transactional menu typically include parent product categories (such as cars vs. trucks or men’s vs. women’s), subcategories (such as white vs. blue cars or men’s pants vs. men’s shirts), and subcategory groupings (such as seasonal, sales, promos, accessories, etc.).

11 guidelines to create Ecommerce Transactional menu for usability

Use advanced sorting and filtering for products listed on the homepage (e.g. Faceted Search)
If product categories are listed, use mega menus to easily show groupings of categories and subcategories
Dropdown navigation should display at most the first three levels of products
Always have clickable parent categories in the transactional menu
If a subcategory could apply to two different categories, include it under both
Consider displaying main categories as homepage content depending on industry and product scope
Visually indicate any default site scopes (e.g. highlight “Women’s” product category in main menu if site is defaulted to “Women’s” scope)
Avoid vague product categories such as “more”, “miscellaneous”, and “other” unless it dynamically displays more options without page load to reduce item number visually
Consider adding additional information and resources alongside products or categories, such as inline descriptions, tooltips, and explainer articles, especially in specialty or jargon-heavy product classes
Promote subcategories on the homepage to accelerate the search journey
Showcase special categories like “new arrivals” and “sales & promotion” groupings.

Ecommerce guidelines on Image slider for usability

If you’re running an ecommerce site, you might be tempted to use rotating offers, also known as image sliders or carousels. However, these features are not as effective as you might think. In fact, they can be conversion killers. Despite this, many ecommerce sites still use them. Why? There are two reasons. Some people simply think they’re cool, but being cool does not translate to increased profits. The other reason is that different departments and managers want to showcase their message on the homepage, leading to a design-by-committee approach that often fails.

Jakob Nielsen, a well-known usability expert, confirmed the ineffectiveness of image sliders in tests. In a usability study, users were asked to find out if Siemens had any special deals on washing machines. The information was on the most prominent slide, but the users couldn’t see it due to banner blindness. Nielsen concluded that the sliders were ignored.

The University of Notre Dame also tested image sliders and found that only the first slide received any significant clicks (1%), while other slides received very few clicks. Given that image sliders take up a significant portion of the page, this is a concerning result.

If you still think image sliders are a good idea, consider checking out a site that recommends avoiding them. While it’s sometimes unavoidable to use automatic image sliders, such as when corporate bosses demand them, there are other guidelines you can follow to make them more effective. The key is to ensure good navigation and avoid design-by-committee approaches.

4 guidelines to create Ecommerce Image sliders for usability

Do not use automatic image sliders.
Ensure the content in the slider images is relevant and doesn’t look like an ad.
If the slider must rotate automatically, it should do so slowly, typically at least 5-7 seconds and more if there is heavy copy.
The slider should have clear controls and should freeze with any interaction, including hovering.

Ecommerce guidelines on Search functionality for usability

When it comes to websites, especially transactional ones like ecommerce, users who perform a search tend to convert better. There are a few reasons for this. Some people know exactly what they’re looking for and prefer to search rather than browse. Others simply prefer using a search function.

An effective search feature offers two key benefits to users:

They can quickly and easily find what they’re looking for, without having to navigate through menus or categories.
It provides a way out of getting lost or stuck in dead ends while trying to find something.

Search is crucial because if users can’t find what they need, they’re likely to abandon the site. However, simply having a search bar isn’t enough. In usability tests, we’ve found that the best search designs are highly functional, providing efficient search, navigation, discoverability, and inspiration.

9 guidelines to create Ecommerce Search functionality for usability

The search bar should be easy to find and use. It should be prominently located, either in the center or top right of the page, and large enough for users to enter a moderately long search string.
Clearly label the search bar with the word “Search” or a similar term to ensure users know what it is for.
The search bar should be sticky, meaning it should remain visible as users scroll down the page, so they can search from anywhere.
Autocomplete capabilities should be included in the search bar to help users fix spelling mistakes and provide suggestions for related searches.
The search function should optimize itself to show the most relevant information and suggest similar or popular searches as users type in the search bar.
Users should be able to press the enter key to initiate the search instead of being required to click a separate search button.
Provide filtering or categories to help users narrow down or simplify their search.
Product images should be included in the search results to help users quickly identify what they are looking for.
Localize the search function to provide results in the user’s local language and terminology.

Ecommerce guidelines on Site speed for usability

In the world of websites, speed matters. While usability expert Jakob Nielsen suggests that people can handle up to a 10-second load time, statistics suggest that visitors have much less patience. Nearly half of all users expect a page to load in two seconds or less, and over half will abandon a page if it takes more than three seconds to load. When traffic is high, that number jumps to over 75%. Research also suggests that the tolerable waiting time for information retrieval is about two seconds, but adding feedback like a progress bar can increase this to 38 seconds.

Speed is not just a matter of convenience. A site that loads in three seconds has 22% fewer page views, a 50% higher bounce rate, and 22% fewer conversions than a site that loads in one second. And a site that loads in five seconds has 35% fewer page views, a 105% higher bounce rate, and 38% fewer conversions. As a result, improving site speed is an important part of conversion optimization. It’s often an easy fix that can quickly improve user experience and increase revenue. In short, faster sites get higher conversions, and site speed should be a priority for anyone looking to optimize their site for success.

11 guidelines for Ecommerce Site speed

Utilize a Content Delivery Network (CDN) for faster delivery of content.
Store your static files in the cloud with a CDN for faster access.
Install Google PageSpeed on your server to identify areas of improvement.
Request your hosting provider or system admin to install Memcached for faster performance.
Optimize your images to reduce file size and improve load time.
Use a fast web host, or host on your own servers, to improve site speed.
Minimize round-trip times (RTTs) to improve site responsiveness.
Implement caching to reduce server requests and improve load time.
Compress your website with gzip to reduce file size and improve load time.
Add an Expires header to enable browser caching for faster site access.
Disable unnecessary plugins or extras that slow down site performance.

Category landing page (CLP) ecommerce guidelines

Ecommerce Category landing page guidelines

Ecommerce guidelines on Category landing page (CLP) design

Category landing pages play an essential role in providing context to site visitors. These pages help users understand their location within the website and provide insights on what they can expect to find within a specific category.

For instance, if a customer is looking for a lamp shade on an ecommerce website, they may wonder if it falls under the “Housewares” category or if they should check out the “Furniture” subcategory or “Accessories.” The category landing page can answer these questions, making it easier for users to navigate and find the products they’re searching for.

However, it’s worth noting that not all ecommerce sites need category landing pages. If a website has only a few products, users can quickly find what they need without a dedicated category page. It’s similar to the difference between navigating a bustling city versus a small town – sometimes a map is necessary, while other times users can look around and find what they need easily.

4 guidelines for Ecommerce Category landing page design

Evaluate whether your ecommerce site needs a category landing page.
Use graphics and product thumbnails that represent the variety of products within the category on your landing page.
Ensure that product images on the category landing page link to their respective product pages.
Display popular filters and brands on the category landing page for easy access.

Ecommerce guidelines on Category page Hierarchy

Effective organization and navigation are essential components of any successful ecommerce website. When it comes to creating a category landing page (CLP), there are several factors to consider. Firstly, evaluate whether your site actually needs a CLP. If your website offers only a few products, it may be unnecessary. However, if your site offers a wide variety of products, a CLP can help users quickly locate what they’re looking for.

When designing your CLP, keep in mind that the graphics and product thumbnails should represent the breadth of the category. This will give users a clear idea of what they can expect to find within the category, making it easier for them to navigate the website. Additionally, make sure that the product images on the CLP lead to their corresponding product pages. This way, users can quickly find the product they’re interested in and make a purchase.

Another key consideration is the placement of category information. Ideally, users should be able to find the category information quickly and easily. Consider placing the category information at the top of the page, so users can see it without having to scroll down. By following these guidelines, you can create an effective CLP that helps users find what they’re looking for quickly and easily.

3 guidelines for Ecommerce Category landing page hierarchy

Decide whether your ecommerce site needs a deep or shallow category hierarchy.
Avoid making users search more than four levels deep into the hierarchy to find what they’re looking for.
Shallow parent categories can cause confusion for users, so it’s best to steer clear of them.

Ecommerce guidelines on Category page sub categories

An ecommerce website’s category landing page (CLP) is critical for providing users with a clear understanding of how products are categorized and organized. Subcategories play a crucial role in breaking down a broad category into smaller and more specific groups. The subcategories should be designed in a way that helps users locate the products they’re looking for quickly and easily.

When creating subcategories, it’s important to keep them organized and easy to navigate. For instance, don’t create too many subcategories, as it can become overwhelming and confusing for users. Moreover, subcategories should be named in a way that clearly describes the products that are found within them. Additionally, subcategories should be designed in a visually appealing manner and should be easily distinguishable from one another.

Overall, the creation and organization of subcategories is a vital aspect of designing an effective category landing page. By keeping the subcategories organized, easy to navigate, and visually appealing, users will be able to find the products they’re looking for quickly and easily.

5 guidelines for ecommerce Category page subcategories

To enhance the user experience, display a left-hand vertical list of subcategories and a grid view with thumbnails on the category page.
Incorporate thematic categories/subcategories such as seasonal, sale, and new arrivals to help users find the products they’re looking for.
Try to keep the number of subcategories per category to four or less to avoid overwhelming users.
When necessary, add subcategories under multiple categories to make it easier for users to locate a specific product.
Create an accessories subcategory for every category that has accessories to make it easier for users to find related products.

Ecommerce guidelines on Category name & copy

Accurate and precise naming of categories and subcategories is crucial in directing potential customers to the right products on your ecommerce site. A well-named category can help customers easily understand the types of products it contains and locate what they are looking for. On the other hand, a poorly named category can be confusing and lead to frustration for customers, causing them to leave your site.

To ensure that your category names are accurate and precise, it’s important to keep a few guidelines in mind. First, make sure the category name accurately represents the products it contains. Avoid using overly broad or vague names that don’t provide a clear indication of what customers will find in the category. Additionally, keep your category names consistent with your brand voice and messaging to ensure a cohesive user experience.

It’s also important to pay attention to the copy you use to describe your categories and subcategories. Use clear and concise language that accurately represents the products within each category. Avoid using jargon or overly complex terms that may confuse customers. By taking the time to carefully consider and craft your category names and copy, you can help ensure that customers have a positive and successful experience on your ecommerce site.

2 guidelines for ecommerce Category name & copy

Category names should accurately represent the products within them and avoid overlapping suggestions. For example, “lawn care” and “lawnmowers” should not be used as category names because they suggest overlapping products.
Category names should be common and descriptive, with clear language that is easy for customers to understand. Using more generic names such as “about us” instead of “company experience” can help to avoid confusion and make it easier for customers to find what they’re looking for.

Product lists (CLP) and search result page ecommerce guidelines

Product lists (CLP) and search result page guideline

Ecommerce guidelines for Search Result Page Design

To ensure a searcher finds the product that suits them, certain essential principles need to be followed. The search experience should be crafted in a way that swiftly guides them to the precise item they desire, with minimal complications. Research has shown that 73% of visitors will abandon a website within two minutes if they cannot locate what they are seeking.

The subsequent directives center on developing the layout of product lists and search results pages. They demonstrate which design to employ and how distinct visual formats may influence browsing behaviors.

Product list and search results page design hinges on the particulars. Though seemingly minor, these variances can result in substantial differences.

4 guidelines for ecommerce Search results page design

Consider the number of products to display per row when designing the product list page.
Ensure that the product list page design (grid or list) matches the type of product being presented.
Determine the most appropriate page design for your specific product list.
Display the total number of products in the list when it’s paginated to provide clarity to the user.

Ecommerce guidelines for product images in Search Results page

Most people don’t make a purchase without seeing and feeling the product, which is difficult to do online, except for web-based software. Therefore, compensating for this drawback requires putting in extra effort to bring products to life through exceptional photography and graphics.

The ensuing directives relate to product images on product lists and search results pages.

5 guidelines for ecommerce for product images in Search Results page

The product thumbnail should show the product in context, while the secondary thumbnail should reveal the product on its own.
Additional product pictures should be provided that appear on mouse hover or as a gallery slider. These pictures can show different variations of the product, different angles/facets, or hidden attributes.
Consider which product thumbnail would be more effective for the specific product at hand, whether it’s a photo of the product itself or of the product packaging.
Product packages should be captured straight on to capture all the small details on the package.
Taking product pictures at an angle is advisable if you want to capture the product’s physical depth.

Ecommerce guidelines for product information in Search Results page

The responsibility of providing information lies mainly with the product page, but product lists also play a crucial role.

To make an informed decision, people need to understand the differences between products. Whether they’re searching for a specific color or are on a budget, the product list is the first point of contact that provides basic information about the available items on the site.

Although preliminary, the product list uses essential product information to steer potential customers towards the most suitable product.

To create an informative product list that encourages users to click on products, it’s crucial to follow specific guidelines. These guidelines should include product comparison tools, easy browsing experience, provision of necessary information while avoiding cognitive overload.

8 guidelines for ecommerce for product information in Search Results page

Ensure that the product list design avoids pogo-sticking, where users must navigate back and forth between the list and product pages.
Communicate the variety of available products at the top of the product list.
Display only the most essential product attributes in the product list to avoid cognitive overload.
For combined categories such as “sofas and loveseats,” display both product types at the top of the list.
Display the price per unit for products sold in packages on the product list.
Communicate all variations of a product on the product list, such as “available in six more colors.”
Display compatibility information, such as “camera case fits camera model X,” in the product list.
Offer a product comparison tool to assist users in comparing various products.

Ecommerce guidelines on Trust elements in Search Results page

A recent study conducted by the Department of Commerce found that a significant proportion of American Internet users are hesitant to make purchases online due to concerns over privacy and security. The study revealed that half of the users surveyed were “deterred” by these fears. Furthermore, without any prompting, 84% of online households named at least one concern they had about online privacy and security risks, with 40% citing at least two different concerns.

The study also identified the most common reasons why people feel distrustful of online shopping. The top concern, at 43%, was news reports of information being stolen from retailers. In addition, 17% of participants cited having had their own personal information stolen as a reason for distrust, while 12% expressed doubts about the ability of stores to provide adequate customer service. Lastly, 10% of respondents had a general lack of trust in companies, employees, or technology.

Despite these concerns, the product page can be a valuable tool for building trust with potential customers. By sharing all the details about your products, including both good and bad aspects, you can foster a sense of transparency and trust. One effective strategy is to include features such as ratings and reviews, which can provide potential customers with valuable information about the product from other shoppers who have already purchased it.

By utilizing these tools, you can establish trust with your customers and mitigate their concerns about online privacy and security. This will ultimately lead to increased sales and a better online shopping experience for everyone involved.

4 guidelines for ecommerce for trust elements in Search Results page

Display customer reviews and ratings prominently on the product page.
Don’t shy away from including negative reviews alongside positive ones, as it can lend more authenticity to the reviews.
Provide sorting options for reviews such as by most recent, most helpful, highest rating, etc.
Include a feedback mechanism such as “Was this review helpful?” to help other customers find the most helpful reviews.

Ecommerce guidelines on using filters in Category pages and Search pages

When faced with too many choices, it becomes difficult for people to make a decision. The solution to this paradox of choice is to provide filters. The more options available, the better the filters should be.

For instance, consider the overwhelming selection of wines in a store. The lack of good filters in retail stores often leaves customers feeling lost and potentially opting for something simpler. Fortunately, online shopping allows for the implementation of effective filters that simplify the browsing process.

A good filter plays a crucial role in enabling customers to easily find the most suitable products. To create a helpful filter, it is important to understand what types of filters are most useful for your products. Additionally, designing the filtering tool for maximum usability is important to ensure a seamless user experience.

The following guidelines outline how to create an effective filtering system that enhances the customer experience. By providing customers with a user-friendly filtering tool, you can help them easily navigate the abundance of choices and find the perfect product for their needs.

18 guidelines for ecommerce on on using filters in Category pages and search pages

Offer filtering options to make finding the most suitable products easy.
Don’t confuse sorting and filters.
Choose highly relevant filters that depend on the product at hand.
Learn how people use your filters and adjust them accordingly.
Promote popular filters to the top of the list to improve usability.
Filters on the product list should be high in visual hierarchy to make them easily visible.
Filter values should have checkboxes to allow users to select more than one filter.
Show how many products apply to each filter choice in parentheses next to the filter choice.
Only display filter values that apply to what’s available to avoid confusion.
Offer themed filters such as a “fall sweaters” filter in a sweaters and jackets product list.
Offer a “clear all” option for filter selections to start over.
Filter tools should be sticky, especially for endless scrolling and “load more” product lists to keep them accessible.
Horizontal filter menu and vertical filter menu should have the same top alignment to avoid confusion.
A horizontal filtering bar at the top of the product list works best when there are only a few filtering options.
Collapse long filtering lists after around 10 filtering values, and clearly indicate that it’s collapsed with ‘see more’ text to avoid overwhelming users.
Each filter selection should be a separate action in browser history, so users can use the back button to easily navigate.
Auto-refresh search results after a filter has been selected (or deselected) to show the new results instantly.

Ecommerce guidelines on using sort in Category pages and Search pages

Sorting is an effective way to enhance the search process with a single click. Users can easily re-arrange a product list to suit their requirements. Whether they are on a budget and want to view the least expensive items first or are seeking the newest version of a product, the sorting tool enables individuals to quickly locate what they need.

However, because sorting is a widely used and essential tool, it is crucial to optimize it for maximum efficiency.

5 guidelines for ecommerce on on using sort in Category pages and search pages

Design sorting options as a dropdown box near the top of the page, labeled “Sort by” and follow convention.
When sorting a product list via customer ratings, take the number of ratings into account to provide more accurate results.
When sorting by price, offer sorting for both the item price and the price per unit to provide more flexibility.
For products where the original date is relevant, offer a sorting option based on the original date of production, publication, etc.
Use suggested scope and sorting options to help users navigate large product lists and find what they are looking for more easily.

Product page (PDP) ecommerce guidelines

Ecommerce Product page guidelines

Ecommerce guidelines on Product page (CLP) design

Often, when it comes to product pages, the ultimate goal of persuading people can get lost amidst a clinical approach. On many ecommerce sites, product pages are treated as just another part of the process. However, if the objective is to entice visitors to make a purchase, every aspect of the product page must be considered.

To achieve this, various elements need to be taken into account to create a compelling product page. This section mainly focuses on the design aspects of creating a persuasive product page.

The subsequent guidelines provide insight into how to craft an ideal and effective product page.

16 guidelines for Ecommerce product page design

Use a simple background (preferably white or grey) for product pictures.
Include a clear call-to-action button (such as “add to cart”) on the product page.
If you offer in-store pickup, add a “Find in store” button and explain how it works.
Provide a “wish list” or “favorites” button in addition to the “add to cart” button.
Display all possible product variations (such as sizes, colors, and models) on the product page.
Provide detailed product images that offer as much information as possible about the look and feel of the product (such as 3D views and zoom magnifiers).
Display products in accurate context and scale.
Clearly indicate when a product variation (such as size) is unavailable.
Offer an email notification system for out-of-stock items that come back in stock.
Include a link to a size guide on the product page (if applicable).
Ensure that color swatches are accurate.
Create a sense of urgency and/or scarcity to encourage purchases.
Consider adding product videos to the product page.
Present comparison information (such as dimensions and materials) for similar products in a visually similar format, so visitors can easily compare products.
For expensive products, display payment options.
Use social sharing on the “thank you page” rather than the product page for more effective sharing.

Ecommerce guidelines on Product page information for credibility

The importance of product page copy is a topic of debate. While it’s true that most online readers tend to skim through content, research suggests that product descriptions are still vital and can significantly impact consumer behavior.

Product page copy may not be as obvious as a hero image or a value proposition, but it plays a crucial role in the success of an eCommerce website. In fact, if you have a high volume of traffic, enhancing your product page copy could result in noticeable improvements.

According to a study conducted by the NN group, incomplete or unclear product information was responsible for 20% of overall task failures. This provides empirical evidence that reinforces the significance of well-crafted product page copy.

The following guidelines are intended to help you avoid these failures and create effective product descriptions.

8 guidelines for Ecommerce product page information

Avoid using generic manufacturer descriptions and create unique product descriptions that set your offerings apart.
Each sentence in the product description should provide buyers with new information that they may not have previously known. For example, instead of stating that a box of chocolates contains chocolate, provide details about the unique flavors and ingredients.
Analyze product reviews to identify what people enjoy most about your products and incorporate this feedback into your product descriptions.
Address any fears, uncertainties, and doubts that potential buyers may have about the product. Identify these concerns and provide information that helps to alleviate them.
Write product descriptions in a style that resonates with your target audience. Use language and tone that they will find engaging and compelling.
Highlight both the features and benefits of the product. Explain how the product works and how it can help the buyer.
Use specific language to make your product descriptions more persuasive. For example, instead of saying a product is a “good value,” highlight specific awards or accolades it has received.
Consider promoting a “cause” or mission with your product descriptions to make them more altruistic and appealing to socially conscious buyers.

Ecommerce guidelines for Shipping & Returns on PDP

The significance of shipping and return policies in online purchase decisions cannot be overstated. Customers are more likely to abandon a website that doesn’t provide clear shipping and return information.

Therefore, it is essential to ensure that your shipping and return policies are prominently displayed and easy to find. If customers cannot easily locate this information, they are likely to leave your website and look for another that provides this information upfront.

To address this issue, the following guidelines outline how to communicate your shipping and return policies in a clear and user-friendly manner.

2 guidelines for Ecommerce on Shipping & returns

Display your shipping and return policies prominently on the product page, preferably in a section that is easy to locate.
Provide customers with estimated shipping times to set accurate expectations for delivery. This information can be displayed on the product page or during the checkout process.

Ecommerce guidelines for Trust elements on PDP

A recent research by the Department of Commerce found that half of US Internet users are reluctant to make online purchases because of privacy and security concerns. In fact, 84% of Internet families reported having at least one concern about the privacy and security dangers associated with the internet, and 40% reported having two or more.

The top four reasons for distrust among online shoppers include: news reports of information being stolen from retailers (43%), personal information being stolen (17%), lack of confidence in the store’s ability to provide good customer service (12%), and a general distrust of companies, employees, or technology (10%).

To combat these concerns and build trust with potential customers, product pages should prioritize transparency and honesty. One effective strategy is to include ratings and reviews, which provide valuable insight and feedback from previous customers. Sharing both positive and negative details about your products can also foster a sense of transparency and trust. By leveraging these strategies, you can help alleviate privacy and security concerns and increase customer confidence in your brand.

4 ecommerce guidelines for Trust elements on PDP

Display customer reviews and ratings prominently on the product page.
Do not shy away from including a few negative reviews among positive ones.
Provide sorting options for reviews to allow customers to find the most helpful ones.
Include a “Was this review helpful?” button to enable customers to provide feedback on the usefulness of reviews.

Ecommerce guidelines for Product page navigation

On a product page, breadcrumb navigation can offer users a search history that they can engage with. By referring to the breadcrumbs, users can recall their path of navigation to reach their current location on the website. Furthermore, they can simply click on the breadcrumbs to return to a previous page.

The following two guidelines will elaborate on how to create effective and user-friendly breadcrumbs on the product page.

2 ecommerce guidelines for Product page navigation

Place breadcrumbs near the top of the page following convention.
Offer hierarchy-based breadcrumb links on the product page.

The use of accessories, recommended items, and related products can lead to increased profits if integrated effectively. By offering complementary products that enhance the primary purchase or simply add convenience to the shopping experience, users may be more likely to make additional purchases.

These guidelines aim to demonstrate the benefits of incorporating accessories, recommendations, and related products into product pages, and provide tips on how to do so successfully.

6 Ecommerce guidelines for Accessories & related products

Provide recommended or similar products on the product page.
Include accessories and add-ons on the product page.
Link other products to their respective product pages.
Ensure that similar products, recommended products, and accessories/add-ons are displayed in separate and distinct areas of the product page.
Display “recently viewed items” to help users easily find previously viewed products.
Provide users with the option to clear or disable “recently viewed items” for privacy or personalization purposes.

Citations & References

Harley, A. (2018, August 12). UX Guidelines for Ecommerce Homepages, Category Pages, and Product Listing Pages. Nielsen Norman Group. https://www.nngroup.com/articles/ecommerce-homepages-listing-pages/
CXL. (2021). Ecommerce Best Practices in 2021. Retrieved from https://cxl.com/ecommerce-best-practices/
Holst, Christian. “An E-Commerce Study: Guidelines For Better Navigation And Categories.” Smashing Magazine, 11 Nov. 2013, https://www.smashingmagazine.com/2013/11/guidelines-navigation-categories-ecommerce-study/.
Hong, W., Thong, J. Y., & Tam, K. Y. (2004). Designing product listing pages on e-commerce websites: an examination of presentation mode and information format. International Journal of Human-Computer Studies, 61(4), 481-503. https://www.sciencedirect.com/science/article/abs/pii/S107158190400014X