The typography you use in your web design does more for your site than you realise and when it comes to this fine art our basic goals are to select fonts and layouts that achieve the best visual effect as well as convey the meaning of your website’s message. Well that sounds simple enough, but is it really?
Some designers are still guilty of committing terrible crimes in this department and the aim of this blog post is to expose these horrors.
Lousy leading (aka line spacing)
Leading is an essential design aspect that determines how text is spaced vertically in lines. Too little line-spacing leaves the text looking cramped up and unpleasant to read, while too much creates a feeling of disconnect between the lines of type. There are no hard and fast rules to this so you have to use your discretion and creative judgment on what looks aesthetically appealing and legible.
Confusing tracking and kerning
Tracking refers to the space between letters across an entire word or phrase and is used to adjust type so that it fits a particular line length perfectly. Kerning is an adjustment of the specific space between two characters in particular. It’s often used to bring characters that naturally have a lot of white space around them closer to their neighbours. While small adjustments in either department are okay, adding too much tracking or kerning can reduce the legibility and readability of the copy.
Responsive web design is the approach that suggests that design and development should respond to the user’s behavior and environment based on screen size, platform and orientation. The practice consists of a mix of flexible grids and layouts, images and an intelligent use of CSS media queries. As the user switches from their laptop to mobile, the website should automatically switch to accommodate for resolution, image size and scripting abilities. In other words, the website should have the technology to automatically respond to the user’s preferences. This would eliminate the need for a different design and development phase for each new gadget on the market.
Overlooking widows and orphan’s
Many designers are guilty of this crime when working with text-heavy copy. When the final line of a paragraph contains only one word, it is referred to as a widow. When that widow jumps to start the next column, it becomes an orphan. Avoid creating widows and orphans at all costs because the result is often too much space interrupting the flow of the text. It’s an eye sore, don’t do it okay.
Overdoing faces and weights
Can we have a moment of silence for the countless websites that have died from a face and weight overload…One of the biggest mistakes designers, especially newbies, make is loading a website with too many fonts (typefaces) and weights. Too many typefaces and weights unsettle your reader and leave the design looking haphazard. As a general rule you should try and limit the number of fonts used to three. This is not set in stone and can vary depending on individual requirements but remember not to overdo it.
Leaving unreasonable line lengths
This is another one of those crimes that affects legibility. Unreasonably long line lengths can hamper your reader’s ability to understand what they are reading because they will have difficulty finding their pace on the next line. In general, it’s worth taking a cue from newspapers and magazines and limiting your content’s lines to a maximum of 75 characters.
