Skip to product menu
close
  • Recent Launches
    Press Space or Enter to display list of options
EXPLORE ALL PRODUCTS

Recent Launches

New

Payroll software with automated tax payments and filing.

Try now
New

Robotic process automation software to automate high-volume, rule-based tasks.

Try for free
New

Low-code IoT platform and solutions for connected businesses.

Try now
New

Business formation service to launch and grow your businesses.

Try now
New

Privacy-friendly application analytics solution.

Try for free

Sales

 
CRM

Comprehensive CRM platform for customer-facing teams.

CRM
 
Bigin

Simple CRM for small businesses moving from spreadsheets.

Bigin
 
Forms

Build online forms for every business need.

Forms
 
SalesIQ

Live chat app to engage and convert website visitors.

SalesIQ
 
Bookings

Appointment scheduling app for consultations with customers.

Bookings
 
Sign

Digital signature app for businesses.

Sign
 
RouteIQ

Comprehensive sales map visualization and optimal route planning solution.

RouteIQ
 
Thrive

Complete loyalty and affiliate management platform.

Thrive
 
Voice

Cloud Contact Center Software for businesses.

Voice
 
Suites
CRM Plus

Unified platform to deliver top-notch customer experience.

CRM Plus

Marketing

 
Social

All-in-one social media management software.

Social
 
Campaigns

Create, send, and track targeted email campaigns that drive sales.

Campaigns
 
Forms

Build online forms for every business need.

Forms
 
Survey

Design surveys to reach and interact with your audience.

Survey
 
Sites

Online website builder with extensive customisation options.

Sites
 
PageSense

Website conversion optimization and personalisation platform.

PageSense
 
Backstage

End-to-end event management software.

Backstage
 
Webinar

Webinar platform for webcasting online webinars.

Webinar
 
Marketing Automation

All-in-one marketing automation software.

Marketing Automation
 
LandingPage

Smart landing page builder to increase conversion rates

LandingPage
 
Publish

Manage all your local business listings on a single platform.

Publish
 
SalesIQ

Live chat app to engage and convert website visitors.

SalesIQ
 
Sign

Digital signature app for businesses.

Sign
 
Thrive

Complete loyalty and affiliate management platform.

Thrive
 
Voice

Cloud Contact Center Software for businesses.

Voice
 
NEW
LeadChain

Sync, manage, and convert leads across channels seamlessly.

LeadChain
 
NEW
CommunitySpaces

Online community platform for individuals and businesses to grow their network and brand.

CommunitySpaces
 
Suites
Marketing Plus

Unified marketing platform for marketing teams.

Marketing Plus

Commerce and POS

 
Commerce

eCommerce platform to manage and market your online store.

Commerce

Service

 
Desk

Helpdesk software to deliver great customer support.

Desk
 
Assist

Remote support and unattended remote access software.

Assist
 
Lens

Interactive remote assistance software with augmented reality.

Lens
 
FSM

End-to-end field service management platform for service businesses.

FSM
 
SalesIQ

Live chat app to engage and convert website visitors.

SalesIQ
 
Voice

Cloud Contact Center Software for businesses.

Voice
 
NEW
Solo

The all-in-one toolkit for solopreneurs.

Solo
 
Bookings

Appointment scheduling app for consultations with customers.

Bookings
 
Suites
Service Plus

Unified platform for customer service and support teams.

Service Plus

Finance

 
Books

Powerful accounting platform for growing businesses.

Books
 
FREE
Invoice

100% Free invoicing solution.

Invoice
 
Expense

Effortless expense reporting platform.

Expense
 
Inventory

Powerful stock management and inventory control software.

Inventory
 
Billing

End-to-end billing solution for your business.

Billing
 
Checkout

Collect payments online with custom branded pages.

Checkout
 
NEW
Payroll

Payroll software with automated tax payments and filing.

Payroll
 
NEW
Solo

The all-in-one toolkit for solopreneurs.

Solo
 
Practice

Practice management software for accounting firms.

Practice
 
Sign

Digital signature app for businesses.

Sign
 
Commerce

eCommerce platform to manage and market your online store.

Commerce
 
Suites
Finance Plus

All-in-one suite to manage your operations and finances.

Finance Plus

Email and Collaboration

 
Mail

Secure email service for teams of all sizes.

Mail
 
Meeting

Online meeting software for all your video conferencing & webinar needs.

Meeting
 
Writer

Word processor for focused writing and discussions.

Writer
 
Sheet

Spreadsheet software for collaborative teams.

Sheet
 
Show

Create, edit, and share slides with a sleek presentation app.

Show
 
Notebook

