wiredfool

I think I’m done.

It’s designed for standards compliant browsers, there’s a hack for .png transparency in IE5.5 and 6, and there are apache redirects for older browsers that certain family members use.

My apache config file is using the following rules for checking older useragents that I know mangle the css:

# Rules to redirect IE3,4 & Netscape 4.x to the printer friendly template.
# Assume that there's a search arg.
    RewriteCond         %{HTTP_USER_AGENT}      Mozilla/4\.[567] [OR]
    RewriteCond         %{HTTP_USER_AGENT}      "MSIE [34]\."
    RewriteRule         ^(.*)$                  $1&print-friendly=true [NE]
#
# If there's no ?, then I need to switch the & to a ?
    RewriteCond         %{REQUEST_URI}                  [^?]
    RewriteRule         ^(.*)\&print-friendly=true$     $1?print-friendly=true [NE]

The hack for transparency is used in the logo at the top, and looks something like this: (this would be a plain image tag if not for IE/windows. grrrr.)

<span  
  style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader
  (src='http:\//static.wiredfool.com/wflogoTransWhite.png',
  sizingMethod='scale'); position: absolute; right: 0px; bottom: 0px; 
  display:block; width:340px; height:54px;">
    <a href='/' class='logo'>
      <img src="http:\//static.wiredfool.com/wflogoTransWhite.png" 
         width="340" height="54" align='right' border='0' 
         alt="wiredfool" 
         style="filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0)">
   </a>
</span>

The current image really doesn’t need 8 bit transparency for the background that I have behind it, since I really could have done a normal image antialiased to that color. But now I can change the color/image in the style sheet and make the browser do all of the antialiasing work for me.

So the browser compatibility matrix looks like:

Me: As Designed
Wife\@work: Uses PNG Hack, but ok.
Mom: Redirects to Print template.
Sister: Redirects to Print template.
XP Using Friends: Uses PNG Hack
People using good browsers: As Designed
Luddites: Accessible
Google: Accessible