The hyperventilating and drama that embarrassed so many at the 2017 Academy Awards could have been avoided but for bad typography. As demonstrated by Benjamin Bannister at FreeCodeCamp, poorly laid out text was the start of this catastrophe.
“Typography is the art of and technique of arranging type to make written language legible, readable, and appealing when displayed” – Wikipedia
Here is the original screenshot of the Best Picture winner’s card
As you can see this doesn’t follow any of the rules of typography. There is no visual weight difference between “Moonlight” and the producers, and the title of the category is at the bottom and is in very small print. It’s also not very visual appealing.
Here is the card that Warren Beatty and Faye Dunaway had instead.
As you can see there is nothing to distinguish the print on the card. Most people read from top to bottom and add being on television with millions of people watching, it’s easy to see how Warren Beatty’s misread happened. It’s more surprising this didn’t happen before.
Bannister then shows an example on how using the proper typography could’ve have made all the difference.
Bannister’s version on the right is clearly much easier to read.
By putting the category up top and in a larger italic front makes it easier to know what is being presented. Also by having the winner and the film different sizes helps the reader more easily grasp the intention and meaning of the card.
This is just a reminder that, even if it’s simple, design matters.