Beautiful home for all your notes.

Notebook
 
Cliq

Stay in touch with teams no matter where you are.

Cliq
 
Connect

Employee experience platform to communicate, engage, and build positive employee relations.

Connect
 
Bookings

Appointment scheduling app for consultations with customers.

Bookings
 
TeamInbox

Shared inboxes for teams.

TeamInbox
 
WorkDrive

Online file management for teams.

WorkDrive
 
Sign

Digital signature app for businesses.

Sign
 
Office Suite

Powerful collaborative work platform for teams.

Office Suite
 
Office Integrator

Built in document editors for web apps.

Office Integrator
 
ZeptoMail

Secure and reliable transactional email sending service.

ZeptoMail
 
Calendar

Online business calendar to manage events and schedule appointments.

Calendar
 
Learn

Knowledge and learning management platform.

Learn
 
Voice

Cloud Contact Center Software for businesses.

Voice
 
ToDo

Collaborative task management for individuals and teams.

ToDo
 
Tables

Work management tool to connect people, processes, and information.

Tables
 
FREE
PDF Editor

Collaborative online PDF editing tool.

PDF Editor
 
Suites
Workplace

Application suite built to improve team productivity and collaboration.

Workplace

Human Resources

 
People

Organize, automate, and simplify your HR processes.

People
 
Recruit

Intuitive recruiting platform built to provide hiring solutions.

Recruit
 
Expense

Effortless expense reporting platform.

Expense
 
Workerly

Manage temporary staffing with an employee scheduling solution.

Workerly
 
NEW
Payroll

Payroll software with automated tax payments and filing.

Payroll
 
Shifts

Employee scheduling and time tracking app.

Shifts
 
Sign

Digital signature app for businesses.

Sign
 
Suites
People Plus

Comprehensive HR platform for seamless employee experiences.

People Plus

Security and IT Management

 
Creator

Build custom apps to simplify business processes.

Creator
 
Directory

Workforce identity and access management solution for cloud businesses.

Directory
 
FREE
OneAuth

Secure multi-factor authenticator (MFA) for all your online accounts.

OneAuth
 
Vault

Online password manager for teams.

Vault
 
Catalyst

Pro-code platform to build and deploy your apps.

Catalyst
 
Toolkit

Complete resource for any admin-related lookup queries.

Toolkit
 
Lens

Interactive remote assistance software with augmented reality.

Lens
 
Assist

Remote support and unattended remote access software.

Assist
 
QEngine

Test automation software to build, manage, execute, and report testcases.

QEngine
 
NEW
RPA

Automate manual, tedious, and repetitive tasks easily.

RPA

BI and Analytics

 
Analytics

Modern self-service BI and analytics platform.

Analytics
 
Embedded BI

Embedded analytics and white label BI solutions, tailored for your needs.

Embedded BI
 
DataPrep

AI-powered data preparation service for your data-driven organization.

DataPrep
 
NEW
IoT

Harnessing IoT analytics for real-time operational intelligence.

IoT

Project Management

 
Projects

Manage, track, and collaborate on projects with teams.

Projects
 
Sprints

Planning and tracking tool for scrum teams.

Sprints
 
BugTracker

Automatic bug tracking software for managing bugs.

BugTracker
 
NEW
Solo

The all-in-one toolkit for solopreneurs.

Solo

Developer Platforms

 
Creator

Build custom apps to simplify business processes.

Creator
 
Flow

Automate business workflows by creating smart integrations.

Flow
 
Catalyst

Pro-code platform to build and deploy your apps.

Catalyst
 
Office Integrator

Built in document editors for web apps.

Office Integrator
 
ZeptoMail

Secure and reliable transactional email sending service.

ZeptoMail
 
QEngine

Test automation software to build, manage, execute, and report testcases.

QEngine
 
Tables

Work management tool to connect people, processes, and information.

Tables
 
NEW
RPA

Automate manual, tedious, and repetitive tasks easily.

RPA
 
NEW
Apptics

Application analytics for all apps.

Apptics
 
Embedded BI

Embedded analytics and white label BI solutions, tailored for your needs.

Embedded BI
 
NEW
IoT

Build, deploy, and scale IoT solutions for connected businesses.

IoT
 
DataPrep

AI-powered data preparation service for your data-driven organization.

DataPrep

IoT

 
NEW
IoT

Low-code IoT platform and solutions for connected businesses.

IoT

Search Result

 
CRM Plus

Unified platform to deliver top-notch customer experience.

Try now
CRM Plus
 
Service Plus

Unified platform for customer service and support teams.

Try now
Service Plus
 
Finance Plus

All-in-one suite to manage your operations and finances.

