Ten Principles of Web Design
This is by no means a be-all and end-all Guru's guide to every aspect of web design. However hopefully this article can provide some key pointers for good design, these are some tips I have picked up along the way.
One) Use white space. Long gone are the days of cluttering up your website with every chunk of information you can think of.
People will gladly turn to a competitor's website than yours if they are made to read through pages and pages of prose and if they are overwhelmed with too much information no matter how relevant and interesting it may be.
Break your content down, only include what is absolutely relevent and write in short prose (more paragraphs!).
Two) Be organised in every way. Keep your files, folders, images organised. Use a consistent naming system for your files and images so it is easier to find something later when the project size increases. Make sure to back up regularly on the same computer and somewhere else in case the worst happens.
If you are coding be organised there too, make sure you format code well – a lot of HTML editors now provide some sort of auto-formatting.
Keep different blocks of code spaced out, use commenting where necessary. Imagine that one day someone else is going to need to use your code, so make it as intuitive as possible.
Three) Use a complementing colour scheme. Pick one or two colours and find the right colours that complement them well. There are colour scheme pickers on the internet which can help you choose once you have a base colour.
Always ensure foreground and background colours have sufficient amounts of contrast – white text on a black background works fine but a light grey font on a background may have legibility issues particularly for users with visual impairments.
Four) Choose a design style and develop it. There are numerous ways to design a website. Find what works best for you and develop your skills in it as much as possible.
Design styles include minimalist websites, websites based on nature, media websites such as a website for a new film and many more. See what is out there and find out where your strengths are.
Five) Learn to code if you have time! There are of course other ways to build a website, plenty of visual editors now exist.
However taking the time to learn HTML and CSS means you can be more unique and original in your designs and more precise. They are not difficult languages to learn so give it a go!
Six) Don't go crazy on the fancy stuff! The internet is becoming a powerful tool these days. There are so many tools available now to make your website visually more appealing and more interactive.
JQuery, Flash, HTML5 animation are more can bring rich content to your customers screen. However use these tastefully and sparingly.
Focus on usabilty first: it is of little use to have the fanciest website ever if the content does not show as your customer is using a slow connection or an old internet browser.
Seven) Be responsive! Responsive design is the big buzzword at the moment and for good reason.
What this entails is making your website fit into any screensize. From high-spec PCs, laptops, tablets and smart phones – people are using the internet on numerous different machines.
Take your time to run through some responsive web design tutorials!
Eight) Keep learning. Web design is an ever-changing beast, easy to learn but impossible to master.
Even the best designers are constantly learning and updating their skill-set. New design trends appear every year, new technologies and better and more powerful software appears.
Nine) Study what makes good design. Look up examples of great websites. Note what they do, how they achieve it. Write down what is good and what bad and how you could do better.
Ten) Content is key. Learn to keep your content concise and readable so your customer can scan over it quickly and understand what your website is trying to achieve.
Use word spacing and letter spacing correctly – not too much and not too little. Find a good font for the web and colour, make sure it is completely legible!