The Internet is still in its infancy. Typography, however, is not. Typography is a fully adult mechanism of communication that has been around since the first cave paintings started to look more like letters than buffaloes and men with spears.
Gutenberg’s Mechanical Printing Press, The Masters Of The Renaissance and The Modernists all added their input to the evolution that has resulted in the honed delivery mechanism typography is today.
…so it is strange that typography is largely ignored in digital design and left to be determined by default browser settings.
Typography is much more than fonts
Typography is not just fonts or type faces. Indeed some of the history’s finest typographic works, “Illuminated Manuscripts”, were created in Medieval Europe long before fonts as a concept was invented.
According to Wikipedia: “Typography (…) is the art and technique of arranging type, type design, and modifying type glyphs. Type glyphs are created and modified using a variety of illustration techniques. The arrangement of type involves the selection of typefaces, point size, line length, leading (line spacing), adjusting the spaces between groups of letters (tracking) and adjusting the space between pairs of letters (kerning).”
An accurate description of the physical act of using typography but says little about why.
Why is typography important?
Successfully using the various techniques described above creates a sum greater than its parts. It creates a ambient and tailored environment that delivers the meaning of the words written to the reader. In fact, one could argue the best typography is the one you do not notice and doesn’t get in the way of delivering the message.
There are loads of examples of where the reader suddenly becomes painfully aware of the typography.
- Recently picked up a magazine where the letters were printed too close to the centre accidentally cutting off first (or last letters) of each line of text?
- Ever tried to read a cheap print of a book where the text lines are printed so close together the fonts blend into each other into an illegible mess?
- When did you last read and understand the small print on a document you signed? Give it a try next time. It is harder than you think.
Typography is also a great tool to help guide the reader. Pick up any newspaper and see how the different sizes in text makes headlines lead their stories and makes quotes stand out. Even without adding colours typography can create a hierarchy of importance on a newspaper page.
The new typographic aspects introduced by digital media
Knowing how to set traditional typography is the foundation to mastering digital typography but the on-screen environment brings some new opportunities to the table as well as some new obstacles to be aware of.
The biggest difference between printed and on digital typography is: Control. Printed typography stays fixed looking the same from instance to instance but typography created for screens need to be more fluid and accommodating as the display mechanism is more or less unknown.
Digital typography must allow for user-controlled font-sizes and more often than not be ready for constantly changing amounts of content as content-management-systems allows website owners to update content on a regular basis.
Reading on screens is harder on the eyes because of the low resolution and the light from screens. And additional limitations to visual delivery such as like low quality screens or small screens (mobile phones and other handheld devices) cannot be ignored.
Good typography online is also a legal requirement in many countries as it is part of the Web Content Accessibility Guidelines.
In addition to setting typography correctly, using shorter paragraphs, bold to highlight keyword and bulleted lists helps people read on screens as it breaks down the content into digestible chunks.
Typography also plays a role as navigation, a role that is unique to the digital environment. Not only does typography navigate the reader’s attention across the page, it also helps the user navigate through a series of linked web pages using the foundation of the Internet: The hyperlink.
Visit any website. Can you instantly recognise the links on the page? You can if they are made to stand out from the main content, but if they don’t stand out… well, you may be able to decipher the links as you read the content, but this is a much slower process and not something we, as impatient web users, are happy with.
Why typography is important to your business
Each year a significant amount of money is spent to create awareness of digital destinations and to drive customers to these websites. Taking care of those customers who successfully arrive is crucial.
Having a good user experience design helps users navigate around the website. Typography is part of good UX design but it also extends beyond the visit to the website as it makes the content easier to read and as such easier to remember.
The immediate benefit is customers can read and understand information about the products and confidently make a purchase decision and the long term benefit is preventing misleading understanding of the product descriptions leading to dissatisfied customers and even wrong products being purchased as a result of this.
- The Elements of Typographic Style Applied to the Web
- The History of Visual Communication (thanks to Cheryl Roshak for this link)
- Web Design is 95% Typography
Robert Fransgaard is a member of Capgemini UK’s User Experience and Rapid Design Visualisation team and a self-proclaimed digital native. You can find Robert on Twitter.