Although not all your site visitors will necessarily be able to put their finger exactly on why one site looks more visually pleasing or easier to navigate than another, they will instinctively know it when they see it.

For those of you who don’t have a brand guide, or are simply looking to make  your own site look more professional, we’ve jotted down some quick tips to help you. And we can’t emphasise enough: consistency is key.

Headings

Traditionally, headings are used in the print world to break text into digestible pieces of information, helping the reader to focus in on information that may be of interest to them. On the web, headings are used in the same way, however, when we talk about headings online, we are talking about HTML tags. HTML tags range from Heading 1 <h1> through to Heading 6 <h6> and can be found in your visual editor here:

The appearance of headings on your site will depend on the theme you are using and can look quite different from site to site. Headings on our site display like this:

H1 to be used for the site or page title

H2 to be used as a page or post title

H3 to be used as a sub title

H4 to be used as a sub title

H5 to be used as a sub title

H6 to be used as a sub title

Headings signpost your content

As you may already be aware, most of your site users won’t be reading every single word in your post. In fact, the majority of people only scan a webpage. If they catch a phrase or sentence they like the look of, they carry on reading, otherwise, they will continue scanning down the page before exiting.

Headings help to break the content into helpful junks; pointing the reader in the direction of content that may be interesting or helpful to them. Rather than write paragraph after paragraph of content that may overwhelm your reader, we recommend using brief headings, with one or two keywords.

For those of you who are interested in how users read content, you might like to check out these posts by Nick Babich, on the Z shaped and F shaped reading patterns.

Headings and Search Engines

First and foremost, we feel it’s important to say that you should be writing interesting and high-quality content for your readers, not with the sole purpose of search engine optimisation in mind. Don’t be obsessive about writing SEO only text, stuffed with keywords – make sure it’s for the visitor and not just Google!

However, it is worth pointing out that when a search engine scans your page, clear and logical headings get you extra SEO brownie points. As you progress down the heading sizes, the less importance a search engine places on that heading. And although headings range from H1 through to H6, you’ll probably only need the first four in most cases.

Text Styles

As we mentioned above, consistency is key. It may feel tempting to go wild, choosing lots of different text styles and multiple colours, but simplicity is often better. Stick to a few styles and keep it simple. It’s amazing how much more professional your pages will look if there is an underlying pattern.

We’ve put together some quick tips to bear in mind when adding text to your posts or pages:

• Use Unordered or Ordered lists for lists that are relatively short. Resist the temptation to use them for paragraphs – instead, use the Heading styles.
• Bold and Italic should be used in moderation. Do not use bold as a substitute for heading styles – bold is not particularly important to a search engine.
• You may want to select the blockquote button when adding a quotation – it helps the quotation stand out from the rest of the text on the page.
• Some themes may override your styling decisions, for example enforcing alignment, the style of a blockquote and so on. You should experiment and test.
• Keep text left aligned. You’ll very rarely need to centre align text.
• Most themes will highlight links in a different colour and with hover properties.

Images

Some sites use a minimal number of images, some use a lot, but one thing for certain is they play a large part in the overall appearance of your site. People generally engage with things that are visually orientated. Ensure your photos are the correct format and dimensions for the place you are inserting them; don’t try and use a landscape image when a portrait image would be more suitable.

Ensure your photos are the correct dimensions and stick to this consensus across the site. Stretched images or images of multiple sizes can look unprofessional and unattractive. It may take a bit of extra time, but formatting your photos correctly is worth it to keep your site looking professional and slick.

Optimising your Images

Images can be cropped and resized in Photoshop (or equivalent software) before being uploaded to your WordPress site. Alternatively, you can crop, scale and rotate images straight from the Media Library in WordPress. You would do this when uploading the image to the Media Library, selecting the image and then clicking ‘Edit Image’. We personally resize our images before we upload them to WordPress.

You could also consider optimising your images using a content delivery network (CDN) service like Imgix, which is what we currently use on our site and many client sites. These type of services speed up delivery of the images to the web browser.

Images and Accessibility

It’s also worth pointing out the importance of considering accessibility when adding images to your site. It may be easy to overlook when you’re not in the habit, but it takes two minutes (or less!) to add Alt Text to your images. The Alt Text is used to describe the image, allowing screen readers (used by the blind or visually impaired) to read out the text to the user.

Colour Palette

We know it may be tempting to use lots of different colours on your website, but to maintain brand consistency, it is advisable to stick to the colours defined in your colour palette. We have seen some people select all number of different colours throughout their new site and although we understand why this may be tempting, we advise restraint.

You should already have a colour palette in place, but if not, it may be helpful to take the time to define your own palette and then stick to it. To give you an example of a colour palette, I’ve added the one we use here, below. Our almost monochromatic colour palette is kept to throughout our site and extends to all of our marketing.

Good Luck with your New Site!

From our experience, I hope to have touched upon some of the areas most new site owners seem to struggle with when visually maintaining their new website and provide you with some quick and simple tips to help you get started.

If design is something you’re interested in, you may like to read about some of the design decisions that went into re-designing our new site.

Otherwise, good luck and enjoy maintaining your new site! It may feel hard work at first, but a little effort goes a long way. And if you’re looking for a new site for your business, feel free to get in touch and ask us about Standfirst —we have options to suit all budgets.