This is the fourth part in this series of The Principles of Good Web Design. The other parts are listed below:
Good content is an often overlooked category of good web design. As web designers it isn’t usually our job to create any of the content itself but to get the best out of the given content through the design itself.
Imagery
Poor use of imagery can really drag the design of a site down and poor quality images (saving with too much compression) can make a design look messy and unprofessional.
Internet users tend to scan pages to find what they’re looking for and an effective way of helping them do that is making good use of images. Great imagery also helps to sell or promote a product or service.
Hungry For Change uses high quality background images.
Hungry For Change uses large, high quality images as backgrounds for different sections of their site.
Apple.com hompage
Apple’s homepage is built up almost entirely of images of their products so they know the importance or great quality images.
Use of images by Graze
Graze uses images to convey the message of the service they offer.
Search Engine Optimisation
Well written content can have a positive effect on search engine visitors. Look at things such as page titles and URL structures to help improve SEO.
Now, I’m not an expert on SEO so here are a couple of links explaining this better than I ever could:
Typography
Typography is something that could also fall into the layout article of this series but I have decided to include it in under content as is directly related to helping improve content. It could have even had its own article as it is a very important part of the web.
Effective use of typography helps content become more readable and the easier the content is to read for the site’s users. It also ties in well with whitespace as that can give text enough room to breathe, making it easier to read. See the following for a simple example of this:
An example of good typography
The above example of typography on a simple block of text has the line spacing setting to a comfortable height that makes it nice and easy to read. Below is an example of text with very little spacing, making it harder to read. Even if you have great content, fewer people will take the time to read it at all if becomes frustrating.
An example of bad typography
@font-face
Up until recently, font choices have been limited to a few common fonts that are installed on all operating systems. These are known as web-safe fonts as they are guaranteed to be on every visitors’ computer. With the introduction of CSS3, modern browsers can display embedded fonts through the use of a new property known as @font-face (check the comments of that link to see how to use it in Internet Explorer 6+).
Services such as Typekit are aiming to improve Typography choices on the web.
Headings
Header tags are also important to consider. Not only do they have a positive effect on SEO if used well, they help define sections of text. As we know, web users tend to scan a page to find what they want and by having clear headers, they are able to scan a page to find what they want to read easier.
Smashing Magazine do a great job of dividing sections with clear heading design
So there we have it, that concludes this series of articles. Please leave a comment below and if you’ve missed any of the previous parts, follow the links below.
This is the fourth part in this series of The Principles of Good Web Design. The other parts are listed below:
Thanks for the tips on Typography I have always wondered what works best for web.
good creativity in web designing may helpful for attracting costumers to use your site.
Content is the main key to any good website (in my opinion), but it can also make or break a design. A good design with poor content always spoils the website as a whole.
This is a good read and very useful for expanding the knowledge of SEO, typefaces and how to use backgrounds effectively.
Brilliant article! I think content is like truth, it depends too much on the way you say it
But seriously, this is really helpful. Thanks for posting
Outstanding article. I especially like the link to “how to do it in IE6.” When will that stupid beast just die already?
These tips on content are great for websites that sell a product or service… but don’t forget that ‘content is king!’ – especially when you’re publishing new content regularly.
Use open web fonts (for uniqueness), font stacks (for graceful degradation), and images to demonstrate or emphasize your product/service/post. Utilize them intelligently to bring your visitors eyes to the meat of your website: your content!
Lov this series of articles
thanks so much lov it…