A Visual & Design Guide for Website Building: 13 tips for designing better landing pages
Visitors judge your website in a second or two, before they read a word, and decide whether you look professional and worth their money. Design is what they judge first.
We reviewed the design of 100 small-business websites: the fonts, spacing, colors, buttons, and the little browser-tab icon. None of it is the "content," but all of it decides whether a visitor trusts you enough to stay.
The good news: design was a real strength. Only about 15% of checks failed, the typical site passed 85%, and 23% of sites failed nothing at all.
The catch: 30% of sites still failed three or more checks, clustered in fonts, spacing, and consistency, the quiet things that make a site feel off. Almost none of the fixes need a developer or a budget. Here's what we reviewed and exactly how to fix it.
failed three or more design tests.
How we reviewed this
We audited each of 100 small-business websites against a set of simple design tests: whether the text is comfortable to read, whether the page has room to breathe or feels cramped, whether the buttons match, whether the colors work together, and whether anything on the page is broken or half-finished.
Every percentage below counts only the sites where that check actually made sense, not always all 100. Some checks simply do not apply to every site. A site with no buttons cannot be scored on whether its buttons match. So the percentages tell you how common each problem was among the sites it could happen to. The examples are the auditor's real notes, with the businesses kept anonymous. No business is named.
Reading comfortably: fonts, color, and breathing room
This first group covers the part of design you feel without noticing: the words and the space around them. Get it right and your site feels calm and easy. Get it wrong and visitors squint, get tired, and drift away, often without knowing why. These were the most common failures in the whole report, so this is where most of the work lives.
Text that is easy to read
41% of sites failed the text check. This was the single most common failure in the whole report, hitting more than four in ten sites. This check is just about how your words look: the fonts, the sizes, and whether the text stands out clearly from the background behind it. Most failures came down to text that is simply too faint to read. The auditor flagged sites with paragraph after paragraph of pale, washed-out text, with the note that it was "too light to read comfortably."
Open daily 11 to 9. Call (555) 0192 to book a table for six or more.
Open daily 11 to 9. Call (555) 0192 to book a table for six or more.
Why it matters: Faint or fussy text makes a visitor work to read you, and a tired visitor leaves. Worse, the words that go faint are often the ones that earn you money: your hours, your prices, your phone number, the label on your main button. If those are pale gray on white, an older customer, or anyone reading on a phone in daylight, simply cannot make them out. That is a lost call or a lost sale you never even see.
How to fix it: Make your text darker and your fonts fewer. Dark gray or black text on a white or very light background is always safe. Pick one font for headings and one for body text and stick to them, instead of letting three or four creep in. Set a comfortable size, big enough to read on a phone without zooming. If you are not sure whether your colors are too light, paste your text color and background color into a free online "contrast checker" and it will tell you in seconds. In most website builders, all of this is a theme setting, not a code change. Every Frontpage theme ships with dark, high-contrast text and a tight pair of fonts by default, so your words stay easy to read without you touching a single setting.
Breathing room, so the page is not crowded
36% of sites failed the breathing-room check. More than a third of sites felt cramped or chaotic. Breathing room is the empty space around your text, images, and buttons. It does not have to be white. It is simply room to breathe, and it is one of the strongest signals of a professional site. Crowding showed up two ways. One is too much stuff jammed together, like the site the auditor described where the headline, phone number, and social icons all piled on top of each other, with the intro text partly hidden behind a popup box. The other is broken emptiness, like the site with a large blank band followed by an empty gray grid where images failed to load. The result looked unfinished.
Why it matters: A crowded page overwhelms people. They cannot tell what to look at, so they look at nothing and leave. A page with broken gaps looks abandoned, which quietly tells visitors you might be out of business. Either way, you lose trust in the first few seconds, before they ever reach your offer.
How to fix it: Give your most important things room. Add space above and below your headline, around your main button, and between sections so each one stands on its own. If a section feels busy, remove something rather than shrinking it. Then walk through your own homepage on a phone, looking for anything overlapping, hidden behind a popup, or sitting in a big broken gap. Most builders let you adjust spacing with a slider, no code required.
A clean, consistent set of colors
13% of sites failed the color check. About one in eight sites used colors that did not work together. Your colors are just the small set you use everywhere: usually one or two main colors plus a neutral or two. When they are consistent, the site feels designed on purpose. When they are not, it feels stitched together from spare parts. The auditor described one site where the main headline was bright blue on white while the rest of the site leaned on navy backgrounds and other colors that did not match.
Why it matters: Color is one of the fastest ways a visitor reads "professional" or "amateur." A handful of clashing colors makes even good content feel less trustworthy. Consistent color makes a small business look established and deliberate, which is exactly the impression you want before someone spends money.
How to fix it: Pick a short set of colors and use it everywhere. A reliable recipe is one main brand color, one accent color for buttons and links, plus black or dark gray for text and white or very light gray for backgrounds. Write the colors down and reuse those exact ones, instead of eyeballing a new shade each time. Most builders have a "theme colors" panel where you set these once and they apply across the whole site.
Sharp images, not blurry or broken
Only 4% of sites failed the image-quality check. This was a near win. Just a small handful of sites had blurry, pixelated, or broken images. The clearest failures were images that did not load at all, like the site where the homepage service icons and the three feature cards all showed gray broken-image placeholders instead of photos, leaving the page looking half-built.
Why it matters: A blurry or broken photo undermines everything around it. If the picture of your work, your food, or your storefront looks low quality, visitors quietly assume the business is low quality too. Photos are often the very thing that convinces someone to choose you, so a broken one is a missed sale.
How to fix it: Use clear, properly sized photos and make sure each one actually loads. Start from the largest, sharpest version you have rather than blowing up a tiny image, which is what causes the pixelated look. After any change, click through your own pages and watch for gray "broken image" icons or empty boxes, then re-upload anything that fails to appear. If you do not have strong photos of your own, good stock photos beat blurry real ones.
A clean sweep: images sized right, not stretched
Every single site passed the image-sizing check. This was a clean sweep, 0% failed. Sized right means an image keeps its natural proportions instead of being squashed or stretched, which is what makes faces look too wide or logos look squished. Take the win, and keep the habit: when you place a new image, resize it from a corner so it scales evenly, never by dragging one side, which is what causes the stretch.
Free consultation
Want a hand fixing yours?
Book a free 30-minute session and we'll go through your site together and rebuild your web presence, all before the call is over.
Looking finished and put together: consistency and no broken pieces
The first group was about comfort. This group is about credibility: whether your site looks like a real, finished, working business, or like a project someone abandoned. A single broken button, a stray "coming soon," or a hidden code error can undo a lot of otherwise good design. Most sites did well here, but the consistency items are where polish quietly leaks.
Buttons that all look the same
29% of sites failed the matching-button check. Nearly three in ten sites had buttons that did not match, or barely looked like buttons at all. When your buttons all share one look, visitors learn it instantly and know what to click anywhere on the site. When they do not, every page becomes a small guessing game. The auditor described one site with no real buttons at all: the most important actions were bare text links that led nowhere, with no styled, repeated button for visitors to recognize.
Why it matters: Your buttons are where visitors become customers. If they do not look clickable, or if every one looks different, people hesitate, and hesitation at the "Book" or "Buy" step costs you directly. A consistent, obvious button style is one of the simplest ways to lift the number of people who actually take action.
How to fix it: Decide on one button style and use it for every important action: the same shape, color, size, and wording. Make your main button your accent color so it stands out from the page. Turn any plain text link that is meant to be a button into a real, styled button, and make sure it actually leads somewhere. Most builders have a reusable button element, so you set the style once and reuse it everywhere. Frontpage goes a step further and builds every important action as one consistent, obvious button style across your whole site, so visitors always recognize what to click.
Pages that load without hidden errors
26% of sites failed the hidden-error check. About one in four sites had broken code running behind the scenes. This is the code that makes interactive things work: image galleries, dropdown menus, popup forms, sliders. When it breaks, those features can quietly stop working. The auditor's notes were blunt: one site loaded with several errors and another with one, where "broken scripts can break features (forms, galleries, menus)."
Why it matters: This is the one item in this group that can actively cost you customers without you ever seeing it. A broken feature might mean your contact form does not send, your booking widget does not open, or your menu does not drop down. The page can look perfectly fine while the very thing a visitor needs quietly fails. You never get a warning. You just get fewer leads.
How to fix it: This one is technical, so it is the item most worth handing to whoever built or manages your site. Give them the note above and ask them to find and fix the errors that show up when the page loads. In the meantime, test the things that matter most yourself: submit your contact form, open your booking tool, and click your menu, on both a computer and a phone. If something does not respond, you have likely found the broken feature.
A clear starting point, so visitors know where to look first
24% of sites failed the starting-point check. Almost a quarter of sites gave the eye no clear place to start. A good page leads your eye in order: a clear headline first, then the supporting text, then the button. When several things shout at once, nothing wins. The auditor described one site where the eye had no single starting point, with a big banner, the top menu, a duplicate row of buttons, and a long list of links all stacked together. On another, the homepage was a full-screen photo with no headline at all, so the first words a visitor reached were three equally sized columns with no clear answer to "what is this and what do I do next?"
Why it matters: A visitor decides in seconds whether your page is worth their attention. If there is no obvious starting point, they have to work to figure out what you do, and most will not bother. A clear starting point answers "what is this?" and "what should I do?" instantly, which keeps people moving toward your phone number or booking button instead of leaving.
How to fix it: Give every important page one clear, large headline at the top that says what you do in plain words, and make it the first and biggest thing a visitor reads. Put one main button just beneath it. Then make everything else smaller and quieter so it supports that headline rather than competing with it. Squint at your own homepage: the thing that stands out when everything is blurry should be your headline, not three things at once.
A near win: a consistent look across all pages
Only 5% of sites failed the consistent-look check. This was a strong result. Just a few sites changed character from page to page. A consistent look just means the same logo, colors, fonts, and tone everywhere, so a visitor never wonders whether they have wandered onto a different company's website.
Why it matters: Consistency builds quiet confidence. When every page looks like it belongs to the same business, you feel established and trustworthy. When pages clash, visitors get a faint sense that something is off, and that doubt is the last thing you want while someone is deciding whether to buy.
How to fix it: Walk through your pages one after another and check that the header, logo, colors, and fonts match everywhere. The usual culprits are older pages built before a refresh, or a stray page from a template that never got updated. Bring those into line with the rest. Once your theme colors and fonts are set in your builder, applying them to a stray page is usually quick.
Set it and forget it
Put your design on autopilot
Sign up to Frontpage and let Autopilot look after your fonts, spacing, colors, and buttons. Your design stays clean and consistent, and you never have to think about it.
The basics that signal a real, finished business
This last group is short because the sites did so well on it, but it matters out of all proportion to its size. These are the small signals that tell a visitor "this is a real, complete business" versus "this looks unfinished or fake." A missing one can sink trust no matter how nice the rest of the site looks.
A little icon in the browser tab
12% of sites failed the tab-icon check. About one in eight sites was missing this small touch. That icon is the tiny picture that shows next to your page name in the browser tab and in bookmarks. The failure was simple and consistent: no icon was set on the page at all.
Why it matters: It is small, but it is the kind of detail that separates a finished site from a rushed one. Without it, your tab shows a blank generic icon, and your site is harder to spot when a customer has a dozen tabs open or goes looking for your bookmark. Polished businesses get the little things right, and visitors notice.
How to fix it: Add a tab icon, usually a square version of your logo or just your initial. Almost every website builder has a "favicon" or "site icon" setting where you upload a single small image and it appears everywhere automatically. It is a five-minute, one-time job. Ask Frontpage for a favicon and it generates a clean one from your brand and sets it across every page for you.
A logo that is present and shows up correctly
6% of sites failed the logo check. Almost every site had a working logo, but a handful did not. The failure was straightforward: no logo was found on the site. This check applied to all 100 sites, since every business should have a logo somewhere.
Why it matters: Your logo, usually top left, is the anchor of your whole site. It tells visitors whose site they are on, ties every page together, and is often a clickable way back to your homepage. A missing or broken logo makes a site feel generic and unfinished, the opposite of the trustworthy first impression you want.
How to fix it: Put a clear logo in your header, usually the top-left corner, on every page. If you do not have a designed logo, even a clean, readable version of your business name in a nice font works well to start. Most builders have a dedicated logo slot in the header settings, and you can usually link it back to your homepage.
No "under construction" or empty pages
6% of sites failed the unfinished-page check. Most sites were fully built, but a few were caught mid-construction in public. The auditor flagged the giveaway text directly: on one site, "coming soon" text was visible and the site looked unfinished, and on another, "under construction" text was visible for the same reason. An empty page is one that exists in your menu but has little or nothing on it.
Why it matters: Nothing kills trust faster than landing on "coming soon." It tells a ready-to-buy visitor that you are not ready for them, so they go to a competitor who is. Even a single half-finished page in your menu makes the whole business feel tentative. If a page is not ready, it is almost always better to hide it than to publish a placeholder.
How to fix it: Hunt down any "coming soon," "under construction," or nearly empty pages. For each one, either finish it or remove it from your menu until it is ready, so visitors never reach a dead end. Click through every link in your own navigation and make sure each one leads to a real, complete page.
No filler or placeholder text
5% of sites failed the filler-text check. A small number of sites still had dummy text sitting on a live page. "Lorem Ipsum" is the scrambled fake Latin that designers drop in as a placeholder while building, the "lorem ipsum dolor sit amet" that is meant to be replaced with your real words before launch. Sometimes it is left behind by accident.
Why it matters: Nothing says "we never finished this" like a block of nonsense Latin where your story or your services should be. It tells a visitor the site was rushed or abandoned, and it wastes the prime spot where you could have been winning them over with real words. It is also a missed chance to be found in search, since search engines have nothing real to read.
How to fix it: Read through every page and replace any dummy text with your own real, plain words about what you do and why someone should choose you. The tell-tale phrase to search for is "lorem ipsum," but watch for any leftover sample text from your template too, like a fake address or "Your headline here." If a spot is hard to write, a short, honest sentence beats filler every time.
What to fix first
Start with the problems that hit the most sites, in rough order of how common they were:
- Fix your fonts and text so they are easy to read, the most common failure at 41% of sites.
- Add breathing room and clear out crowding and broken gaps, 36% of sites.
- Make all your buttons match and look clickable, 29% of sites.
- Fix the hidden errors that can silently break forms, galleries, and menus, 26% of sites.
- Give every page one clear starting point with a strong headline, 24% of sites.
- Tidy your colors down to a small, consistent set, 13% of sites.
- Add a little icon to the browser tab, 12% of sites.
After those, mop up the smaller items, most of which are quick: add a working logo (6% of sites), remove any "under construction" or empty pages (6%), replace any filler or placeholder text (5%), bring stray pages into line so your site looks consistent (5%), and re-upload any blurry or broken images (4%). And take a moment to enjoy the clean sweep: every single site kept its images properly sized and unstretched.
Why this is worth your time
Design is the one part of your website a visitor judges before they have read a thing. In the first couple of seconds, the fonts, the spacing, the colors, and the buttons tell them whether you are a real, professional business worth their money. That judgment then colors everything they read afterward. A polished site makes your prices feel fair and your work feel trustworthy. A rough one makes a visitor doubt you before you have said a word.
The encouraging news is that this was a real strength across all 100 sites, so you are likely closer than you think. And almost every fix here is the kind you can do yourself in an afternoon: darker text, fewer fonts, more breathing room, matching buttons, a tidy set of colors, a little icon in the tab. None of it needs an ad budget, and most needs no developer, with the hidden errors being the main thing worth handing to whoever built your site.
Most of these sites were not failing on purpose. They just had a few quiet places where polish was leaking: a too-faint paragraph, a crowded top of the page, a button that did not match, a stray "coming soon." Pick the top two or three from the list above, spend an afternoon, and your site will look more professional, feel more trustworthy, and quietly win you the customers who were judging you in those first few seconds all along.
Free website audit
Get your score
Enter your website and email and we'll run the audit for you. You'll get the full results, your score and exactly what to fix, delivered straight to your inbox.
Free forever plan · No credit card required
Based on a close look at 100 small-business websites. Every statistic above comes from those results, and the businesses are kept anonymous.