Try now
Finance Plus
 
People Plus

Comprehensive HR platform for seamless employee experiences.

Try now
People Plus
 
Workplace

Application suite built to improve team productivity and collaboration.

Try now
Workplace
 
Marketing Plus

Unified marketing platform for marketing teams.

Try now
Marketing Plus
 
All-in-one suite

Zoho One

The Operating System for Business

Run your entire business on Zoho with our unified cloud software, designed to help you break down silos between departments and increase organizational efficiency.

TRY ZOHO ONE
Zoho One
Zoho Marketplace

With over 2000 ready-to-use extensions across 40+ categories, connect your favorite business tools with the Zoho products you already use.

EXPLORE MARKETPLACE
Marketplace
Skip to main content
Zoho Academy

Best Practices for a Great Online Shop Homepage

  • 12 Mins Read
  • Posted on June 6, 2019
  • Last Updated on October 8, 2024
  • By Lauren

Think about the last time you walked past the window of a brick-and-mortar store, stopped in your tracks on the sidewalk, and then walked through that business’s front door—despite the fact that you were in the midst of running another errand entirely.

That’s the kind of response you want your site visitors to have when they land on your online shop homepage. So really, think about it: Was it the way a particular product was positioned? Was it the way two products were juxtaposed, suggesting that the store could offer you something in the way of a curated shopping experience? Was it the text on that sale sign in the window (urgent language, exclamation points)?

Your online shop homepage is an analogue to that store window… except your prospects may decide whether or not they’re interested in your online offering in even less time (50 milliseconds or less) than it would take them to walk past a storefront. What’s more, if they decide to stay past that initial glance, you’ve got to offer them awesome homepage UX to move them into the next stage of their visit. Of course, not all visitors will enter your ecommerce site through your homepage. But for those who do? You’ll need to effectively introduce your business and your online offering by simply and concisely explaining what you sell and how you’re different from the competition. And you’ll need to give every user persona the obvious next step for their journey.

So it’s time to play the make-your-best-virtual-storefront game. Here’s how:

Prioritize imagery… but sparingly

We’ll just go ahead and say it: The most important components of your ecommerce homepage are the high-quality images you use. (Indeed, that’s why we’ve written an entire ebook on product photography for you.)

Prospects won’t have the benefit of picking up, handling, and closely examining the products you offer. This can be a big disadvantage for digital stores because, as studies have shown, simply touching an object increases the sense of “perceived ownership,” which is a crucial step toward purchase.

Since they can’t physically interact with your products as they would in a store, the best alternatives you can offer prospects are high-quality product images that communicate the value of what you have to offer.

Nostalgic Bulbs offers stunning product photography above the fold of its homepage:

We understand the impulse to show every product you sell on your homepage. You’re proud of your offerings, after all, and you want your visitors to see the full range of products available to them.

But remember: Your homepage is your virtual storefront. It’s where new visitors who are unfamiliar with your product offering will be “window shopping”; and you only have so much space to show them your best product and draw them in. Don’t overwhelm your visitors with images; it’ll only lead to confusion and low conversion rates. Instead, just give your newest or best-selling products the place of honor in that portion above the fold. If you design your “storefront” well, visitors will walk through that front door to see what other products you have to offer.

Alongside our ebook on product photography, you might want to take a look at our content on homepage imagery. After all, your product page images are a different animal than your homepage images will be.

Categorize intuitively

Keep the area below the fold as minimal as the area above it. You can do this by categorizing your products intuitively, with a single title and no more than a few images for each category. Shoppers will understand that those images represent a broader group; they’ll click in if that’s the kind of item they’re looking for. By “intuitive,” we mean you’ve got to know how your prospects would categorize the products you sell. You also need to know what they would call those categories. (The keyword research you did for your product pages should help with this.)

Milk Makeup displays its categories beautifully. When a visitor first arrives on Milk’s site, they’re presented with the company’s newest, most “exclusive” product above the fold, and then its “Best Sellers” and “Award Winners.” (Note that Milk’s main navigation is static and perpetually available to visitors as they scroll):

But for site visitors who know more specifically what they’re looking for, and don’t need to browse categories, Milk offers a variety of other categories—including “Makeup,” “Skincare,” and “Sets.” Here’s how simply their “Makeup” category breaks down:

The category images evoke the breadth of Milk’s product offering, but they don’t show everything in that category. That’s what prospects click into “All” for.

Klean Kanteen displays their categories simply, in a horizontal menu that the visitor can take in at a glance, without having to scroll. Notice the company chose only one product to represent the entire category, rather than Milk’s three:

