Features

Freebies

Inspirations

Interviews

Resources

Tutorials

Home » Features

The Allure Of Drop Caps In Typography – Practices And Resources

By Sneh Roy on Monday, 12 October 20099 Comments

 The allure of drop caps in typography.

Drop Cap is the first letter of a paragraph that is enlarged to drop down a couple of lines. A common fixture in print publishing from novels to magazines to beautifully illustrated childrens’ books, drop caps are slowly gaining momentum in the online word. Typography websites and blogs, especially those using minimal designs and themes are truly exploring the aesthetic value of the drop cap. My interest in drop caps got piqued after I was introduced to the Daily Drop Cap Project by illustrator and typographer Jessica Hische. On that website, Jessica strives to offer a uniquely beautiful drop cap alongwith the code to embed it in your pages everyday. Jon Phillips of Spyre Studios shows you how to add a drop cap easily and effortlessly via Css.

 There are the drop caps haters and then there are the drop caps lovers. I fall in the latter category of designers. I find drop caps very alluring in web design. They are different, sparingly used and hence quite unique. Using drop caps you can add an old wordly charm to your writing or present your ramblings in a bold, modern artistic style. Plain, minimalistic drop caps are great, but fancy ones add a touch of flair. Some of the most common sightings of drop caps are in picture books, fairy tales, on magazine websites, on minimalistic typography websites, in exquisite wedding invites, on design studio blogs and that one off quirky website of a designer leaning towards the whimsy. There is so much you can do with a drop cap. Understanding of typography again lies at the root of its usage. I have a list of excellent drop cap practices for your visual pleasure followed by another list of articles and resources that might be useful to the drop cap afficionado.

Older Graphic Designer

 Older Graphic Designer

 

Jason Santa Maria

 Jason Santa Maria

 

The New Yorker

 The New Yorker

 

Mark Boulton

Mark Boulton

 

Gourmet Magazine

 Gourmet Magazine

 

Pearsonified

Pearsonified

 

J Bradford Dillon

J Bradford Dillon

Drop Caps iPhone Game 

Some interesting Drop Caps articles and resources

1. Drop Caps – An iPhone Game
An interesting typographic experiment by Jason Franzen

2. Drop Caps 101 – Website Design
Summarizes everything neatly.

3. Multiple Fancy Drop Caps – Learning jQuery
Applying drop caps to every paragraph in a div.

4. Make A Newspaper Style Drop Cap – Blogspot Tutorial
A couple of nifty tricks for cool drop caps.

5. Floating Drop Caps – Web Css Tips

6. Hanging Drop Caps – Web Css Tips

7. Adding Drop Cap In Xara Extreme

8. Easy Drop Caps In Css – Henry Tapia

9. Pseudo Drop Caps – Jack Osbourne
Jack talks about how to rectify a problem with css that arises when you redevelop your site and dont want to upload the old drop cap images.

10. Easy Drop Caps In In Design – Dye Printing

11. Apply Drop Cap In Word

12. Drop Cap Wordpress Plugin – Rodney Campbell

13. Nested Drop Caps – Creative Mentor

14. Drop Caps And Formatting In Illustrator

15. Adding Drop Caps In Quark

16. Getting The Drop On Initial Caps – Layers Magazine

About The Author

Sneh Roy is a web designer/content developer by day and the creative force behind Little Box Of Ideas by night. She is also the co-founder of Stars We Love and Gel's Kitchen. With coffee running through her veins, she enthusiastically battles each day, one design [or maybe several?] at a time! Connect with her on Twitter.

9 Comments »

  • Michael Hoppal said:

    Hm. I suppose I fall between the two categories of designers here. I think drop caps can be executed well – as you said, minimalist designs tend to lend themselves to it much better.

    On the other hand, I think some people tend to overdo it. I’m finding with web design, though, the minimalists will always be minimal (no matter how hard I try, my designs are always simple and clean, and any flair I add turns them to poo) while those who lean toward gaudy will always be the same (A friend of mine, Logan, hasn’t designed a website without lots of bubbles within at least one element for close to two years).

    Jason Santa Maria and Older Graphic Designer implement drop caps well; Mark Boulton’s attempt seems more along the lines of my ailment: an over-done, out-of-place element in an otherwise well-flowing presentation.
    Michael Hoppal´s last blog ..Why Software Should Have Owners My ComLuv Profile

  • Jack Osborne said:

    Thank you very much for the shout out Sneh :) This is a great little article.
    Jack Osborne´s last blog ..The Glasgow Geek Nights My ComLuv Profile

  • MARTA SPENDOWSKA said:

    Thank you for this article.

    I love what Jessica Hische is doing with typography. Well, basically I love all her work;-)
    I think drop caps, if executed well ( they are not crowded for sure) , can ad an elegant feeling and make the article look more interesting.
    They should be an eye catching element, but still living in the background of an article/page of a book etc.
    Thanks again.
    A drop cap lover.

  • Iowa Personal Injury Lawyer said:

    I love drop caps and am glad to see that they’re coming about on the web.

  • Keith Davis said:

    Hi Sneh
    Found this site via “Pro Blog Design” – congratulations on a great site.

    I’ve never used Drop Caps but reading this article may change my mind.
    The examples that you give show what stunning effects can be achieved and your link to the CSS to implement drop caps will be useful.
    I’ll certainly visit the “Daily Drop Cap” site and perhaps in the future…who knows?

  • Sneh Roy (author) said:

    Thanks Keith!

  • Sneh Roy (author) said:

    You are so right Michael. I think over the top drop caps need more care and probably have a limited use especially on the internet. They are more appropriate for print publishing. I would really like to see more modern and bold usage of clean drop caps on websites.

Say Something! You know you want to.

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

This is a Gravatar-enabled weblog. To get your own globally-recognized-avatar, please register at Gravatar.

CommentLuv Enabled