Often, just as print designers are tasked with shepherding a project from design through production, a large group of web designers also tackle the production task of bridging the gap between photoshop and a browser with html/css coding.
Or, in the very least, they have an understanding of HOW their designs and IF their designs can be realistically, technically, implemented.
And this isn’t as easy as it may seem to the unknowing manager/administrator who may appreciate the surface value of good web design but may not understand technical taekwondo and craft involved to produce it. It’s an unfortunate situation and is directly reflected by the compensation of web designers across the board. Sure, some simply deliver mockups to developers. But often our commitment to the project takes us way beyond photoshop.
Show me a print designer who doesn’t concern himself with holding a finished piece in his hands, and I’ll show you a web designer who doesn’t open a browser and nitpick. Those people don’t exist, and/or they suck and should be fired.
Competent designers (print and web) care about the finished, “live” product. And we must naturally concern ourselves with not only design, but production. Not because we’re paid to be developers, but because we care.
A recent Smashing Magazine post provided a nice list of hurdles that we face when bringing design to the web, listed under the heading, “adaptive to diverse users”. And this list, in a nutshell is what makes the transition from print to web so crazy:
- Browser
Is the design attractive and usable with the most current and popular browsers? Is it at least usable with old browsers?- Platform
Does the design work on PC, Mac and Linux machines?- Device
Does the design adapt to low-resolution mobile devices? How does it look on mobile devices that have full resolution (e.g. iPhones)?- Screen resolution
Does the design stay together at multiple viewport (i.e. window) widths? Is it attractive and easy to read at different widths? If the design does adapt to different viewport widths, does it correct for extremely narrow or wide viewports (e.g. by using themin-widthandmax-widthproperties)?- Font sizes
Does the design accommodate different default font sizes? Does the design hold together when the font size is changed on the fly? Is it attractive and easy to read at different font sizes?- Color
Does the design make sense and is the content readable in black and white? Would it work if you are color blind or have poor vision or cannot detect color contrast?- JavaScript presence
Does the page work without JavaScript?- Image presence
Does the content make sense and is it readable without images (either background or foreground)?- Assistive technology/disability
Does the page work well in screen readers? Does the page work well without a mouse?This is not a comprehensive list; and even so, you would not be able to accommodate every one of these variations in your design. But the more you can account for, the more user-friendly, robust and successful your website will be.
Additional reading:
Dear Print Designer Doing Web Design
This is a very “blue-collar” list coming from the perspective of an XHTML/CSS coder who’s job it is to implement designs.
The Way to the Web, Print Designers!
More often than not, the reflexive approach that I’ve seen print designers take on the Web is to treat it as a vehicle for print-based design practices: fixing type sizes, specifying typefaces, ignoring usability and expediency, and perhaps most notoriously making the assumption that, over time, users will come around to a print-focused way of consuming content.
October 27th, 2009 at 9:29 am
Saw the Smashing article yesterday and starred it in my reader. Hopefully the next article will detail how on some of the hurdles they specifically stated. Multiple widths looks to me to be the biggest problem at this time. Sure, a site may work on a 22 inch widescreen or a 10 inch netbook, but does both end-users have the same experience?