grapefeed

weblog

20040913.101446 Layout Dilemmas

For the last several months, I've been tinkering in Photoshop and Dreamweaver, trying to come up with a viable new layout. (Or at least, a more visibly striking one, compared with the plain boring boxes I have here now.) I've gone from concept to concept, throwing out many ideas I deemed craptacular in the process.

I'm finally on the verge of implementing something I'm rather pleased with. To date, it's my most challenging design, and not just for the usual reasons, it turns out. I'll start with the usual ones first.

I'm relying heavily on CSS to set up the layout on my page, and my results are mixed For starters, the layout doesn't center as perfectly as I would like it to. (I never liked layouts that clung to one side of a browser window as if trying to save its own life.) In IE/Mac, Safari and Mozilla, the layout sits just left of center; it clings to the left completely in IE/Win. I know there's an IE workaround for this somewhere, I just need to find my bookmark. (Why IE needs a workaround to begin with is ridiculous. More on that in a bit.)

The navigation bar seems fine in all browsers except IE/Mac and Opera. IE/Mac has each item in the bar listed verticall rather than horizontally. Opera seems to shift them up a few pixels higher than they should be. The Opera problem isn't a dealbreaker, so I can live with it. Again, the IE/Mac problem requires a workaround.

The headlines are generated by what's called Scalable Inman Flash Replacement. Basically, a Flash file, prompted by a javascript file, to replace designated headlines in the font of my choice with a Flash image that takes up the same amount of space the headline would have in plain old HTML. (This evidently got upgraded to 2.0 today, much to my chagrin.) The version I'm using works fine everywhere... except Opera. I have the headline backgrounds set to be transparent. Opera displays them with green backgrounds. (IE/Win does something similar with PNG files. Again, more later.)

In every browser I've tested, the content and the sidebar don't line up quite right at the top. The content column (left side) is significantly lower than the sidebar column (right side). I've seen sites (Jeff Croft's, for example) that seem to use this to their advantage, though personally, I'd rather they be lined up correctly. I suppose that's just my anal retentive side poking through.

With this new layout, I'm working with PNG image files over GIFs for the first time. Many ignored PNGs at first, but PNGs are now becoming the preferred image file format for web designers. This is largely due to their superior transparency abilities over GIFs. For instance, my layout features a patterned background, over which my content is placed. The content's background features drop shadows on its edges, and as the shadow degrades, you can see the pattern in the main background behind it.

This works great in just about every browser... except IE/Win. PNG transparency still doesn't function properly in IE/Win, though it's okay in IE/Mac. Transparent PNGs display with a gray background in IE/Win. I can't achieve the nice shadow effect with a GIF, unless I make the page background a solid color. I invested a lot of time creating that background, which I absolutely love. I'd hate for it to be all for nought.

Evidently, there are workarounds for this, too, which I'll probably toy with. Why should I have to in the first place, though? It's not my problem neither IE/Win nor IE/Mac doesn't totally function as it should without them.

Well, by not keeping their dominant browser in step with their competition (namely Mozilla and Opera, among others), Microsoft has indirectly made it my problem. They've given me extra work to do when I really shouldn't have to. IE/Win needs an updating -- quickly -- and it needs to be released before Longhorn finally makes it way out of the gate in 2006. (Microsoft froze production on IE/Mac in mid-2003; since most Mac users I know don't use IE, I'm not too worried about it.)

It's not just the transparent PNG file support or the clingy layout workarounds, but it's also the constant security flaws that continue to crop up. Sure, Service Pack 2, another project that took far too long to reach the finish line, fixes many vulnerabilities. Given IE's track record, though, how long will it be until another hole surfaces? Not long at all, in my opinion.

Microsoft, I hope you're listening. If you want to keep your browser dominance, you better put out with a non-crap browser.

comments on this entry

got something to say?










remember personal info?






trackbacks

TrackBack URL › http://precrash.grapefeed.org/mt/mt-tb.cgi/418