The principles of web design for beginners

These days building a website couldn’t be easier. With so many different software packages available, there’s no need to have any technical skills. All you need to do is get the design and content right, and the coding will all be done for you. Assuming you’ve already got a domain name and arranged hosting for your website, let’s have a look at the basic principles of web design and how to create a good, professional-looking site.

(Please note that this article aims to convey the general basic principles of web design and not to provide technical guidance. For information about the technical aspects of building a website, see the other articles on this site.)

Whatever the purpose of your website, it should always be easy for any user to navigate – and this includes people with disabilities. It’s not just good practice, it’s the law. The Disability Discrimination Act requires all companies to make their information accessible to everyone. It’s therefore essential to make sure that your website is compatible with tools such as screen readers as well as being easy to read by eye, with clear, plain typefaces and minimal use of unnecessary graphics.

The purpose of your site

When you’re creating anything, the first important stage is defining the purpose and objectives of your website. Don’t think about how you want it to look yet. Instead, focus on what you want it to achieve. Build up a picture of your intended audience and try to understand their needs and tastes, and design the site with them at the forefront of your mind at all times. Your website will be no use if it doesn’t do what people need or want it to do.

Now consider what you want the website to do in order to achieve the objectives you’ve just outlined. This is the stage where you think about the functions and features that the site will have.

The structure of your site

Then it’s time to form a structure for your site, to arrange the content in a logical and easy-to-find format. Effective ‘information architecture’ is essential – if you don’t put your content in the right place, users will become frustrated and will go to another site.

Don’t just think about how you would structure the information – think about how the users would structure it. For example, they may prefer to find out about all of your services by local area rather than have to look at each service separately and then have to figure out where their nearest one is.

To help you visualise the structure of the site, it can be helpful to draw up a flowchart with a box for each page.

The content of your site

After the structure of the site has been finalised, it’s time to think about the content. Web content isn’t just about finding text to fill blank pages – what you write needs to be relevant, concise and attention-catching, and this can take a lot of time and thought. Writing for the Internet is a specific skill and quite different from writing for printed media. Text is more difficult to read on screen, so people’s attention spans are shorter and it’s therefore crucial to say what you have to say in a succinct and appealing manner.

Choose your typeface carefully too. Sans serifs are much easier to read on screen. You should also choose a size that’s easy to read without straining the eyes, and make the page easy to print so that people can read it easily on paper if they prefer, especially if it’s important information.

As well as textual content you’ll probably also want some graphical content to liven up your site and enhance the information you’re providing. Don’t use a graphic for the sake of it though – make sure it’s necessary and improves the user’s understanding and experience. A site full of graphics can look clumsy and amateur, and it can be a real obstacle for screen readers and other accessibility tools. Also bear in mind that many people may still have dial-up connections, so they may find that pages with several graphics take a long time to load.

The same principles apply with video clips, sound clips and animation. Use them sparingly. If they enhance the user experience and contribute significantly to the user’s understanding of the information you’re trying to convey, then by all means include them, but don’t pepper them all over your site for the sake of it.

The layout of your site

Now it’s time to work out where all the information will sit on the page. Most website pages have standard layouts, with a header and footer, a horizontal navigation bar along the top, a vertical navigation bar down the left of the page and a central section for the main content. Your site doesn’t have to follow this layout, of course, but it helps if you maintain a similar layout across the pages of your site to help users find their way around more easily.

Try to make the layout of your screen a manageable size even for the smallest of screen resolutions, so that users won’t have to scroll to find everything on the page – there’s nothing more annoying to many people. If there’s a lot of content, split it up into several different pages rather than include it all on one very long (or wide) page.

The design of your site

Have you noticed that this is the first mention of the design of the site? This is a cosmetic aspect and as such is not the highest priority (although a professional look and good branding is nevertheless important of course). It’s really the last thing that should be tackled after you’ve sorted out the purpose, structure, functionality and information and ensured that the site works in a useable format for your intended audience.

The visual design of your site can be the most fun part, where you can let loose your creative side. Don’t get carried away though – remember to bear in mind the purpose of your site and your intended audience, which you looked at in the first stage of the build process. You want to convey an image that your users will relate to, as well as a professional look for your business and consistency to increase familiarity of your brand.

The launch of your site

Whenever you finish a piece of work, no matter what it is, it’s good practice to check it over and test it. There’s nothing worse for a customer than finding spelling mistakes in your content or clicking on a link that doesn’t work. Make sure it all functions effectively and reads well before you launch your site. If you’ve built the whole thing yourself, it can be difficult to spot any mistakes, so either take a break from it for a day or so before you go back to check it, or get someone else to check it for you. Getting someone else to do it is preferable as they will approach it as a user would.

The work doesn’t stop as soon as you’ve put your site live. A website is pointless if it’s static – in which case it’s no different from a book or other printed media. The beauty of the web is that its ability to provide people with accurate and up-to-date information and news and interactive functions. Keep reviewing the site to make sure it’s always up to date. If you don’t, people won’t come back.