Jul132006The Ultimate Web Development Machine

Designing Web sites can be a real drag. If you’re using CSS and any of the current techniques for building CSS layouts, you know that what looks good in Firefox doesn’t always look good (at least immediately) in Internet Explorer. Building and testing Web sites that work consistently across browser and operating systems is always a chore. And the best testing setup includes both Mac and Windows, Internet Explorer, Firefox and Safari. This usually means having a couple of computers you can switch between for testing Web designs. A waste of office space, money and time.

Fortunately, for me, I just got a new Mac Book Pro laptop. Its Intel chip is a real boon to Web designers, since it actually lets you run Windows on your Mac and test a Web site using Internet Explorer. Apple’s BootCamp software makes it easy to install Windows on the Mac, but it requires that you reboot each time you want to switch between OS X and Windows—kind of a pain.

But with a couple pieces of software it’s very easy to not only have OS X and Windows running side-by-side, but to easily switch between the two with a simple keyboard shortcut. Parallels Desktop lets you run Windows, and VirtueDesktops makes it easy to switch between the two operating systems. With Parallels you can even have multiple versions of Windows running side-by-side—the perfect way to test both Internet Explorer 6 and Internet Explorer 7.

I’ve written an article on the topic for an upcoming issue of Macworld magazine. It’s scheduled for the November issue (meaning it’ll be on the newstands early October.) In the meantime, check out the video of this setup in action.

3 Responses to “The Ultimate Web Development Machine”

Jez Lerman  December 12th, 2007 at 11:07 am

“The Ultimate Web Development Machine…

…Designing Web sites can be a real drag.”

I’ve been designing sites for many a year, endeavoring with each new project to speed up my production workflow (I’m a one-man band). The mantra “this time my turnaround will be much faster” has become a habitual affirmation. I’m constantly keeping an eye open for “The Ultimate Web Development Machine”, “The Ultimate Automation Flow” (I like the idea of creating an Applescript-based way to automate a site, the problem is that no two sites are ever built the same; sigh) and “The Ultimate Minimum Amount of Code I Can Get Away With Without Being Crapped On By My Clients or Fellow Developers”.

After much experimentation over the years, I’ve settled for Fireworks as the “Ultimate All-round CSS and SWF Output Machine”. Fireworks speeds up everything. I am in total awe at the possibilities this software has to offer. Create a few graphics, add slices, export the page to CSS output, add a wrapper/container DIV around it in Dreamweaver set to a width of 940px, set the wrapper’s position to relative (thanks to your article), add layers in Dreamweaver (for texts, media etc) set their Z levels to a high number so they are visible above the graphic elements on the page and set their positioning to absolute(thanks to your article again), add a few URLs and a FWKs generated menu and Hey Presto!

Done.

Finito.

A live, hot-linked, page comp in less than an hour. Up until this week I’d been hand-coding everything in Textwrangler, producing graphics with ImageReady, and I’m too embarrassed to mention how long that workflow took until I could say I had a final page comp out the door. Way too embarrassed.

Yes, most of the CSS code generated by Fireworks is spanned inline styles, probably not standards-based and most definitely not valid. But the code is lean. External CSS instructions are down to a bear minumum, and my turnaround is exceptionally quicker than ever before. I feel pumped by the creative possibilities the extra free time will afford. I’d rather feel pumped with adrenalin, than angst at an ever growing Sites-to-finish to do list with not enough time left in the month to complete them in.

Apologies for the long comment. I won’t be surprised nor offended if you don’t publish it. But I’d sure appreciate a little feedback on this issue of “The Ultimate Web Development Machine”.

Jez Lerman  December 12th, 2007 at 2:01 pm

This article on the Adobe site seems to favoring some of my previous comments. This extension looks amazing.

http://www.adobe.com/devnet/fireworks/articles/smart_css.html

Dave McFarland  December 12th, 2007 at 2:15 pm

Jez,
Thanks for the link. I haven’t seen that article before. Nor have I tried the Fireworks extension. I’ll check it out.

Leave a Reply

Categories

Archives

Buy them today!

Dreamweaver 8: The Missing ManualCSS: The Missing Manual