The site-wide pre-header
A great place where to introduce information about delivery, returns, and unique selling points! Make sure the Return policy is clear, visible, and friendly.
The site header with branding, auto-suggest search, support contacts, and main navigation
Take a look at the examples by Wunderfront. For mobile, it is essential to keep the search input open, navigation, and cart quickly accessible, and branding concise. Try also bottom navigation on mobile! Be thumb-friendly and boost conversions!
The clear page title with an option to return to the previous view
Clearly indicate the page the user is on and enable the user to return to the previous screen easily.
The order basics
On the very top, show the order ID, date of order, link to returns information or form, and tracking information (if you provide it on-site).
The ordered products
Show the total amount of products ordered. Show all products from top to bottom (thumbnail, title, variations, price/savings/discount, quantity, brand). And enable users to add items to the cart with one tap.
The delivery summary
Show a card that summarizes the delivery details, such as the method chosen, price, address or pickup point, and contact details.
The payment summary
Show a card that summarizes the payment method selected and used.
The order summary
Show order totals, such as total paid, discount/savings, delivery costs, and taxes.
The help section
Provide a link to the help and FAQ section, as some users might have questions, which helps ease the stress on your customer support.
The cancel order section
Enable users to cancel the order if possible, or as a bare minimum, enable them to start the cancellation process by submitting a request via a form.
The recently viewed products
Help the returning visitors become visitors much faster, and also consider moving this section below the Hero campaign banners for returning users (on homepage)! This an amazing opportunity to take the user to the checkout!
The pre-footer: The bottom benefits
Visually and textually remind site-wide why shop with you. Keep it super short and have 3-5 benefits visualized and communicated.
The pre-footer: The payment options
Showcase different options people can use to pay, and bet big on buy now and pay later options. Make people trust you more, and help them get products faster and more conveniently.
The site footer with bottom navigation and trust marks
The site footer is like the air you breathe in, it has to exist. Showcase trust badges/marks, top navigation items, key categories, contact pages, FAQ, About us pages, social links - and all the terms and privacy pages. And do not forget the delivery information and return handling pages! You can also use the area to acquire leads and make people subscribe to your newsletter, but there are better ways.
The bonus checklist
Integrate order tracking to your store if possible
Keep people with your brand and show you care the package is delivered to them, not just the courier.
Enable users to download an invoice or Print if it makes sense for your business or the customers are asking for it
This may be needed from time to time and in specific business industries.
Provide an online return flow in addition to the "download, print option"
If possible, have an on-site process to manage returns, and always make the costs very clear, including timeframe and process.