February 2008

2008 Redesign Updates

On the first of this year I launched the sixth version of this Web site. I set out to do a phased redesign by first changing the homepage and individual entry page designs. The new design extends my interest in vintage style, showcases more links and media, and keeps with the same identity as the previous design. I plan to rework each section of the site individually over the next few months.

Today I've updated the Movable Type templates to format comments. The updates reformatted the display of comments, the comment form, and the MT comment preview template to match my redesign. The comment display can be previewed here and here.

I've also installed the Movable Type Comment Challenge Plugin to combat comment spam.

The Final Word on Transparent PNGs

kylehaskins.com in IE6

It's becoming clear that the PNG image format is preferred for Web design. The JPG format might be a better choice for photographs, but PNG has many advantages over the prehistoric GIF. The PNG alpha-channel transparency seals the deal by giving designers Photoshop-quality transparency.

The only thing holding us back is a lack of support for transparent PNGs in Internet Explorer 6. While many Windows XP users have upgraded to IE7, it may be another year before we can fully drop support for IE6. There have been many different techniques to use the AlphaImageLoader filter to allow transparent PNGs in IE6, but one finally stands out in the developer community. It comes in two different forms, each applied differently, but both using almost identical code.

The IE PNG Fix v1.0 RC4 from Angus Turnbull is currently being using on the Apple Web site. You need the iepngfix.htc and blank.gif files, and apply the fix by adding behavior:url(iepngfix.htc); to your stylesheet. This can be done with one style for inline PNGs, and also added to individual styles if using transparent PNGs as background images.

The other form of this fix is SuperSleight by Drew McLellan. This one is published on the 24ways Web site and is well accepted by developers. It also promises to fix other issues with transparent PNGs in IE6 — issues besides just display. SuperSleight is applied by adding a conditional comment to target IE6 and load a javascript file that does all the work.

Even with these elegant hacks, IE6 still won't let you use background-repeat or background-position with transparent PNGs. For my personal Web site I rely on tiling a transparent PNG down the background, so in the end, I'm going to turn off PNGs for IE6 that are used in the background of this site.

« December 2007 | May 2008 »

Recent Comments

aleks:

Good one Kyle.
Why companies like avery support only MS Word is beyond me! How difficult would it be for them to supply PDF or EPSes?!?

Kevin Makice:

Have you seen these globes?

They may be a bit pricey ...

Dave:

Fantastic! Just what I needed. Thank you.

Kyle Haskins:

@Celso The navigation is a vintage typeface by Dinctype called Oceans11