Posts Tagged ‘typography’

6 tips to enhance your social media estate using basic website usability practices

Posted on: March 6th, 2012 by Fransgaard 3 Comments

By now both web professionals and their clients know there should be a “Home” button on a website as well as a “Contact us” button etc.

This knowledge of basic website usability can be put to good use on social media channels.

1. Understanding limitations

The biggest challenge to creating a good user/ brand experience across social media channels is the limitations to how much can be altered on the various sites. For example while MySpace allows more creative freedom, Facebook limits the visual changes that can be done in favour of keep a consistent Facebook experience.

The one thing you can count on to be available on all social media channels is text. Make sure to always consider copywriting and tone-of-voice.

2. Where am I?

It is good practice on websites to have a short introductory text on the homepage, landing pages and other entry-points to inform users they have indeed landed in the right place.

With social media profiles remember to fill out descriptions, info boxes, bios and similar to inform users where they have arrived. It is also a good idea to add proof or assurance of authenticity.

3. Where should I go?

Always link back to your website or one designated hub. This will essentially form the role of a sitemap of all your digital destinations as well as proof of authenticity.

Never link to the same site the user is on. I have seen too many instances of Facebook groups linking to itself, but the same goes for Twitter, Linkedin Groups etc.

4. Don’t call us, we will call you

Another best website practice is a clear contact option. However, on a social media channel this may not be a traditional contact form or an email address. It can be PMs directly to a moderator, a specific #help hashtag or something different applicable to the channel is use. The important thing is that all users know how they can get in touch with your company or a designated moderator.

5. Accessibility considerations

Creating accessible solutions go a long way to support usability. But how can we add accessibility to social networks, some which are.. not as accessible as they could be?

You can only do so much but you should do what you can. Here are some options to look out for:

  • Good Plain English combined with good online copywriting.
  • Make sure links are clearly identified as links both visually if possible as well as link labels that correctly identify the link target.
  • Make sure the colour contrast is good enough
  • Make sure the font size is big enough
  • Avoid using text in images, but if you have to make sure it is big and legible

6. The world wide website

A good way of approaching your social network is thinking about the entire web as your website. Which networks are forums? Which are support? which provides company information etc

This will also help you identify redundant networks or star networks you can really benefit from creating a strong internet wide presence that work together as a single ambient presence.

The business case for good typography online

Posted on: March 8th, 2011 by Fransgaard No Comments

The original version of this article can be seen at the Capgemini – Capping IT Off blog.

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.

illuminated manuscript typography

…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.

Further read