A lesson in typography 2

This is the 2nd part of the typography tutorials. Sorry about all the bad spelling in the last tutorial. I’m not a good speller and it was late… Hopefully it will be better this time :D

Hopefully if you are reading this you have read my first tutorial. If you haven’t you can read it Here.
Now to get started:

Words I will be using:

Juxtaposition - Means the placement of an element side by side another to contrast the two elements.
Copy - The text that will be used in a design.

Visual Hierarchy

Now if you look at the typography of posters you really get a sense of visual hierarchy.
Visual Hierarchy is the order of importance of text on a page. Lets say we have copy that says:

Paramore is playing at the Portsmouth Guildhall,
Portsmouth, ENG on Tuesday February 26, 2008.

General Admission is $140

You have to differentiate what text is more important.
by the end you will get something like this:

I used a contrast technique in the last picture to highlight the “General Admission: $140″
Really all you have to do is just drop the text out of the background with a different color.

X-Height

So I decided that really you don’t need to know to much about x-height. If you want to learn more about I suggest taking a typography class.

Rotation

So to make your piece stronger you can rotate your text. I would not recommend rotating to much of your text so that the text is unreadable and confusing, but make a small rotation and it will give the text a little more dynamics.
So taking the first example and rotating it makes the design more interesting. Also cutting off letters, letting the letters run off the canvas can also add the composition

Opacity

The use of opacity can make your design really interesting to look at. The subtle qualities that opacity ads can really bring your point across.

Whitespace / Less is More

Sometimes your client will ask for a lot of information to be printed in a small area. This is probably the worst request that you will ever get when you design something. When you are not under those constraints try to live by the rule “Less is More”. You will find that whitespace is your friend. Try to leave enough space around your type to give it “Breathing room” if you want a perfect example of what not to do look at any tabloid.

Colors

If you find yourself looking for a good color palette I recommend this place: http://www.colourlovers.com
It’s a great resource for complementary color palettes. Using the right color palette is essential for your design to appeal to the viewer.

Text Effects

Not only can you use text for your copy but you can use your text for decoration too. Using decoration and ornament typefaces you can really spice up your design. Some nice typefaces you can use are:

  • linotype decoratio PI
  • WM Designs
  • Flower Ornaments
  • Mutlu Ornamental

You can get the last 3 at http://www.dafont.com

Shapes

Using enlarged geometric shapes shapes to contrast your text can really make your design interesting. Play with the juxtaposition of your shapes and the contrast it has with your text.

Well I hope this helps with your typography :)

To all those who requested things, I’ll think about them.
That is all I can say right now :)

10 Responses

  1. daver Says:

    Nice quick overview. I will check back if you feel up to more challenging design concepts

    cheers!

  2. Katalog Stron Says:

    Learning tutorial which gives me good advices and ideas.

  3. Avangelist Says:

    Colour Lovers is a blimmin amazing site, have been using it for a while now, totally awsome.

    Thank you again for the heads up on the kerning issue.

  4. John Says:

    Both of your tutorials are great and professional. loved reading and applying it. is there a chance you can put both of them on a PDF as a concentrated big tutorial? (unless there is more to come.. :)))

  5. funky Says:

    very nice topic, glad you covered it

  6. Sam Says:

    Hello!

    I featured you in my german blog: http://www.ephourita.com/blog/?p=67

    Have a nice day!

    Sam

  7. Mike Says:

    This is a good tutorial. Most people don’t put much effort on text.

  8. rache Says:

    more! more! more!

  9. Ivy Says:

    You are a great designer! :D

  10. tommy Says:

    thank you for the great tips. i wanted to know is the a way to do sort of like list, or column text in photoshop?

Leave a Comment

Please note: Comment moderation is enabled and may delay your comment. There is no need to resubmit your comment.