Departments
Departments
Departments
SUBSCRIBE TO NEWSCONTACT US
One of the most mundane tasks a web programmer or designer faces is the creation of (many) buttons. It is a tedious task. If we have the original PSD, we must then resize it, typeset a new button, save it, and then reference it from our anchor.
And this all assumes we have the original artwork. Many of us don't. Most of us have suffered this plight. And this just makes it even more tedious.
On top of all this, as we all know, search engines cannot index the text in buttons that we painstakingly made.
Frankly, I got bored of creating buttons like this every day at work; I'm a programmer not a designer after all, and the product of my frustration is a basic PHP class that generates simple buttons based on a template. The template consists of a left-image, a right-image, and a tile image for everything in between.
This obviates the need to make most buttons, but what about SEO?
Some of you might remember the article posted by Stewart Rosenberger regarding dynamic text (http://www.alistapart.com/articles/dynatext/). He applied Javascript and PHP together to dynamically change h1's to graphics. In a nutshell, Javascript walks the document hierarchy, looks for a specified selector (ex. h1.foo), and replaces it with a image queried from the webserver.
e.g.
becomes:
Kudos to Stewart for coming up with this fantastic idea. I have applied some of the same techniques to an automatically generated button.
e.g.
Camera repair
(<a href='http://www.camerarepair.com' class='foo'>Camera repair</a>)
becomes:
This has the desirable effect of making button creation almost like standard markup. Simply by applying a class to our anchor tag, we have a custom fabricated button. No trips to Photoshop, no font guessing. No aggravation.
It also has some interesting SEO implications. These graphical buttons will not plague keyword relevance. SE's should reference the anchor text as is. So, not only does this method provide a convenient solution to a mundane task, but it also enhances your site's search engine friendliness. So people looking for wacky widgets or camera repair, might just find your site first.
Please see the bottom of this page for a link to source code, and an example implementation. The code is well commented for those interested in the inner workings, but if you're not interested, just follow the examples.
If you have any questions, I can be reached at jsirovic@rustybrick.com.
Acknowlegements:
Stewart Rosenberger - Dynamic Text Replacement
http://www.alistapart.com/articles/dynatext/
RustyBrick SEO Articles
For more information on our search engine optimization and search engine placement services, please contact us at 877-GO-RUSTY or 845-369-6869 or via email at our contact page.
Barry Schwartz is the CEO of RustyBrick, a New York Web service firm specializing in customized online technology that helps companies decrease costs and increase sales. Barry is also the founder of the Search Engine Roundtable and the News Editor of Search Engine Land. He is well known & respected for his expertise in the search marketing industry. Barry graduated from the City University of New York and lives with his family in the NYC region.
This article is under Search Engine Optimization
There is 1 comment for this post
250 West Nyack Road, Suite #200 West Nyack, NY 10994
Get Directions
877-GO-RUSTY
877-467-8789
845-369-6869
845-228-8177
1 COMMENT