Hunting

Users go online as “informavores” – minds in search for tangid, sensible, usable, actionable information. Following the scent of information, they roam the internet, eventually either giving up the hunt or catching the game, starting up a fire and set up to consume their “meat”.

Eating

At this point where the user has mentally accepted to enter your house, and because this is not about real meat but about  information displayed on a screen or rendered through a screen reader, they expect to meat “meet someone”: a coherent and unified – albeit virtual – being, interpreting that great content they came looking for : a “voice”. Designer, either you strive to control that voice or you don’t, but it is there. All content that is experienced gets a voice. Hopefully, a convincing, coherent one that serves the purpose of the website. More often that not, that voice is disarticulated, incoherent, made of contradictory elements, like Frankenstein. Note that I consider myself as guilty as anyone for creating many frankensteins. It’s not an easy task.

Consuming information is 95% reading

Most of the information we consume online is of the “written” kind (remember the debate when iA stated “web design is 95% typography” ?). That is why it is crucial for people making websites to master the presentation and markup of  text on a screen, in both content (content strategy, storytelling and copywriting) and form (typography: hierarchy, colors, (negative) spacing and marking).

It is my belief that web designers can actually unfold the project into a coherent experience by taking the time to consider all aspects of the voice. Here is a proposal process, going from content strategy to copywriting to typography to graphic design.

Shaping a convincing voice –  a design process

1. Content strategy – determining the facts and the meaning

To use the word “strategy” might sound a bit dramatic – which is nice – but it’s really about answering 3 questions:

  1. what are the needs and motivations of the target audiences when coming on the website?
  2. How will that affect SEO?
  3. what does the website owner – the client – needs to put online? Content, transactions, etc. You really want to think about conversion here.

2. Copywriting – determine the story that most adequately conveys the facts and the meaning

On a phenomenological level, reading is really like “hearing” a voice internally – the reader recreates the facts and tells the story to itself – much like it puts hot water on lyophilized noodles to get a tasty soup.

Of course, that voice is a mental construct that your mind shapes based on “personality hints” given out by the form of the content. Therefore, a crucial design action is to pick the right words. 

In my experience, great copywriting combines the following qualities:

  • perfect spelling: each spelling mistake is a hit in the face of the speaker
  • accuracy: use the exact term, be as precise as possible. Did you know that the Sami People have hundreds of words for “snow”?
  • as simple as possible (but no simpler): most of the time, one should not have to read twice or thrice a sentence to understand it
  • terseness: reading is a very active mental state – the less words, the less toll it takes on the user’s energy
  • expressiveness or, even better, musicality: a text is better enjoyed if it “sounds” nice. Time to bring back the poet in you (or the slammer). No, you don’t need to go that far. But read the text aloud, to make sure it has the right tone.
  • rythm: related to musicality, the best way to convey rythm is to master the arts of punctuation. This is how you indicate when and how long the “voice” breathes and expires, if it is asserting or questioning, etc.

 

3. Typography

Many people – and even designers – tend to dismiss writing, opposing it to graphics. Well, quite the contrary, writing is probably the most powerful form of graphism. (Besides, type “A” in a Word Processor, set its size to 700 and see what happens… Ain’t that graphical? Anyway, typography is the art of representing units of sounds in a visual manner using an alphabet.  Simply put: shaping letters and the space in between. In between the letters, in between the words. You can get really creative with that.

Examples, maybe?

Colleague and friend François Bourgaux handed me an awesome example: Robert Massin’s interpretation of La Cantatrice Chauve by Ionesco.

Look at these pages. Don’t you hear them voices?

La Cantatrice Chauve d'Eugene Ionesco, mise en scène par Robert Massin © design + typo + photos peter gabor
La Cantatrice Chauve d'Eugene Ionesco, mise en scène par Robert Massin © design + typo + photos peter gabor
La Cantatrice Chauve d'Eugene Ionesco, mise en scène par Robert Massin © design + typo + photos peter gabor
La Cantatrice Chauve d'Eugene Ionesco, mise en scène par Robert Massin © design + typo + photos peter gabor
La Cantatrice Chauve d'Eugene Ionesco, mise en scène par Robert Massin © design + typo + photos peter gabor

That’s all for now. Thank you for reading this essay, I do hope i managed to respect the principles I advocated here. If you have any comment, questions or examples, please do use that dumb comment form here below.