CSS3 Typography & Effects
Designers, Graphic Artists, Marketers and Animators have all but resigned to one harsh fact abou the internet - To play well with search engines one must abandon all hope of smooth fonts, dropshadows and glowing text. Flash gave us the ability to use anti-aliased typography - but it fell short as it was comprised of only images.
Without REAL text, any content on a flash-built website was basically a scribble on a wall as far as Google and Yahoo were concerned. Even now it's common practice to try the other alternative - creating nicely designed headers in Photoshop and using raw images in your web pages rather than text titles.
But, what if you're doing business on the web? You certainly can't afford to cram your website full of images that lend nothing to SEO - you've more than likely completely resigned to jagged, plain Sans-Serif fonts with no effects whatsoever.
The answer? CSS3.
Below are just a few examples of CSS3 typography effects possible using REAL text, completely SEO friendly, live and ready for Google.
Drop Shadows
Use: <span style="text-shadow: 1pt 3px 4px rgba(0, 0, 0, 0.85);">
Soft Dropshadows
Glowing Effects
Note: I've added an additional "note" class to make the background dark and the glow more visible.
Use: <span style="text-shadow: 0pt 0px 3px rgba(247, 190, 37, 1);">
- Views: 3066