Nothing Found, Something Shown: A Calm-Screen Checklist for UK Shops
Most small UK shops spend their design energy on the front door: the homepage hero, the product gallery, the checkout button. Fair enough. That is where the sales are meant to happen. But customers also meet your brand in the interruptions — the search that returns nothing, the product that has sold out, the card that gets declined, the category with an empty grid, the link that lands on a 404. These are the screens between the sale, and right now many of them look like nobody works here.
That is the problem. A dead end is still a brand moment. It is often a slightly tense one, which makes it more memorable, not less. If your shop looks calm and helpful when something goes wrong, people forgive the wrong turn. If it looks blank, generic or faintly broken, they quietly leave and take their next purchase somewhere else.
Why the awkward screens deserve a second look
A visitor who hits a dead end is already doing a small amount of work: re-reading, re-typing, checking their card, wondering if they clicked the wrong thing. The last thing they need is a screen that adds confusion. A browser-default 404 page, an unstyled 'no results' message or a red payment error might feel like a technical detail to you. To them it is the shop shrugging.
Small brands have an advantage here. You do not need a huge content team or a custom app to fix this. You need a handful of screens that say what happened, look like your shop, and offer a route forward. That is a design job as much as a development one.
The four jobs of a dead-end screen
Every one of these pages should do four things, in this order:
- Confirm what happened in plain English. No error codes doing the talking.
- Keep the visual thread — your typeface, your colours, your tone — without turning it into a comedy sketch.
- Offer one obvious next step and one quieter alternative.
- Reduce effort by putting search, contact details or useful links within easy reach.
That is it. The screen does not need to be clever. It needs to be clear, calm and useful.
Start with the words, then the layout
A lot of dead ends fail at the copy stage. 'No results found' is technically true but cold. 'Error 404' is a developer's note, not a customer message. A declined payment screen that says 'Transaction failed' can feel like an accusation.
Write the sentence you would say to someone standing at your counter. For a missing page: 'We can't find that page — it may have moved.' For an empty search: 'Nothing matched that search, but here are a few places to start.' For a declined card: 'Your bank didn't approve that payment. Your basket is still here, so you can try another card or check with your bank.'
Keep the tone level. Over-apologising can feel worse than the problem. A single clear line and a helpful link beats three paragraphs of regret.
A screen-by-screen quick audit
No search results
Show the search term back to the visitor so they know what happened. Offer spelling suggestions, popular categories, or a few bestsellers. Do not leave a blank page with a back button. If search is a major route into your shop, this screen is a shopfront in its own right.
Out-of-stock products
Do not hide the product and pretend it never existed. Show it, mark it clearly as out of stock, and offer a useful alternative: a similar item, a notify-me option, an expected restock date if you genuinely know it, or a link to the category. A sold-out product with no next step is a conversation that stops mid-sentence.
Declined payments
This is the highest-stress screen on the list. Keep the colour palette calm, avoid alarm-red buttons, and explain the next move in one line. Make it obvious that the basket is saved. Offer a link to try again and a link to contact you if it keeps happening. Never make the customer feel accused of doing something wrong.
Empty categories
A category with no products looks like a closed department. If it is seasonal, say so. If stock is coming, say when. If the category is genuinely retired, redirect it or link to nearby categories. An empty grid is not neutral; it looks like neglect.
404 pages
Brand it, keep the navigation visible, and give people a search box plus three or four useful links. If you can, add a line for reporting a broken link. A good 404 is a small courtesy that says the shop is still open.
The visual details that keep it calm
Use your brand typeface rather than the browser default. Keep the logo present but small. Leave more whitespace than you think you need. Choose one primary action and make the secondary option quieter. Avoid illustrations that make light of the problem — a cartoon tumbleweed on a failed payment is not the moment.
Check these screens on a phone, in a hurry, with one hand. Check them with images switched off and in dark mode. If an icon is carrying meaning, give it alt text. And make sure the main navigation has not vanished; a dead end should not also be a trapped end.
A practical checklist before you publish
- Does the screen say what happened in plain English?
- Is there one obvious next step and one quieter alternative?
- Does it look like our shop without shouting?
- Is it readable on a phone in a hurry?
- Does it still work with images off and in dark mode?
- Can someone reach search, basket and contact in one tap?
- Have we tested it with real examples, including a declined card in test mode?
- Are we tracking these screens so we notice if they spike?
The last point matters. A sudden rise in 404s or empty searches can tell you something is broken upstream. Treat these pages as part of your shop's visual system, not as leftovers. When the shelf is empty, the screen still has a job to do.
