As much as we would like it to go away, the sad reality of web design today is that there is still a significant number of people out there who surf the web with Internet Explorer 6. And, in many cases, it’s not their fault – they just can’t help themselves! No, really, they can’t – because they work in corporate environments where their IT department has their machines locked down. For those of us who have had the dubious pleasure of experiencing a large corporate IT department, you know how slow they can be in upgrading anything. I’ve heard anecdotes as recently as a few months ago or departments just now beginning their move from Windows 2000. Sad, but true.

As a web designer, the need to support Internet Explorer also means that you have to make a ton of other trade-offs. One of which, I myself had (un)happily accepted as a fact of life, the inability to leverage PNGs for transparency. Now, before we go any further, I realize that there are several Javascript approaches to achieving transparency, but none of the ones that I have tried have “worked” in every circumstance. That’s why I was so pleasantly surprised that a solution had been under my nose for many, many years and I simply hadn’t known about it. (more…)

The subject of image optimization always crops up during my seminars, and one of the “oh, wow!” moments for almost everyone in the audience is when I compare JPEG optimization from our beloved Photoshop and Fireworks. As everyone who has seen this knows, we get a much smaller JPEG out of Fireworks. But for those of you who have not had the chance to check this out, I wanted to document it here.

To follow along, you should find your favorite uncompressed picture, or if that’s too difficult to find, you can download my RAW image – even if you try this with a compressed JPEG, you’ll still see a dramatic difference. But the optimal workflow is to start with the highest quality possible. I always shoot in the Raw format for many reasons – not the least of which is that I get that completely uncompressed image. If you have a Raw image, you’ll first make any desired adjustments in Camera Raw and then open it in Photoshop CS4.

Save the file as a PSD, since we’ll need it in a few moments. And if you’re working with a RAW image, that means that you’re probably dealing with a rather large image size – my image is a 12 megapixel shot. For this example, I’ve scaled it down to 350 x 233. In order to get the smallest possible JPEG out of Photoshop, it is important that you do NOT try a “Save As” and select JPEG. Instead, we need to go through the “Save for Web and Devices…” process (in the File menu).

(more…)

It’s unfortunate that most web designers and developers pay little-to-no attention to their sites on anything but a browser running on their local computer monitor. The thought of designing a page to display properly on a mobile device or set-top browser rarely gets any braincells thrown at it. This is somewhat understandable, given the fact that the mobile browsing space is in such disarray.

But it frustrates me to no end when I need to save or print a web page, only to be given something that is at best barely useable. I’m sure most of us have had the pleasure of the four-page-print-phenomenon in which a seemingly simple web page causes the printer to spit out three additional (and completely blank) pages. It’s not rocket science to create a print stylesheet, but only the cream of the crop take the time to do it.

I think one reason that many Dreamweaver users don’t do it, is not only because they have the misconception that it’s difficult, but also because we did a really good job of hiding an essential tool for creating a print stylesheet (or handheld sheet for that matter). (more…)