5 Web Design Principles to Keep in Mind When Designing a New Site

5 Web Design Principles to Keep in Mind When Designing a New Site

Posted 15th April, 2019 by Diana

1.Structure and navigation

Before working on the aesthetic side of your site, you need to consider the functional one. If your site is not functional even the best design will do it no favour. To start off make sure you have a clear and as user-friendly as possible site structure. This means that your content should already be planned (or existing if you are thinking of redesigning your site), then categorized in order for a better organization of your site's elements.

Structure data on site

One easy approach is to keep all dynamic data at one place and the non-changing data at another.

For example, you have a site that has a forum, blog, an 'About Us' page, and a 'Contact Us' page. Instead of adding the forum threads or blog posts on your menu, you can add a menu button for the forum and the same button for the blog with if you would like an additional drop-down menu for the main blog categories.

You can also put an excerpt from the blog or forum in your sidebar to keep things separated from your main content.

Keeping things organized, easy to find and intuitive is the best approach when thinking about user experience and working on improving it.

2.Images

While having large images which offer the best possible quality sounds like the way to go, you need to keep in mind optimisation when choosing your images. Even the prettiest pictures will not keep the users on your website if the page takes several seconds to load.

We already spoke in another article how the media you choose to have on your site affects not only the visual perception of your site but your optimisation as well. The thing you have to remember is that the larger the image file is, the slower your web page will load.

Therefore, it’s a good idea to keep in mind the DPI and size of your image. When uploading an image for web the DPI on your file shouldn't be more than 72, and the image file itself shouldn't be over 5mb, for optimal results.

Optimise images for site



Of course, if your site already has larger images no need to worry as there are ways to optimize your images after uploading if you are using CMS like WordPress, Joomla or Magento, if you are not using a CMS consider editing the image size and DPI using Photoshop or another software alike.

Also when talking about images it is good to mention about the Alt Tags. The alternative taglines of the images are used when the image cannot be loaded, or when the site is being looked by a bot.

Add Alt Tags to site

For instance, digital dictators or any program translating text to speech needs a comprehensive alt tag, which improves on the accessibility of your site (if it's easily readable by machines). The Alt Tag and meta-description of the image play a role within the SEO of that image as well.

3.Readability

Readability is an important part of every site, not only it helps the user to find what they are looking for easier, but it helps for a better SEO as well.

In February 2019 Yoast - the creator of one of the most popular SEO extensions for the WordPress CMS wrote that "Google prefers understandable content because voice search is getting bigger. Whether it will be huge or not, doesn’t matter for the importance of understandable, readable content. Google simply dictates the search results and the algorithm".

Readability score by Yoast

We can definitely see the increasing popularity of voice search, as it is used not only for convenience but also as the only option for a lot of people with visual impairment and other disabilities.

So having your content with a good readability score will not only provide a great SEO value but will also make your site more accessible.

In order to make a site more readable, you need to first work on your core sentences.

The core sentences are the first sentence of each paragraph, so writing your content with a good structure and keeping the 'hooking' sentence at the beginning of the paragraph will not only impact your SEO but engage your visitors more and improve on the user experience of your site.

If you are using a CMS of any kind there is probably already an extension or plugin that you could install in order to monitor your readability, but if that is not the case there are many online readability testers you could use to check your content and advice you on how to improve it.

4. Overloading your site with elements

After going through the functional and content-side of your site it's time to work on the design. The main thing when designing a site is to not overload it with elements, as it can give the appearance of too much stuff happening at once, thus affect negatively the user experience.

The main principle here is 'Less is more' so don't make your site too complicated, but don't leave it too empty as well.

Minimalist web design

Source: studiorotate.com

If you already have your content organized, place it in an intuitive matter and if you wish to add an advertisement to your site, use the sidebar, header or other areas of your site where it would not harm the design and flow of your site.

5. Consistent colours and design

Although there are many fun fonts and colours, keep your fonts and colours to the minimum. The golden rule is not to use more than 3 colours and 3 fonts.

Of course, if your site is for selling stuffed unicorns or part of an organization whose logo has more colours, you can use more than the golden 3, but for the most sites having more than those will cause an inconsistency within the site.

Same goes for fonts, of course, exceptions can always be made of the rule, as each site is different and may have a different design palette, but if you are just starting on designing your site, choose up to 3 colours that would be seen throughout your site.

consistent web design

If you already have a logo, consider what colours are being used and start from there.

Have that same consistency with your buttons on your site. You might need different style buttons for different parts of your site, but try to make them consistent by either making them the same form factor and possibly colour.

Little things like this are what combines makes the design wholesome.

What colours should you use in 2019?

According to Canva.com the trending colours for 2019 are coral, pink, gold and neutrals, such as shades of brown, beige and etc. In general, the recommended colour palette is neutrals with a pop of colour here and there, so if you are unsure of the colour to use, or want to 'freshen things up' this might be the way to go for you.

neutral colur in web design

If you are just starting out, or already have a website which you would like to improve, you can always follow the basic principles for your site and if you are having any doubts or questions, you can always consult us.

Categories: Optimisation, Website Maintenance, Blogging