image of a person's arm carrying a notepad with the word design showing prominently

In this article on website design we are going to review some important considerations that will influence what your website will look like to visitors and how you want your visitors to interact with your content.

In my previous post on setting up your online business I recommended that you use the WordPress platform to build your website.

You will of course already have a registered domain name, and have arranged a hosting package. You may recall that with my online businesses I have mainly used two hosts d9 hosting and Siteground.

I also made further mention about the advantages of considering installing a premium theme on your website.

The reason for this is because premium themes have much greater functionality than free versions. Also premium themes will typically have a range of built in overall website design and page design templates to choose from

This feature alone is going to save you a lot of time and effort and will be well worth the price you pay to access the theme.

The only themes I have ever worked with are OptimizePress and Elegant Themes Divi Theme.

So let’s start by looking at which of these two themes might best suit your purposes.

Divi Vs OptimizePress

Actually both are easy to install but I slightly favour Elegant Themes Divi theme.

This only because ElegantThemes have a much more extensive and comprehensive range of ‘how to’ videos for virtually every single function and tool you could use on your website design.

Elegant Themes makes it super easy for people to learn how to use their theme. And….you can build a really super looking website with one of the pre-designed Divi layouts.

Having said that, the website you are looking at here has been built with OptimizePress.

And…I’ve found it very easy to use mainly because of John Thornhill’s coaching.

John runs the Partnership To Success program where he shows you step by step on how to set up a website using OptimizePress. And the main purpose of this website is to use it for blogging.

I’m still blown away by how easy OptimizePress has been to use for my website design and that’s thanks to John Thornhill. I must confess my previous attempts to use OptimizePress on another website was very frustrating, and time consuming.

In my opinion John’s ‘how to’ videos beat hands down a lot of the coaching videos available from OptimizePress.

One advantage OptimizePress has over Divi is that they have an extensive range of pre-built landing and thank you pages.

This was the main reason for me wanting to use OptimizePress on another website. I was doing a lot of paid marketing and needed to be able to quickly building sales pages, landing pages, squeeze pages and thank you pages. OptimizePress was a big time saver for me in this regard.

So, which one?

  • OptimizePress for fairly basic blog page layout options. If you intend doing a lot of paid marketing then their relatively big range of landing and thank you page templates is an advantage. Also, once you know what you’re doing it’s also pretty easy to set up a blogging website.
  • In my opinion Divi is a much more multi purpose theme for website design. I think it has better options for presenting/displaying your products and services. There is a greater range of options for the overall design and layout of your blog. And, I still think Divi is easier to learn how to use.

Website design – the look and feel of your site

Using the Appearance menu on the left hand side of your WP-Admin area you can set up default font styles and sizes, as well as your business logos and colour schemes.

While the features you set up here will depend a lot on your personal taste you must remember the experience of the user.

Here are a few considerations which will all be related to the visual brand you want for your business:

  • Text colours and page backgrounds – you want to aim for good contrast between text colour and the background colour of your web and blog pages. Here’s a link to a website which explains this concept quite well.
  • Text fonts and sizes. Again you want to aim for ease of readability. Here’s a useful website which explores your options. This blog article outlines 50 best fonts for logos. My best advice – avoid italicised fonts or hand written looking fonts like Comic Sans. Serif fonts are apparently easier to read.

Website design – be consistent with your brand

image reinforces website design principle of consistency - image of pencils, the corner of a laptop with a pink glow lighting effect on the overall image

Once you have decided on the fonts and colours to be featured on your website, make sure that as you add content to the site that you maintain consistency in the visual look and feel. In this way you begin to develop a strong visual brand.

One way to do this is to create a folder on your PC or laptop where you can place any important website design information about your website.

For example I have a folder with the name of my business, and inside that folder I created another entitled “Website Info”.

  • Next, I created a Word document entitled “Branding and Important Links”.
  • And in this document I’ve listed the name of the fonts I’m using, their sizes, and also the colour codes of the different colours I’ve decided to use on my website

In this way I can ensure that I can remain consistent in the look and feel of my website I build pages and blog post articles.

Any graphics, logos, header/hero images you use on your website, and of course business cards and letter heads should be consistent with the visual brand you have developed for your business.

Image sizes and website speed

Generous use of images on your pages and posts is strongly recommended as an important aspect of your website design, and as a means of creating visual interest in your content.

As the old saying goes “a picture can paint a thousand words”

But a note of caution here. You will need to keep a close eye of the size of the image file and ideally restrict the file size to around 100kb.

The reason for this is that the file size of your individual images will have a big impact on the speed at which the pages on your website load.

Page load is important for a couple of reasons. First it is one of the factors that Google uses in determining the ranking of your pages in search results. The slower your page load speed the lower you’re going to appear in searches.

Next, a slow loading website doesn’t make for a very good user experience. Visitors to your website aren’t going to hang around for 20 or 30 seconds waiting for one of your pages, or post articles to load.

Page load speed is now a very big deal with so many internet users accessing digital content on mobile devices.

According to some Google research 53% of mobile device users will leave a mobile page if it takes longer than 3 seconds to load.

website design related - a person sitting down cross legged using a smart phone

You can use this link to pingdom tools to test the load speed of one of your pages.

If you need to reduce the size of an image file without too much loss in the quality of the image there are a couple of tools you can use:

  • If you have a PC download the free image editor paint.net. To reduce the image size simple click on “Image” in the menu and then click on “resize”.
  • You can also download an image optimisation tool called “Riot”
  • If you have a Mac, simply click on Preview” app, then open the image you want to reduce, choose “Tools>Adjust Size” the click on “Resample Image”.

Website design – Summary

There’s a lot more still to be covered on the topic of website design.

What I’ve attempted to cover are just some of the first steps you will complete when setting up a website as part of your online business.

Please share with any website newbies you know who might benefit from these simple tips and tricks.

Till next time,

Anth


Leave a Reply

Your email address will not be published.