For those of you who have become accustomed to replacing your heading-text with images, then you know how cumbersome it is to generate the images and to maintain them. It often requires firing up the old PhotoShop, choosing an elegant font in which you use to type in your text, create the image and upload it to the server. Don't forget to update your Html as well. If the heading text changes ... well back to step one. Text styling is dull and boring web design process and can be an all too time consuming process too.
Now you can forget all that nonsense. Using JavaScript and PHP, you can generate accessible image-headings using any font you like. And you don't have to change the structure of your HTML or CSS at all.
Dynamic Text Replacement is an article at A List Apart which describes the process in detail. They also will provide you with the php/javascript files to effect this change.
View the demo to see Dynamic Text Replacement in action, then view the source code. Your browser is displaying images for the heading text, but the source contains simple (and very spider friendly) H1 & H2 elements. No span tags or CSS class elements at all. This is one nifty little trick.
No comments:
Post a Comment