Web Design Tips & Principles (Part 3)

Content & Copywriting

Use clear titles and headings, and plenty of sub-headings to break up the text on a page and add white space. Sub-headings are also great to 'frame' the next passage of text - and hint at what you're going to cover.

Breaking up text into memorable chunks will reinforce memory, and make a larger page feel much more manageable. You'd be amazed at the difference in legibility when you take a 500-1000 word article, and then break it up with insightful sub-headings. Very long pages may be more suitably broken up into a few sequential pages, with links connecting them.

Use bullet points and lists to help display information and break up more difficult concepts. Sometimes comparison tables are far more effective than a large paragraph of text.

Remember that whitespace is very important. A cluttered screen is hard to read and uninviting. Whitespace can also be used cleverly to direct the eye. Simply putting some extra whitespace around some text or heading can emphasise it.

Always spell-check your website content thoroughly before taking it live. Editing the content in a word processor (like Microsoft Word) can make this easier. It's highly advisable to get someone else to proof-read your work, as they'll pick-up on things that you won't notice.

Avoid overly long sentences and paragraphs. Try and keep your style of writing personal; answering questions and covering common issues that your readers will identify with. Remember the WIIFM rule: "What's In It For Me?"

Always remember that if someone has searched for and found your site through a search engine, then they can just as easily return to that search engine and find an alternative! There is rarely a shortage of information on the Internet... It's your job to ensure that your content captures your visitor's imagination - and keeps them reading through to your 'offer'.

Browser Compatibility

You should visually test and check your designs on all the major browsers; including Mozilla Firefox, Microsoft Internet Explorer, Google Chrome, and preferably Apple Safari too.

If you're using a PC, then you should always have Firefox, Chrome and Internet Explorer installed as standard. If you're using a Mac then you should always have Firefox and Google Chrome too, along with the standard Safari.

Mobile/tablet browsers, including Apple's iPhone & iPad and Android devices, are hugely popular these days - so keep those in mind if your site or content appeals particularly to that market.

Also, bear in mind that while Microsoft Internet Explorer allows embedded VBScript, all the other browsers would require JavaScript. JavaScript, and its cousin Ajax, are the only truly safe scripting languages for embedding in an HTML page.

There are several cross-browser testing sites which you can use to see how your web page will look across a variety of browsers. Some are free and some are commercial; many of them will provide screen-shots of your pages on each browser and across several operating systems to help highlight any potentially problematic areas.

A good habit to maintain, particularly at the start (while you're learning,) is to run your code through a web standards validator, such as the W3C (World Wide Web Consortium) online page validator at HTTP://validator.W3.org. This will help to highlight any coding issues you've missed, or bad habits you've learned!