Pro visual design tips for building your own small business website.
First, KISSS (Keep it Simple, Superstar!)
Most well-known site builders and CMS platforms have clean and professional templates available, complete with font, color, and spacing choices that work well together. But when we override these defaults, things can go awry. So, when in doubt, swap it out! In other words, instead of trying to redesign a template you don’t like, take the time to find and switch to one that suits you. Even explore other platforms if you must; it’s worth it!
However, small changes may be necessary, so here are some general best practices to design your own website and keep it from straying into amateur territory.
Headers & footers
These are the topmost and bottommost parts of all the pages, respectively.
- Headers and footers should remain the same on every page with the exception of the homepage, which can have a larger or smaller header.
- At minimum, the header includes the navigation and your logo.
- Footer text should usually be smaller than the main text of the site.
- Your navigation menu should be simple, bold, and easy to identify.
- Keep it at or near the top of the page, either centered or left-aligned.
- It’s best to have 3-7 pages total in the navigation menu. If your site is fewer than 3 pages, consider a one-page scroller site template instead. If you have more pages, use submenus to keep it organized.
A well-made logo elevates your business, and you can make one yourself!
- Some site builders like Wix come with logo makers, or you can use free sites like Canva.com.
- Make sure the background of your logo is transparent, so the edges blend seamlessly with your site.
Social media links
Clean design & spacing
- Keep the most important content “above the fold,” meaning the area visible before you scroll.
- Even spacing of all separate elements (images, headings, blocks of text, etc.) is generally ideal.
- To make your site more elegant, or to make a specific element stand out, use more white space between elements. Think of the Google.com homepage — That search bar jumps out!
- Don’t make any one page overly long. For example, do you have a lot to say about your business in general, and a lot to say about your individual team members as well? Then consider having separate About and Team pages to split up the info.
- Make sure all your images are clear, well lit, and have good resolution.
- Re-take any dim, grainy, or blurry images.
- Don’t be afraid to use high-quality stock photos! Free sites like Pexels.com and Pixabay.com can get you started.
- In general, a few larger images on a page make a better impression than a cluster of smaller ones.
- When uploading, start with large, high-res images, and let your site builder resize and optimize them for you. There are also many free online services that do the same.
A hero image is the main image that draws the visitor in and appears at or near the top of a web page, taking up at least half, or even the entire width, of the page.
- Every main page should have a hero image.
- A hero image can also be the background for the main page text, provided it’s not too busy.
- A hero video can supplant the hero image.
- Hero images should be about the same size on each page, with the exception of the home page, which might have a larger one.
- Legibility is king! It’s best to use sans serif fonts of an easy-to-read size.
- Make sure there is enough contrast between any text and the background.
- Make sure there is adequate line spacing.
- Break text into smaller paragraphs, and use bullet points, headings, and line separators to organize text into smaller, more digestible chunks.
- Don’t use more than 3 different fonts on your site.
- Black and white is a good place to start. Build on that scheme using colors from your logo.
- Limit your color scheme to four or five colors total.
- You can use free color-combo pickers like Coolors.co to create or edit existing color schemes.
Calls to action
A call to action, or CTA, is a prominent button or link that tells the viewer what you want them to do before they leave the page, and you should have one on every major page of your site.
For example, on the home page, if you have a brief paragraph that describes the advantages of working with your company, right after that you can encourage them to Request a Quote or view your Services with a large button that links to that particular page. CTAs keep pages interesting, so visitors stay longer, and they increase sales.
Make sure your site is responsive, i.e., that it’s easy to read and use on mobile. Site builders like Wix and Squarespace have this functionality built into most of their templates, but it’s good to check for yourself how they look to make sure. The Chrome browser also comes with an “inspect” function built in to check responsiveness.
Breathe. Designing your own small business website using a site builder or CMS can feel like a challenge. But by making as few changes as possible to the original layout and color scheme of your selected template and keeping these small business website design tips in mind, your site will look clean, slick, and ready for business. And no one will know you didn’t hire a pro.