Deprecated Content

Our News & Blog has been around since 2009. Some older articles may be formatted for styles and layouts that have since become deprecated. I've left them up, rather than removing all the old articles. Please excuse the broken links and feel free to comment or email if you're unable to view any of our old articles.

June 13, 2011

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);">


Glowing Text

  • Views: 3028

Tweets @themicrotechs

On Instagram @themicrotechs

"this is how I always envisioned our website. fantastic job!"

Dave Shapiro, CEO, Cartelligent
Oakland Athletics Logo
Read about the custom system we developed for The Oakland Athletics

CMS Web Design

Custom Joomla & Wordpress
Since 2008
The Microtechs, LLC P.O. Box 13 Antioch, CA 94509
SF Bay Area Web Designer & Developer Since 2008
© 2008-2019 The Microtechs, LLC