Image Gen for fonts and the Shea replacement technique
Hey guys
I am using imageGen for font replacement and it works great, but I want to use the Shea image replacement technique so that my content is still accessbile and nice for SEO.
setting the images that imageGen creates is no problem but in order for the technique to work I need to know the height of the image, this is a problem with dynamic content.
Has anyone come accross this, have you found a solution.
1. You can force the height of the text image ImageGen creates. This would work well for text on one line. If you have multiple lines of text you would either need to increase the height= parameter so that all text images were very tall, and use transparent gif or png formats and maybe some css z-ordering to keep the extra-tall text image from getting in the way.
2. You could use jQuery or similar to get the dimensions of the image once it has been downloaded to the browser and then use that height in the image replacement technique.
Yeah those were the two options we had thought might work as well the problem with option 1 is that I can imagine it being a nightmare to cross browser test :s
and option 2 would be scuppered by someone having JS turned off.
Will give it a think and see what we come up with.
I'd also go for option 2 and set a default image height for 1 line of text. Then even if js is turned off most of the time it'll look okay anyway. The combination of a visitor with JS and more than one line of text will hopefully be very small. And I think they would still see the text, it would just be squished (assuming you don't clip it with other css settings).
Let us know what you end up with and how you did it.
Image Gen for fonts and the Shea replacement technique
Hey guys
I am using imageGen for font replacement and it works great, but I want to use the Shea image replacement technique so that my content is still accessbile and nice for SEO.
setting the images that imageGen creates is no problem but in order for the technique to work I need to know the height of the image, this is a problem with dynamic content.
Has anyone come accross this, have you found a solution.
thanks
L
I can think of two potential solutions...
1. You can force the height of the text image ImageGen creates. This would work well for text on one line. If you have multiple lines of text you would either need to increase the height= parameter so that all text images were very tall, and use transparent gif or png formats and maybe some css z-ordering to keep the extra-tall text image from getting in the way.
2. You could use jQuery or similar to get the dimensions of the image once it has been downloaded to the browser and then use that height in the image replacement technique.
cheers,
doug.
Hey thanks doug,
Yeah those were the two options we had thought might work as well the problem with option 1 is that I can imagine it being a nightmare to cross browser test :s
and option 2 would be scuppered by someone having JS turned off.
Will give it a think and see what we come up with.
Thanks for your help.
L
I'd also go for option 2 and set a default image height for 1 line of text. Then even if js is turned off most of the time it'll look okay anyway. The combination of a visitor with JS and more than one line of text will hopefully be very small. And I think they would still see the text, it would just be squished (assuming you don't clip it with other css settings).
Let us know what you end up with and how you did it.
cheers,
doug.
is working on a reply...