# Footer Design for Ecommerce > Design an ecommerce footer shoppers can actually use: what to include, five footer patterns, link structure, mobile and accessibility, and what breaks footers. - Type: Pattern guide - Level: Intermediate - Reading time: About 21 minutes - Audience: Written for store owners, builders, and designers refining high-performance ecommerce stores. - Last updated: 2026-10-30 - Canonical page: https://academy.getzenbasket.com/patterns/footer-section/ - Part of: [Pattern library](https://academy.getzenbasket.com/patterns/) on ZenBasket Academy --- ## 1. Why people scroll to the footer There are two reasons people reach a footer: - They **did not find what they wanted higher up,** so the footer is a second chance, or a last resort for content missing from the main navigation. - They **scroll there deliberately,** expecting contact details, company information or help. Some also use it as navigation simply because they are already at the bottom. For a store, the deliberate visit matters most. Many notices a footer never gets in the way of people whose needs were met higher up, so it is nearly cost-free as long as it doesn't become so bloated that it slows the page. **Try the four-question test.** Tell someone: "You are about to pay this store. Using only the footer, find how to contact them, the returns policy, how long delivery takes, and where to track an order." Time it. Anything not found in under a minute is missing, mislabelled or buried. --- --- ## 2. What an ecommerce footer holds For a store, that layer extends to buying, not just company information. | Element | Why it is there | The rule | |---|---|---| | Contact | Proves a person is reachable | Phone, email and, if you have one, a physical address and hours. A form alone is weaker than a number. Say how fast you reply. | | Order help | Answers "where is my order" without an email | Track order, shipping and delivery, returns and refunds, cancellations. Name them separately; they are four questions. | | Policies | The checks a cautious buyer makes before paying | Privacy, terms, and returns as its own link. Every one must open a real, current page. | | Business details | Shows who is behind the store | Legal name and registered address. Some markets expect specific details, for example India's e-commerce rules on grievance officer contact; confirm what applies to you. | | Payment methods | Shows how they can pay, and that it is ordinary | Real methods you accept, as recognisable marks with text alternatives. Not generic "secure" badges. | | Cookie preferences | Lets people change a consent choice | A persistent link, not a one-time banner. Confirm requirements per market. | | Shop links | Second chance to be routed | Main categories only (see [sections 3](#3-five-footer-patterns) and [4](#4-structure-and-link-names)). | | Sign-up and social | Lets interested people stay in touch | One email field or link. Social links only to accounts you keep active. | | Copyright line | States ownership | One line, current year, at the very bottom. Housekeeping, not content. | Testimonials and awards can sit in a footer. This is for startups and lesser-known brands, warning that too many can read as a business that has to prove itself. Embedded social feeds only earn their weight for visual brands that post often; otherwise a plain link works better. --- --- ## 3. Five footer patterns ```text +------------------------------------------------------------+ | SHOP ORDER HELP COMPANY CONTACT | | Women Track order About us +91 00000 00000 | | Men Shipping Our makers help@store.com | | Home Returns Stockists Mon-Sat 10-6 | | Sale Cancellations Privacy [ Email ] [ Go ] | | Terms social icons | +------------------------------------------------------------+ | UPI · Visa · Mastercard · COD | | Store Pvt Ltd, registered address · Cookie preferences · © | +------------------------------------------------------------+ ``` Every store needs a Utility footer, and the other four patterns are additions you make depending on your catalogue, your pages and your audience. **Utility footer.** A utility footer holds contact details, order help, policies, payment marks and a copyright line, and nothing else. Every site needs this layer, so for many small stores it is the whole footer. It works best when the catalogue is small and the header already routes people well. It falls short on a large catalogue, because shoppers at the bottom of a long page have no route back into the site. **Doormat footer.** A doormat footer repeats the main navigation at the bottom of the page, so it is the first thing seen on arrival and the last on leaving. It is a good fit for long pages where the global navigation is out of reach, such as category pages with load-more, long product pages and most mobile layouts. It costs very little if you keep it to top-level categories, but it should never be the only navigation content in the footer, because people still need the utility layer beside it. **Site-map footer.** A site-map footer shows top-level categories plus a few selected second-level ones, exposing topics the menu doesn't make obvious. It helps when a broad catalogue has valuable subcategories the header can't show, or when shoppers often arrive deep in the site. A full site map belongs in the footer only for sites of roughly 25 pages or fewer, and larger sites should link to a separate site-map page instead. If it lists everything, it becomes a wall of links past two levels, and nobody scans it. **Engagement footer.** An engagement footer places a sign-up prompt and social links, sometimes with a feed, above the utility layer. People do go to the footer for coupons, promotions and updates, so this is a legitimate use. It works when you send email people actually want, or when your brand is visual and posts regularly. It backfires when it pushes the utility links down or the feed looks stale, and a feed script can also slow the page. **Mini footer for endless pages.** If a listing loads more products as you scroll, there is no bottom to reach, and the footer never appears. The result is a game of "whack-a-mole", with links disappearing below the fold. The fix is to move footer content to a sticky mini footer in a side rail, or into an expanded global navigation. Using a load-more button is often the cheapest fix, because it gives you a real footer again and saves you maintaining a second footer design. **Combining them.** Most stores want the Utility footer plus a Doormat or a short Site-map, and the Engagement strip only if it earns its height. Footers can also vary by who is viewing, which suits stores with separate shopper and trade audiences. Most other stores don't need that. ![footer 1](https://bloggallery.s3.us-west-2.amazonaws.com/Zenbasket%20Docs/footer%201_1791278001445.png) --- --- ## 4. Structure and link names A footer's search value comes from being clear and complete, not from keyword stuffing. It gives crawlers an easy route to your main pages, but fifty near-identical category links dilute every one of them for shoppers, the audience it was built for. Surface the pages worth surfacing; leave the rest to navigation and a site-map page. - **Two levels at most.** "if everything is important, nothing is important". Link the one lower-level page that matters; don't mirror the tree. - **Group under headings.** Unstructured footers become dumping grounds. Bold column headings, normal-weight links. - **Use the conventional word.** "Contact us" beats "Company info"; "Returns" beats "Help". Vague labels like "Resources" are a leftover from older footers; card-sort or test when unsure. - **One link, one job.** "Shipping & returns" hides two questions; shoppers wanting a refund won't look under shipping. - **Order by need, not org chart.** Order help comes before "About us". Careers and press go last: secondary tasks that suit a footer because they aren't for most visitors. - **Same everywhere.** Consistent, predictable and easy to find. Don't vary it page to page without a real reason. ![footer 2](https://bloggallery.s3.us-west-2.amazonaws.com/Zenbasket%20Docs/footer%202_1791278031866.png) --- --- ## 5. Mobile, accessibility and speed **Mobile.** Don't hide or collapse the footer; "people expect it to be there". A four-column footer does become a very long list, so as a judgement call (not a research finding): keep contact, order help and policies fully visible as plain lists, and collapse only the long shop-category list under a visible heading with an unmistakable expand control. **Accessibility.** - **Legible text:** readable size, 4.5:1 contrast (WCAG 2.2 AA), no decorative fonts. Tiny, low-contrast text. - **Landmark:** a real `