Typography is a very powerful tool in a web designer’s arsenal. We have seen simple websites glorified in an instant with the use of proper typography. We have seen brilliant websites pale because the “type” tone they used was all wrong. Understanding typography and implementing its usage might be an art, but it is not so different from being in a society and adapting the etiquettes of proper language, behavior and tone.

Let us take a look at the Square Eyed Website for instance and try to analyze how they make the typography on their page talk to the visitors.

The Typographic Crescendo

Just like when you spot someone across the road or happen to meet around the corner of the street, you say “Hey Steve!” reasonably loud. You don’t take a pause and mumble something under your breath. When someone visits your website, you need that attention grabbing greeting that will make them want to hang around and see what else you have to say. I call it the Typographic Crescendo. It is that first impression that will linger throughout the day in their minds and make your website a little bit more memorable than others on the internet. In typographic terms, it has to be loud. Hence, the huge popularity of big type being used in websites nowadays. A slab serif or sans serif will do the trick perfectly. A font that is clearly readable and has just a tiny bit of distinguishing mark like a curvy “s” in this instance on the Square Eyed site will stay with the visitor. Pick what you would want your visitor to remember and put that in big, bold, beautiful type in the top one third area of the website. Let it be your “Hey Steve!”

The Type Tone

Using the right tone on a website is extremely important for the message you want to convey. When you talk to a client or customer, your tone is usually professional, a little bit casual, polite and approachable. You wouldn’t talk to them as if you were talking to your best buddy or to a 6 year old child who just dropped your phone on the pavement. You usually don’t talk too loud, or too fast, or too slow, or loud one minute and very soft the next. Now extend that hypothesis to the website when you are planning out the “tone” of your content. Depending on your site’s demographics, you want the visitors to your site to feel comfortable reading what you have to offer. Take the Square Eyed website for instance, they are using an engaging style of dialogue, but more importantly they have placed the right emphasis on using an appropriate tone. They come across as a group who are just trying to casually inform you of the work they are doing. There is no preaching involved and no sudden loud noises. There is no clutter.

The Type Tone would consider the following elements on a web page.

• The proper use of language.
• The proper use of an appropriate typeface to convey the message.
• The use of bold and regular typeface for emphasis.
• The number of words used in a reasonable sized square grid area.
• The proper use of punctuation and styles [for eg. italics].
• The proper use of kerning in a word and spacing between words.

Camouflaging Typography

In a real world situation, when you are a tourist in a new country, your words and lingo appear exotic to the locals and you stand out, which is a great thing. But you can’t be a tourist forever. You either go back to your home country or you decide to stay on. Now if you do stay on, the novelty of being that guy with the fun accent quickly wears off and you either get tired of repeating yourself or you adapt to the local language and lingo subconsciously. When you do something drastic with typography on your website, you will most definitely stand out and maybe start a trend. But you also run the risk of losing that wow factor pretty soon and then you are stuck with something glaringly different that just doesn’t work as well. And then you have to adapt.

One of the most powerful qualities of typography that a lot of people fail to explore and embody, is its ability to blend in and camouflage itself in a design. The letters and words become one with the layout, blending and working with the colors and elements. The words are there because you are reading them but they are so beautifully integrated in the design and layout, that you just can’t separate them into two different aspects of the web page. In the Square Eyed website, a lot of attention is paid to the color palette. The typography is in one color throughout the page, yet the page has dark and light bits. The contrast of the color of the type with the color of the web page is not very stark which makes the fusion seamless. Learning to camouflage typography in your designs is not only a fun process, but is the final step in creating a web page that talks to your visitors, doesn’t shout, doesn’t preach, doesn’t instruct; but just talks to them.