by matt
20. August 2009 10:12
I’ve been involved in some web design builds recently, which has been somewhat of a learning experience for me. Last time I was really involved in knocking up the front-end of a site everything was done in tables an that was just that way it was (a fair few years ago!).
I started my journey by reading and/or flicking through a couple of books:
- Bulletproof Web Design by Dan Cederholme. I read this one cover to cover, it’s well written and covers all of the basics if you’re just getting started or are incredibly rusty (like me!).
- CSS: The Missing Manual by David Sawyer McFarland. More of a reference at the moment for me, but again, pretty well put together.
That all very well and nice and helped me a great deal, but the next stumbling block I had was testing things in various browsers. I found a couple of tools that you can use for this that have varying levels of success/usefulness.
http://browserlab.adobe.com/index.html
By far the most impressive of the tools in terms of basic functionality. It all runs in your browser and required you to set up and Adobe account (if you don’t have one already). Essentially it does what a lot of tools do and trundles off to the web address that you supply and creates and image based on the rendering engine of the selected browsers. You can then compare the images in various ways to checkout the differences. It’s rather slick and well worth a look.
http://expression.microsoft.com/en-us/dd565874.aspx
Well, it’s a 250 Mb download, and pretty much does that same as Adobe’s effort. The free/demo/trial/whatever version only does IE browsers, which is a bit of a weakness in my opinion. Let’s face it, the Expression suite isn’t too great just yet so not a lot of people are going to fork out the full price for it. It does look pretty slick though and lets you look at the most problematic browser (IE6).
http://tredosoft.com/Multiple_IE
A corking little app that you can install that gives you access to previous versions of IE. Simple as that, these are fully functional versions of the browser so you can actually test things out in them and not just rely on a rendered image!
I’m more than likely going to end up using a combination of Adobe’s Browser Lab and TredoSoft’s MultipleIE. Browser lab give me the ability to compare layouts, which is great. Multiple IE gives me the chance to actually test things out in IE6 functionally with jQuery and so forth – priceless! Microsoft’s SuperPreview might get better with the rest of the suite and might be something I revisit. But not for now :)