I am currently taking my first typography class ever. Even though I try to focus on how to apply what I am learning to web design, most of the material and assignments are based on graphic design for print. It is because of this, that I have found this blogging exercise to be quite insightful.

http://99designs.com/designer-blog/2012/07/12/typography-trends-in-web-design-and-some-goodies-to-get-you-started -> This terrific article talks about some of the more current typography trends webdesigners are using. Among the things I learned that I can use to develop better sites are what font family types are good for specific situations. I have spent very little time with Slab-serifs, this article suggested they are being utilized for headlines, quotations and snippets of text (not body copy). Slab-serifs are good for sites or sections with very little text. I also learned what hand made fonts are and how many designers are utilizing them in their work. Something I did not like was an alleged trend that some designers are using 3, 4, or 5 different fonts within very complex grid layouts. I did not like the examples shown and do not plan on doing this. I prefer using 2 to 3 typefaces, 1 for headers, 1 for body copy, and 1 for global navigational links. Another font type I had never heard of is Rugged type. I really enjoyed the retro-looking examples used to show how this type of font is being utilized. The article also provided two links I found extremely useful. 1 provides outstanding examples of Google Font combinations, and the other shows the most popular fonts used by designers.

http://www.smashingmagazine.com/2012/07/24/one-more-time-typography-is-the-foundation-of-web-design -> This article introduced me to Oliver Reichenstein’s Web Design is 95% Typography. Though the book is old, and I can’t say I agree with the title, the article was pretty enlightening. I enjoyed the examples provided of websites and designers who choose to rely heavily on typography with little emphasis on images. I plan studying some of these carefully for inspiration with the hopes of achieving such a clear and consistent personality through the use of type and layout. The personality and differentiation factor achieved by these examples is beautiful. It really distinguishes these websites from the crowd. The use of contrast and concord is exemplary.

I came across these 3 websites searching for more on qualified designers and developers with outstanding use of typefaces.

  1. http://www.skullcandy.com/supremesoundjourney -> This design just blew my mind. I would have never imagined improper line-spacing could work so well with headers. The fonts and color contrasts used for emphasis are utilized extremely well. The fonts seem to fit each personality shown perfectly. If you scroll down you will also be amazed! I have no idea how this type of scrolling and perspective change was done, but I must learn it. Beautifully done. Something I also have not seen used before is using extremely bright objects to capture attention, while making some sections of a header letter disappear. Just enough of the letter is left so the brain can complete the full letter and word.
  2. http://www.imagineourymca.ca -> I like the opacity of the textbox background and how the designer managed to pull off the use of huge text size and weight. This is one of very few sites I have seen that managed to use this well. I am not sure I will ever be using such large sizes and weights, but the use of opacity will most certainly be experimented with.
  3. http://www.newbabylon.com.au -> I will use this as inspiration for a simplistic and minimalistic approach producing outstanding type. The contrast and harmony achieved by the type and layout is simple, yet adds such a powerful and elegant personality to the site.

There are so many great examples and tools on how to utilize typography to develop amazing websites. I hope to one day use type to reflect the theme, ambiance, uniqueness and character that I want users to feel when they visit the site. This is something were examples and articles can greatly help, but experience and experimentation will most likely be the key.           

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: