Alex Locke Designs | ADVANCED SCRIPTING LANGUAGES
61
archive,tag,tag-advanced-scripting-languages,tag-61,ajax_fade,page_not_loaded,,select-theme-ver-3.4,vertical_menu_enabled,wpb-js-composer js-comp-ver-4.12.1,vc_responsive

Week 6: Font Conveyance

“Select a dozen contrasting fonts from your collection. Look them over and consider the “voice” that is conveyed through the characters. For each font, come up with two words whose meaning is amplified when presented in that particular face. Next, find a word whose meaning directly contradicts the look—and—feel of each of the fonts chosen.”
Click image below to view larger.
fonts-01
spacer-13

Week 3: Emphasis & Alignment

I recently read an article about readability on web pages, and it mentioned a lot of good stuff about do’s and don’ts on fonts.  The article quickly covers these topics:

  • Don’t use too many font sizes
  • Use sans-serif face for all body copy
  • Don’t use too many typefaces
  • Emphasis
  • Alignment
  • Contrast in text
  • Case / Capitalisation
  • Spacing text
  • Text block size

One example of a site that I frequently use is Abduzeedo.  They focus on design blog on many different levels.  They have a section where they interview different artists.  I wanted to show how Abduzeedo uses emphasis and alignment in the interview posts.

Screen Shot 2013-07-30 at 2.30.29 PM

They use great emphasis in this article and through out the entire website.  The title is bold and big and stands out from the other text.  The short description is below the title and is not as bold.  The paragraph texts is shown next and it’s clearly a much small font.  All the font’s on the page are Sans-Serif.  Right beneath the opening statement you see links to where the artist is also on.  The links are in bold and underlined to give emphasis on the link.

Screen Shot 2013-07-30 at 2.56.41 PM

And if you scroll down a little more you’d see the more writing in the paragraph.  The alignment is left aligned.  It’s not justified.  But this type of alignment is easiest to read.