CSS: Swamp text for images
So, I’m checking out CSS Zen Garden - I’m now using firefox because of all the cool extensions it has specifically the PNH Toolbar which lets outlines the blocks (ie. grids) on the page, as well as this one: Edit CSS which lets you see and EDIT the current page’s CSS and redisplays your changes in real time. (mentioned in the comments of this post, by Andrew Dupont) (THANK YOU for those!!!)
In doing so, I was examining the first Zen Garden page’s CSS which uses this trick to swap images instead of text. That is just so cool. (I know, all you CSS-freaks have probably known about that little trick for eons.)
April 2nd, 2004 at 10:41 am
Just a note to take heed of the Note that preceeds Doug’s article and to check out the Important Notes at the end of the article. In particular see Joe Clark’s ALA article about the acessiblity issues associated with this method (referenced in the notes).
As such at the recent SXSW, Doug “officially deprecated” the original method becasue the use of display:none to hide text prevents it from being read aloud in certain screen readers.
A host of alternative methods can be found here:
http://www.mezzoblue.com/tests/revised-image-replacement/
April 2nd, 2004 at 12:53 pm
You may also want to check out the Web Developer extension…
Cheers,
Chris
April 2nd, 2004 at 1:29 pm
dez - actually (if I remember correctly) the method actually used in that first zen garden design WAS different than what that article said to do… (it didn’t use that display:none;) - however it still credited that article for the tip.
April 2nd, 2004 at 1:31 pm
actually - that’s not right… I didn’t see it at first - but now I see the “span” under h1 which has the display set to none.
April 5th, 2004 at 8:50 am
I have been using Web Developer extension. Do you know if this PNH toolbar is better?
April 5th, 2004 at 8:56 am
Actually now having played around with the web developer extension - I think it has the same things and more than the PNH toolbar. (unless I’ve missed something)
April 8th, 2004 at 10:18 am
Welcome to the new and improved Puppy Pile! (Yes, there are no puppies here, at least for now… But that’s neither here nor there.) I’ve spent countless hours working on the layout and design for this page to give it…
April 8th, 2004 at 12:42 pm
Welcome to the new and improved Puppy Pile! (Yes, there are no puppies here, at least for now… But that’s neither here nor there.) I’ve spent countless hours working on the layout and design for this page to give it…