- Fonts & Typography
- Image Use & Imagery
- Layouts - Traditional vs. Non-Traditional Layouts
- Content & Writing for the Web
- Colour Theory for Web Design
Fonts & Typography
Just as typography is important in day-to-day life, such as store front signs, magazine covers, advertisements, newspapers and magazines, it is just as important for the web. When using type for the web, you want to make sure it is easy for your audience to read, as well as aesthetically pleasing to your site’s overall look. Though it has been pointed out in the past that fonts with serifs lead the eye from one character to the next in print, it’s not necessarily so for the web. For one thing, you’re working with a limited number of pixels per characters, so things such as serifs may only serve to distort the letter and make it harder to read. Generally, a sans-serif font will look best and is easiest to read on a monitor.
When choosing fonts for a website, one must also take into consideration whether or not that particular font will be available to the audience and on which platforms, Mac or PC, so when designing a site, make sure it will look good with the available installed fonts your audience will have.
Image Use & Imagery
Graphics on a website can serve to enhance or detract from a website’s overall look and feel, depending on how they are used. Depending on the design, sometimes having more graphics could work against the intent of the website.
Images have to be used appropriately depending on the type of site you are building. For example, let’s take a look at what a website for a financial institution may require. Their target audience is usually one that comes for information, so not too many images are required, other than, perhaps a logo, their corporate colours, and some graphics that help maintain their corporate identity. People visiting this site may just want to come log on, check their account information, conduct financial transactions, or perhaps read up on services they offer, so there is no need to bloat the site with an overabundance of imagery. Keep things simple, clean, and easily accessible. Too many graphics would require the target audience to download all those graphics, when all they want is information, so by using minimal graphics, you are also cutting down on bandwidth usage, which could cost more, if there are a lot of graphics.
That being said, some websites may rely on slick, flashy design work because they may be selling a particlular product and it fits with their ad campaign, or perhaps it may be an artist with an online web portfolio, showcasing his or her work online, and may want the website to reflect their artistic style.
Also keep in mind that busy backgrounds can make the site very hard to read, so keeping backgrounds simple is usually the preferred choice. There may be, of course, certain circumstances where you may want a very exciting image used in the background. Just remember to use judgement on when it is appropriate.
When using graphics, one also has to take into account file size. If an image takes too long to load, your audience may lose patience and surf elsewhere, so images have to be optimized. This can be done with Adobe Photoshop or Macromedia Fireworks, where the final saved image balances image quality with filesize. If the image is lower in quality, the file size will be lower, if the image is higher in quality, the file size will be larger, so the trick is to find a delicate balance between the two.
Layouts - Traditional vs. Non-Traditional Layouts
When buildling a website, layout can be very important for accessibility. Traditional layouts, such as menu at the top or the left, are most common and easiest for your audience to navigate and find their way around the site, and suit the needs of most websites. If it is a site where there is high traffic for a product or service, this is the most ideal layout, since it allows people to find what they need without having to search around the page for the links. Examples of this would be ebay.com and amazon.com. Both are laid out so that people can easily find what they want, with navigatoins and hyperlinks to the left, product information to the right, and company header at the top.
Non-traditional layouts, allow the designer more freedom. They are no longer confined to the "norm" with navigation to the top or the left side, with header and logo at the top and content to the right, but allows for them to think outside of the box and push their creativity to the limits, or as far as web technology will allow anyway. Successfully designed non-traditional layouts should still allow for the audience to navigate through the site easily, as accessiblity is key to a successful website.
Content & Writing for the Web
When writing for the web, you have to keep in mind who you are writing for. Most people want their information as quickly and clearly as possible, so it’s necessary to keep the language simple for the general audience. However, if you are writing for programmers, there may be a lot of technical terms and acronyms involved, so abbr and acronym tags may be necessary for the average web surfer who may just happen upon the page. The key is to keep the language as clear and accessible as you can, without over-simplifying things for your target audience.
Colour Theory for Web Design
Coming up with colour schemes for websites can sometimes be a challenge in itself. You want to make sure the text and the background colours do not clash with each other, and that it is easily readable, so high contrast colours are usually reccommended. Black on white, or white on black are most common, but other colour combinations could just be as effective, such as yellow on black or yellow on purple. What you don’t want is to have colours that vibrate too much against each other, or are perhaps too close to each other in tone. You don’t want combinations such as red and green. Though they are on opposite ends of the colour wheel, they bleed/vibrate against each other, making it very difficult to read. Blue and purple is another combination you may want to avoid since the colour values are very similar and may cause a degree of bleeding and vibrating, thus making it difficult to read.




