9.6. Shadowed Text Without Graphics

One of the most effective ways of setting off a headline and giving a Web page a professional look and feel, is to use shadowed text, or text that looks like it's standing off the page with a shadow behind it. All graphics tools make the creation of such text effects trivial, but they all suffer from one drawback: the text they draw is not true string text that can be searched, indexed, or translated into other languages. And, as graphics, they'll always tend to load more slowly than pure text.

Using CSS positioning[3], you can create shadowed text effects that are as good as any graphics program, without giving up the advantages of pure text on your Web page.

[3] In fact, CSS2 has a text-shadow property that ...

Get HTML Utopia: Designing Without Tables Using CSS now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.