Type Fun01: A Typography 101 website I made for my Digital Interaction class

willryan42's picture

I made this introduction to typography website a couple weeks back for a class project. I wanted to give the basics of type in a super dumbed-down way. What do you guys think?

http://willryan.us/typefun01/

cerulean's picture

Pretty nice. I especially appreciate the effective brevity of your typeface vs. font explanation.
I'm using Firefox on Windows 7, and the mouseover part doesn't work.

willryan42's picture

Aw man, I'll have to look into that. Thanks for the head's up!

HVB's picture

A good, terse, effective, introduction. I'm also using Firefox on Windows 7, and the mouseovers work fine for me. I think that some of the text samples (on the right) are too small and too dense to be seen easily, In particular, it's very hard to distinguish the three different justification examples - hard to see the title and hard to see the differences. - Herb

willryan42's picture

Thanks Herb. Are you talking about when you click on the examples, or just the thumbnails themselves?

HVB's picture

I was referring to the thumbnails - quite honestly I didn't even realize they could be clicked on! However, my comment on the alignment examples still holds. They aren't sufficiently ragged to be noticeable. Similarly, the rivers aren't wide enough or long enough to be really disturbing (even if they're quite realistic). Pedagogically, exaggeration can be more effective than subtlety.

Té Rowan's picture

http://da.wikipedia.org/wiki/Horeunge_(typografi)

This is in Danish, sorry about that. The text describes typographic terms with examples folded into the text. F.ex., the paragraph on rivers (flod)... well, a river runs through it.

Joshua Langman's picture

"the basics of type in a super dumbed down way"

I think you succeeded in doing that — but who is your target audience supposed to be? Are the people whom you want to read your site likely to want things presented in a dumbed down way?

I think there's a fine line between simple, laid back, and easily understood vs. patronizing. I'd be wary which side of the line you fall on — it's always good to be funny, but being "fun" in the way you're being might suggest "childish" or an attitude of talking down.

As an exercise, it's well done.

Mans's picture

Excellent work! One thing struck me as odd, though: in the Anatomy section, the bracket marking the ascender of ‘l’ only includes the part extending above the H-height. In my opinion, it should include everything above the x-height.

Chris Hunt's picture

responsive design should be considered for all websites today. ergo, you should consider using responsive design for your site.

it's more work, but it solves the very real problem of people accessing your site from any number of devices.

developer tools in chrome has an option to run an audit https://developers.google.com/chrome-developer-tools/docs/console. use it if performance is important.

Chris Hunt's picture

responsive design should be considered for all websites today. ergo, you should consider using responsive design for your site.

it's more work, but it solves the very real problem of people accessing your site from any number of devices.

developer tools in chrome has an option to run an audit https://developers.google.com/chrome-developer-tools/docs/console. use it if performance is important.

Syndicate content Syndicate content