Klean Kanteen offers clear category distinctions with lots of white space, sharp images, easy navigation, and a sense of the range of products on the other side of the links. Combined, these things are a recipe for excellent homepage UX.

You’ll decide—depending on the range of products you offer, and then through A/B testing—how to divide your categories and how to position them on your site. Milk and Klean Kanteen are just two examples to show you the range of possibility when it comes to category presentation.

Optimize your navigation bar

Your categories will help move prospects through that sales funnel. So will a prominent, simplified, intuitive navigation bar. Just remember: Your navigation bar isn’t specific to your homepage. It should allow visitors who land on any page of your site to navigate to where they want to go. So while we’re considering your homepage here, your mantra should be: “Provide a high-level overview for visitors on all pages.”

Make your parent categories simple, yet sufficient. The case study of the watch company Saat & Saat is worth considering: It increased conversions by 62.5% by changing the options on its menu from “Watches” to “Men’s Watches,” “Women’s Watches,” and “Children’s Watches.” You can imagine why this is the case: When it comes to products like watches, consumers typically search by gender when they’re shopping online. Of course, what they don’t search for is “products”; so don’t make this one of your parent categories! Call your products what they are.

The best way to keep your navigation simple is to have a set of broad parent categories, each with their own subcategories. (Subcategories don’t have to be confined to a single parent category.) Your parent categories should be bold and stand out above the fold of your homepage. Don’t offer more than 7 of them; more options will only debilitate visitors, keeping them from clicking on any of them. And while we’re at it, play around with item order: Visitors will subconsciously assume the items that appear first and last indicate importance; so if there’s a category page you want users to click into, try those positions.

For best UX, make the navigation menu persistent (this is called “sticky navigation”), and have subcategories appear when users hover over each parent category. MTC Kitchen offers two levels of subcategories—all of which are sorted in a simple, clean system:

Of course, your main navigation doesn’t have to be positioned horizontally at the top of the page—though 88% of websites choose this strategy, so it’s not a bad idea to stick with convention. You might consider a vertical navigation menu, with the items running down the left side of the page (if you’re using Zoho Commerce, look for “Header Style” in the visual editor); and it’s a best practice to offer a hamburger menu for mobile users. And of course, you’ve got a second “navigation menu” to consider in your footer, where you’ll keep your shipping policy, Returns & Refunds policy, privacy policy, Terms & Conditions, contact information, and social buttons.

Pro tip: If you offer items in your navigation menu that aren’t product categories (“Contact Us” or “About Us,” for example), give them a different visual treatment so that visitors know they’re there for a different purpose.

Include a prominent (and persistent) search box

Regardless of how simple and intuitive the navigation menu is, a search function is a must for any online store that offers a range of products. After all, your navigation serves the “browsers” best; but you should offer something for those shoppers who arrive on your site knowing exactly what they’re looking for. According to Econsultancy, up to 30% of your visitors will use your site’s search box. These are visitors with an intent to purchase: They’re not simply browsing; they’re on a mission for something specific… and they have no desire to navigate between categories to find it. You want the least possible amount of friction here: Let returning customers get to the product they know they want as quickly as possible.

Like your navigation bar, your search bar should be prominent (standing out above the fold) and persistent (following your visitor as they scroll).

Pro tip: Never serve up a “No Results” page! Instead, give visitors other options (suggested categories, for example), or a way to get in touch with you right away (“Can’t find what you’re looking for? Contact us at xxx-xxx-xxxx”).

Include a promotional area for sales, deals, and specials

Below are the current above-the-fold elements for UNIQLO and Cabela’s:

You’ll note that at the top of UNIQLO’s homepage is a banner announcing free FedEx shipping. And it’s hard to miss that Coleman is having a 4th of July sale—60% off is no small discount. (Note, too, how there’s a sense of urgency in the messaging for both businesses: Uniqlo’s free shipping is “for a limited time”; Cabela’s urgency is more subtle; but the fact that it’s a holiday sale makes it necessarily temporary.)

The point is that your ecommerce homepage—specifically that real estate above the fold—should be where you promote your specials, offers, and sales. According to Statista, 64% of online shoppers will wait for items to go on sale before making a purchase. So give those shoppers what they’re waiting for—and say it loudly.

You’ll also notice that UNIQLO has a standout “Sale” item on their navigation menu. We all get excited by different kinds of promotions; and showing all the ways your prospects can save money on a single page (free shipping, discounted items, promotions, and so on) will ensure that you hit every sweet spot.

It’ll also make the bargain-hunters (those who head first toward that discount rack at the retail store) feel seen and heard, and thus particularly attached to you.

Have “Best-Sellers” and “New Arrivals” sections

Best-sellers are a form of social proof: Many of your prospects won’t believe in the quality of your products until they see that others have been willing to invest in them. A “Popular Products” section is a way of putting your best foot forward. It may also cause your prospects to linger on your site a little longer.

While your “Best-Sellers” section might cater more toward prospects, a “New Arrivals” section gratifies your regular customers—the ones who are waiting on edge for your next offering. While those new products should also be placed in their respective product categories, highlighting them this way keeps your repeat customers engaged… and keeps them checking back regularly to see what’s new in your store.

Birchbox has separate links for its new arrivals (“What’s New”) and best-sellers, as well as one for its sale items. (You can tell by the company’s color choice that the “Sale” link is the one Birchbox most wants its visitors to click on). They also currently have a separate slider image on their homepage for best-sellers:

Regardless of where on the page you decide to place your best-sellers, new arrivals, sales, and deals, do make sure they’re prominent on your homepage. Denying your prospects and customers this information would be the equivalent of posting a “Sale!” sign at the back of your store, where only the customers who entered would see it.

Shout out your value proposition

Your value proposition is your competitive advantage. When it comes to an online shop homepage, your value proposition may be about the materials your products are made of, how (and by whom) they’re made, what unique benefits they offer, or the ethical vision that prompted you to produce them.

Your value proposition is so much more than the “common values” many businesses offer in the way of fast shipping and money-back guarantees. (Though you should offer these! Especially because they’re standard fare by now.)

Here’s the value proposition from M-24, a company that recycles truck tarpaulins and car seatbelts into durable bags:

What makes M-24’s bags different from other bags is their singularity. In other words, M-24 appeals to their prospects’ desire for individuality in their value proposition.

And here’s what’s below the fold of Shwood’s homepage:

“The original wood sunglasses” is Shwood’s crisp, one-line value proposition; but they follow it up with detail here. Phrases like “wandered the globe,” “finest natural materials,” and “the perfect blend of style and sustainability” help Shwood highlight what sets them apart from other sunglass manufacturers: Not only is Shwood the original, they’re also the most conscientious when it comes to their process. We couldn’t help but click on “Our Story,” where their value proposition is extended—and further strengthened:

Your value proposition should be placed prominently on your homepage. Don’t make your prospects do the work to discover what makes you better than the competition! (Here’s a tip: They probably won’t.) Rather, let them know as soon as they click into your homepage what value you offer, and why they shouldn’t bounce and head to your competitor. That’s good UX.

Be clear about your (ideally free) shipping and returns policies

Your value proposition should be placed above the fold. And if your shipping and returns are free, that should be shouted out above the fold, too.

Either way, tell your visitors the truth about your shipping costs and return policy up front. Don’t make them wait until checkout to discover any hard truths. Many customers will want to know how quickly they can have items delivered and whether their packages can be tracked; your (honest) answer will play a considerable role in their purchase decision.

If it’s possible for you to offer free shipping, do so. (You’ll probably need to factor shipping costs into your product price or set a purchase amount threshold for your customer, but they’ll think these trade-offs are well worth it. Or take a look at these other ways to offset free shipping.)

Pro tip: Transparency is a winning strategy, so we also suggest that you display your payment methods upfront. Consider having this information on your homepage, rather than making customers wait until checkout to learn if you take MasterCard or PayPal.

According to industry research from 2016, unexpected shipping costs are the primary cause of cart abandonment. (Other studies reinforce this, though with varying numbers.) None of us likes to get hit with unexpected shipping fees at the end of a checkout: We feel like we’ve been deceived. Free shipping, on the other hand, is like having your cake and eating it too. It’s bound to decrease your cart abandonments and increase your conversions.

If you have a return policy, spell out how much time the customer has to make the return (30 days, 90 days, etc.), as well as what the return cost is. Our tip? Again, free is best. When your customers see that returns are free, it reduces their risk of purchase, and will increase your conversions.

Miguel Antoinne tells its visitors right away that U.S. shipping and returns are free:

If you do offer free shipping and returns, don’t just say it loudly on your site’s homepage. Remind prospects again on each of your individual product pages. (Likewise if you offer same-day delivery.) Free shipping and same-day delivery are both unique selling points (USPs) worth shouting about.

 

With these best practices, you’ll be off to a brilliant start when it comes to homepage UX on your ecommerce site.

 

In the next section, we discuss the most important design elements of your product pages, including images and videos, CTAs, and social sharing buttons. Learn how to display each of your products in all its glory (that’s good UX, too!), and how to increase conversions through product page design.

Related Topics

Zoho products mentioned on this page: