I started learning about website design and development in the year 2014. And having done lots of work in this field I have this few things which newbies often don't seem to get hold of in the beginning.

This is because some beginners in web design will dive into learning Html, CSS, Javascript and after that with the little knowledge acquired they will start working for clients. This often led some to the verge of not designing something that is user friendly to their clients.

With my vast knowledge coupled with many years of experience, I put this little guide here to ensure that anyone who is in the field of web design sees it and having learnt Frontend development (website design) should not have to suffer much trying to figure out what and what steps should be firmly held while on the profession.

It's clear that

“As to methods there may be a million and then some, but principles are few. The man who grasps principles can successfully select his own methods. The man who tries methods, ignoring principles, is sure to have trouble.”

With that being said the following are the ten principles of web design.

You can call this ten commandments of web design but going with the word principles is worth it.

1. Responsive Design

According to Google Analytics, the percentage of those visiting websites on daily basis with mobile phones is 80% and above while the rest is been traded by bigger screen devices (laptops, desktops and tablets).

Also, browser differences is another thing you will consider though this is not too problematic in this 2020.

During my early days as a developer, I had a big problem making my website responsive in opera mini data saving mode but as years go I had to stop that support and concentrate on things that matter.

The principle here is to make the homepage lightweight. Stick to a winning combination of concise text and brilliant images. Additionally keeping it simple with a clean layout and ensure that the site is optimal for the device your visitors are using.

2. Use good colour mixtures.

This involves making your website content legible to your users. Initially, when I got to this profession I was very happy that I can design something shiny, using any type of colour for background and text.

Though it may look good to you but ensure that you don't mix up colours that your users will have to strain their eyes before they can be able to read out what your site contents say because visitors won’t care about how much time you put into making your website look cool if they can’t read your content.

For those who are into UI design, they are very familiar with this principle.

3. Use SVG for images.

Scalable vector graphics (SVG) have taken the internet by storm. It's obvious that about 98% of browser users can see SVG.

If you are in doubt about your browser being able to access SVG click here to run the check.

During my early days in web design PNG (Portable Network Graphic) was the majorly recommended image format. Though webp was recommended by Google, though major image editors such as Photoshop which I use for creating and editing my web images didn't support it so png was my go-to image format.

But currently, with the functionality of SVG, the short-lived portable network graphic (PNG) and Webp images will be left in the dust. SVGs work great for logos or any vector-based art.

You can as well include SVG by just copying and pasting the code and also using the common image tag. <img src=”svg url” />

4. You must  Make Site Navigation Simple

Majority of the website you visit has a common way of fixing the website menu and placing important buttons.

So for your users to find using your website very easily ensure that navigation is taken proper care of and not to put your users to work in finding means to navigate through your website.

Reduce the number of necessary clicks and provide more than one way to get to a given page for best results.

5. Ensure speedy delivery of web contents

According to Google Intelligent analysis, it is said that about 80% of users who visit websites that takes time to load a page will close it after 1minute and check out the competing website.

I'm used to doing that unless when I'm sure that my network is slow and I know that, that website is always fast.

Your site’s load time plays a huge role in user experience. Not only will you lose that prospective customer, but your site’s bounce rate may also increase if it takes too long to load. Don’t let something as simple as loading speed get in your way.

You can often check sure loading speed using Google lighthouse

6. Glue your Users On the Page

One of your main goals should be to keep web visitors on the page for as long as possible. The time spent on a given page can have positive impacts on your search ranking. You can create long-form content with an endless scroll to keep visitors on a page while doing what matters to them, this can provide you with more chances to optimize.

Aim to keep visitors around once they arrive.

Also having infinite scroll can help boost the page ranking on Google. This is the reason while some websites like ajazera, forbe etc have that feature where you jump from one blog post to another even without page refreshing and all content still on the same page.

7. Ensure necessary Calls to Action (CTA)

CTAs are commonly found in blog content, but they’re also part of web design. Buttons or fields that prompt visitors to learn more, schedule a call, or buy a product should be featured prominently in your design. Rather than burying them at the bottom of the page, make sure these elements are obvious to all. You can often make use of the sticky feature to make it more interactive to your users.

8. Make friends and use them for feedback

Currently, we are in 2020, and what was once fashionable in web design far back 2014 may be the next thing to be called old fashion.

The incessant update to Frontend frameworks is really making some old things appear unroyal any longer. Like initially people use CSS grid to properly display things on their web pages but when flex-box get an upper hand, if you have not known how to use CSS flex-box you will not compete in the industry of web designers.

9. You must use the optimum development medium.

Some websites can be better created with CMS. Like for instance if your intention is to blog, picking a good CMS like WordPress would be a good way to go. Though CMS sometimes when you download all the necessary plug-ins to achieve things in the future may affect the speed of that website.

So if you are intending for the best feature contacting a good developer who is able to do the task and explaining everything you need can be the best option

10. Include SEO Out Of The Box.

Things done on a website is never complete without SEO. So for your website to be complete you must optimize it for SEO otherwise you targeted audience won't even know that you existed online.

There are many ways to optimize a website for SEO, but the primary thing needs to be done right in the backend of your site. That way, you won’t have to make as many changes later on.

This few principles may not be what you can find elsewhere or found as another person’s recommendation but with it, I was able to work for lots of clients to their satisfaction and was able to meet their taste in order to recommend me to others. So with the little you know already put it to work and never stop learning.