Some of my best friends are print designers. Really. Here in New York, there’s a vague segregation between online and offline designers, but the local design community is still sufficiently cozy — and the island of Manhattan sufficiently small — that it’s not unusual for print and digital designers to intermingle freely. Dogs and cats, living together. Insane but true.
It’s great, actually. Especially for me. While I have an obvious partiality towards all things digital, my romance with graphic design originally started with print, obviously. That’s all we had in the pre-TCP/IP dark ages. I enjoy the two worlds immensely, even if I do believe the one is going to completely decimate the other like an atom bomb before the decade’s out. Kidding!
Over the past few years, too, I’ve come to see that the purpose of my career (in at least one aspect) is to do what I can to help bridge the two worlds. Part of this is my design sensibility, which hopes to borrow the best of print to help inform the evolving digital world in a way that’s true to the new medium. Part of it is the mission that I set out for myself when I joined the board of directors at AIGA New York, which to me plays a crucial role in our industry’s transition. And part of this is the fact that I work at a company that employs dozens of print designers even as we’re transforming ourselves into a digital enterprise.
Start Me Up
All of which is prologue to answering a question that I get frequently from print designers: “What do I have to learn in order to do Web design?”
What most people asking this question are looking for is a simple, tactical list of the hands-on skills necessary to work on the Web, a set of discrete tools to acquire that will outfit them for a new environment. More often than not, they feel drawn to Flash as a starting point, in part because it seems to allow the closest approximation of the print designer’s pasteboard: the ability to specify virtually any typeface, a high degree of fine-grained control over the spatial layout of elements, an emphasis on visual invention, and a fairly straightforward way to animate normally static graphic design conventions.
Flash is wonderful, and I think it has its place. But I think it’s absolutely the wrong way to start learning how to work on the Web. It leads too easily to the assumption that a similar amount of authorial control can be exerted in online design as can be achieved offline — which is a fallacy.
It’s far more expedient, to me, to learn HTML and CSS — the foundation for everything — and to learn how to code a simple Web page using those skills (rather than opting for a WYSIWYG tool like DreamWeaver).
Books for Beginning Web Designers
In fact, when this question is posed to me, I literally do recommend Peachpit Press’ surprisingly excellent “HTML, XHTML and CSS Visual QuickStart Guide” by Elizabeth Castro which is as basic and elemental a primer on how a Web page is put together as anything else available. I like to keep my copy on the bookshelf next to my desk, and I still refer to it from time to time — I’m not afraid to admit it.
I’ll also recommend the aging but still remarkably instructive “Eric Meyer on CSS,” which takes a task-based approach to teaching the conceptual basics of Cascading Style Sheets to newcomers. It’s true that this book predates many Web designers’ current preoccupation with semantic integrity. But for someone coming online who just wants to understand how the leg bone is connected to the hip bone, it’s an invaluable starting point.
The Real Step One
Still, even these basics are the second step, in my view. The prerequisite for doing something meaningful with any of these skills — HTML, CSS, Flash or whatever — is first embracing the medium as something different from print. Indeed, there’s no point in learning these skills unless as a print designer you’ve made a prior shift in your understanding of how design works in digital media. Specifically, come to grips with the fact that, on the Web, design is not a method for implementing narrative, as it is in print, but rather it’s a method for making behaviors possible.
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.
In my experience, none of those tactics work. Their all-around ill-suitedness tends to boil over to frustration when print designers realize that, by and large, there’s little room for visual virtuosity online. Which is to say, the Web is not commonly an effective tool for highly expressive displays of typographic, photographic or illustrative skill. Looking for opportunities to execute the sort of improvisational and dramatic creative visions that we see in printed periodicals, for instance, is likely to be an exercise in disappointment.
One of These Media Is Not Like the Others
Rather, working online is very much about small details that build into a cohesive larger platform. I know that all design is like this to some extent, but it’s especially true for the Web. The ratio of constraints to possibilities is far less kind in digital media, and understanding those constraints — understanding how to finesse them and how to subvert them appropriately — requires an attention to detail that bores all but the most dedicated.
There’s plenty that’s been said along this front already. The fact that I’m repeating that the Web is not like the printed page, that online information consumption is fundamentally different from print, is certainly adding nothing new to the conversation. The point I want to emphasize is not just that print designers need to be aware of this, but rather that they should approach it with genuine alacrity.
Smells Like Web Spirit
In learning a new medium, enthusiasm and open-mindedness trump nearly everything. A print designer who expects to succeed online, or even expects to master the skillset, has to be one who eagerly devours information about the medium, who peeks at the source code of Web pages that fascinate her, who spends her after-work hours experimenting with self-directed projects. This person needs to be motivated by the medium’s possibility, and not solely by the fear of losing a job in print.
This is why a fundamental understanding of HTML and CSS is so crucial; such knowledge provides the means to begin experimenting, to begin understanding how a page is put together, how it is delivered to a browser, how it behaves and, crucially, how the designer’s intention maps to how it is used by real people. Without that basic sense of curiosity, that insatiable desire to experiment and understand new ways of doing everything, the Web isn’t much fun at all, regardless of how much experience a designer has under her belt. Just as is true with most everything in life, it’s hard to get good at something unless you’re having fun.
+
Nice post. Coming from a graphic design background, I learned HTML in 2001 on “HTML, XHTML and CSS Visual QuickStart Guide”.
Nowdays I would also recommend “HTML Dog” (the book and the site): it’s very coincise and clear. But probably the Castro’s book is still the best choice for a novice.
What do you think about “HTML Dog” as a primer book?
Very nice, Khoi. This could be used on ALA.
Thanks guys. Manuel: I’d never heard of “HTML Dog” before, but thanks for the tip. It looks great.
Yep, great points. I’ve always had a big bugbear personally about designers trying to keep everything on screen and not allowing scrolling, or having anything ‘below the fold’ as it were.
It’s a fruitless thing to aim for online if you ask me, especially now that working with CSS, XHTML is, compared to 5 or 6 years ago, fairly easy to achieve more complex layouts.
Once upon a time Flash was the only way to get some form of consistent layout across browsers, but now that excuse has gone.
Great post, thanks. Adding to the book list, I’ve heard good things about the beginner book ‘Build Your Own Website The Right Way Using HTML & CSS‘ by Ian Lloyd. In my experience Sitepoint books are good and this one gets good reviews.
Nice write up. It’s true when trying to get to grips with the web one should learn to walk before trying to run.
The design discipline for the web is growing and maturing. I’m glad I started dipping my toes in to web base design ten years ago.
as a developer, i’m well aware of the print designer who has decided to design for the web. i can spot them a mile away. inevitably, i receive a PSD from them that’s got pixel perfect measurements with no flexibility, much less a thought given towards content fluctuation or accessibility.
i’m glad that you’ve written about this topic! it IS important for designers to learn the nuts and bolts about the web and start from the ground up. my suggestion is for a designer to execute a simple website from the ground up and then see how it behaves on different browsers under different circumstances.
once the designer sees how their idea plays out in browser window, they’ll have a better idea of what’s important in a design and what can be scrapped.
I also get this question all the time! I often say “Hire someone really good to do it for you!” Snarky I know but it’s so much work to learn this stuff… Browser bugs? Fuhgetaboutit!
I didn’t really get much out of “Eric Meyer on CSS.” On the other hand Eric’s reference book “CSS: The Definitive Guide” is a must have. The best book I’ve found for learning and teaching CSS is Cascading Style Sheets: Separating Content from Presentation. It would be a great follow up to the Visual Quickstart Guide but not a great first book.
As a web designer in a newspaper company I just want to say that you’ve articulated very well what I wish I could on more than one occasion. Well said.
Quoted for truth. You’ve hit the nail on the head with this one. I don’t know how many designers I’ve worked with claim to know how to design for web because they can send along a flattened PSD to someone who codes.
I know nothing about visual design – and largely I prove that everyday but I would like to comment on Flash vs HTML/CSS/Javascript. They can both be used to accomplish similar tasks but they are not really equal. Flash violates the ethos of the internet – view source. It is woven into the basic fabric on the internet that you can look under the covers. It may seem odd or insignificant that every browser shipping today still includes a view source menu item (does Mom really need to view source), but that is a direct outcome of the underlying nature of the internet – openness – and the people who build on that foundation should understand this. Flash might be a great tool but it works against the internet – it is closed – it is binary. (I could go on but the size of this text box seems to indicate that I should stop.)
Great stuff, Khoi. If this is a preview of what you and Tom Bodkin will talk about at SND Boston, I’m looking forward to it even more than before.
Bravo!
Great write up Khoi! I would like to suggest Head First HTML with XHTML & CSS. This book is a great beginner book too. Its a little thicker than the others, but for someone who is very “visual” in nature, it works great.
Great article! Luckily, I was advised to take as many web design-related classes as I could while getting my degree in Graphic Design. I learned about CSS back then, but it took a while (years, actually) to catch on to the whole web standards idea. I am finally implementing these standards in the sites that I put together and relying less on just slicing up a PSD.
Where I work now we are supposed to be the do everything guys, from print to web. Luckily we have yet to do any major websites, meaning most of them don’t extend over 5 basic pages of information.
However I have become much more involved with learning web at a much stronger level in hopes to maybe move in a direction where I leave the printed world behind.
I’ve been reading some books, reading online articles like A List Apart, and other blogs for helpful insite.
This was a really good post on something I am currently going through as we speak.
Thanks.
So funny – I also used the Visual Quickstart guide to learn web design, though when I started it was just the HTML version. I first learned CSS while working on a project with someone who had more experience with it and went on to w3schools.com and various other CSS sites and books (including O’Reilly’s CSS reference).
Thanks, Khoi — this is a truly thoughtful article. Your observation about narrative versus behavior is especially concise, and I hope it lives on forever.
I wonder if the fundamental challenge is that the web, as a medium, has flattened the distinction between different kinds of design, and therefore demands that different kinds of designers call upon strengths, experiences, and interests that they may not have — or even want to acquire. A designer who specializes in luxury food packaging and one who designs newspaper formats have not only different abilities, but different inclinations. There are designers interested in creating the One Beautiful Thing, others interested in devising formats that invite endless variation at the hands of others, and these different inclinations play to the needs of different parts of the design business. Graphic design’s traditional mix of illustrator-designers and typographer-designers — as well as those who are at heart journalists, photographers, editors, scientists, programmers, directors, and choreographers — has never been a problem, since each type of designer has traditionally found a niche. But there are no niches on the web. The websites of the luxury food brand and the daily newspaper need to have more in common than either of their designers.
As for the formal qualities of the medium, there certainly are thoughtless designers who approach their technology partners with 24-bit Photoshop files set in Caslon, but I don’t think this is anything new. Twenty years ago there were knuckleheads who brought comps to their offset printers, in which six point Bodoni was knocked out of a 60-line photograph, running across the gutter, and printing on newsprint. Most designers aren’t interested in browser compliance, but then most designers also don’t know the Tollenaar and Ernst formula for calculating dot gain on press. A lot of the details have always been boring.
What I notice as a freelance web designer: I find that most times print design firms are the ones that control the client – and a huge majority of a clients marketing spend ends up going into print projects because of this. These print projects are very short term 9 times out of 10 – brochures and leaftets etc., that have a very short life. Meantime the web projects are concidered a minor afterthought and end up as just an exact copy of the print work. There is no budget to look at the content again from a web perspective. Flash and ‘splash screens’ are invariably main topics of conversation at the table.
Because the client relationship is with a print company, you end up with no real input in design terms and have to take the designs presented by the print designer ( sometimes even in quark/indesign).
2nd: print designers in my experience just do not understand the fundamentals of the web and the importance of content and how it is interacted with. Their attitute is all skew ways. Even if you look at their print work you notice that print designers in reality very rarely really look closely at how content works. Content is always just slotted into their design, no need to read it. Navigation is a given. No need to see the content from a users point of view rather than just theirs. The majority of the time is spent tweeking font sizes or minor cosmetic details to make it as close to a ‘brochure’ as possible. The idea of changing news items on a homepage or less minimal navigation makes them cringe.
Hence: These days I stick with projects that are one to one with a client 😉
Overall: I think print designers are very protective of a clients marketing output and pushing print exclusively – they gobble up money with big print budgets, and very few web companies have enough client liason suits or the marketing push to explain to clients how the web can be more beneficial. Technology clients who don’t have many print needs are much more savvy.
I don’t think its just a matter of learning a bit of CSS. The skills that a web designer has are as much about the copywriting, the ergonomics, the brainstorming ideas and a stack of other skills that are just are a hell of a lot more than what most print designers understand.
My advice: Hire a web designer, and stick with what you know.
I hope I don’t sound like too much of a brown-noser, but I just wanted to say thank you for taking up the cause of bridging the worlds of web and print design. I think it’s the most pressing issue for web designers today.
The web is still in it’s infancy. The web community is only just starting to discover things like the craft of typography and the art of the grid—things that print designers were inventing almost a century ago, and which are taught to bourgeoning young print designers in intro design classes at design schools the world over.
Those web designers longing to advance their abilities in design concept and process look to the print world for inspiration. Unfortunately most print designers still don’t “get” the web and not everything translates.
And while the “mainstream” web design community is still focused on standards and technology, we feel left out in the middle, craving the kind of analysis and inspiration that publications such as Design Observer, SpeakUp, Print, Eye, dot dot dot, et al, bring to “traditional” design, but which we get very little of on the web.
Your blog is one of few leading the charge so thanks again for that. I know we’ll get there eventually, but darn-it I’m impatient.
Huzzah and thanks for spelling out so beautifully how Web design paradigms vex graphic designers. Your “Why print designers like Flash” section is really the best take on their perspective of new media. Flash ain’t the future folks, frameworks are.
Jonathan Hoefler, I appreciate your thoughts. They are thoughtful and interesting!
I agree that the world of print design, publishing and illustration has a different mix of people and how they conceptually approach their craft.
I disagree though in your implication that the web has no such offering for people to find their niche. I just think we’re still seeing some of this stuff in its infancy. Illustration for the web, as a trade, is still extremely young, but it exists. We’ve seen people writing for profit on the web for quite some time. And animation on the web is doing quite well – I know people who make their living doing animation on the web. So, it’s my opinion that to claim that there’s no niche offerings on the web because package designers don’t have one I think is a bit of a narrow look at things.
Nonetheless, I think that there are different niches on the web, and in some cases, there’s no crossover and some will always be just print designers.
This isn’t entirely true — as you say in your next sentence. Many web designers (schooled or unschooled) are well aware of grids and type, but it’s only the past couple years (barely) that it’s started to become feasible to code the stuff without ridiculous contortions — and it’s still beastly compared to doing it in print. So there’s technical limitations involved, not just ignorance… though there’s definitely a large contingent of those who never learned any of it.
Something I learnt when I was a web designer working for a print designer was that fundamental concepts like differences in screen resolution really need to be ‘learnt by doing’. You need to let a print designer produce an oversize static layout and then take them to a number of different screens to show how some will clip it horribly.
I really don’t understand this rush to make the web look like print.
Seems to me you are totally missing the point – the web is a totally different medium. It is not meant to be pinned to a wall or in a book and fawned over.
There are certain universal design principles that can be applied to any medium – print, web, tv. These are not the ownership of print design.
If you distinguish what you mean by when you say ‘print designers’ and what is it that that distinct medium does that you want to apply to the web, there is actually very little that is applicable.
More web designers should be applying the universal priciples of visual design to the web, not print principles.
This confused thinking from the get go is not going to help foster better design on the web.
Khoi–have you had any success in getting the AIGA (in NYC) to play the role you imagine? I’ll be honest, I had a similar vision in Los Angeles, but not much of a stomach for the ongoing resistance and old-school thinking that dominates the leadership. Frankly, I’ve given up on the AIGA as anything more than a print-design organization and I’ve become resentful of their lip service towards making a real effort at embracing new media. I think the truisms you write about above run deep, and the audience that’s really interested in spanning the two mindsets is maybe (in the end), pretty small.
To Brian Warren’s point above, I wanted to clarify that I wasn’t suggesting that the web doesn’t invite the same spectrum of attached specialists as any other kind of design, but rather that what we’re calling “print designers” are a heterogeneous mix of people with different and unique specialties. Uniqueness has always been a strength in graphic design, but it’s a deadly shortcoming in web design. Newspaper designers know how to invent formats that anticipate daily variation, film title designers work with a timeline as a fundamental axis, advertising designers know how to work with limited space and time, catalog designers know how to lead readers, broadcast designers think reflexively in terms of color safety, kiosk designers understand usability issues, and so on. It’s traditionally been possible to have a career in design with proficiency in just one of these areas, but web design demands an intuitive grasp of all of them, and many more.
I’m not necessarily saying that we should cut anyone any slack (though it might be considerate), but rather that it’s going to be interesting to see what happens to a profession that no longer welcomes one bunch of “details nerds” and another bunch of “process nerds,” when everyone absolutely needs to be both. I’m fortunate that I happen to love code as much as I love typography, but a lot of designers don’t. Will there be an Irma Boom of the web? An Art Chantry? A Tibor Kalman? I do wonder.
Castro’s book changed my life in 1998 when I was a fulltime accounting student in NY. I remember I used to hide that book from my friends – I did not want to let anyone know I am lerning this new thing called HTML – WOW!
I realize that there is a difference between print and online media. The difference that matters to this conversation is not so clear to me. HTML came along as a tool to post information to the web. It has expanded to accommodate varied formats over the years. I still believe we are in the early phases of design on the web and the methods and tools that we will use to express our ideas are still growing.
Jonathan: I think I understand your point. The Web demands a level of holistic knowledge that other design professions may not. In fact, my insistence that would-be Web designers learn to write XHTML/CSS is a kind of validation of that. You can’t be a designer devoted to “The One Beautiful Thing” on the Web and hope to be successful unless you’re cognizant of the mechanics and business of your site, as well.
Like digital media in general, I think this is another example of countervailing and superficially contradictory trends at work. As the medium matures, it often seems like it’s leading one way when in fact it’s leading another.
Take for example, the increasing amount of control designers have over the visual integrity of a Web page. Today, in 2007, our ability to specify type and control the layout of elements may have a long ways to go still, but it’s improved leaps and bounds beyond where it was a decade ago.
So in one sense you have evidence that suggests that this new medium is evolving into something closer to the old medium, in which the shape of content and information is mediated through the role of the designer.
But if anything, the trend is moving in the other direction. Designers have less explicit control over visual presentation than ever before, because now the users of our design solutions are assuming more than they’ve ever had before. They are re-shaping the patterns of design consumption: creating their own presentations on MySpace profiles; assembling their own front pages for news with My Yahoo, iGoogle, etc.; reshaping layouts in perpetuity with Grease Monkey; blocking out animations, Flash and/or advertising with readily available blocking software; even sidestepping graphic design altogether with RSS.
So anyway, that is a very long-winded way of saying that while it’s true that Web design demands a certain kind of multi-talented proficiency that crosses different competencies, at the same time we’re also seeing more specialization than might meet the eye at first. There are advertising designers adept at micro-sites and (for lack of a better term) brochureware. There are interface specialists who focus on high-density information applications. There are iconographers who know how to work with the increasingly varied display factors available in order to create highly succinct and consistent icons.
Even among more readily understood disciplines of Web design, there are specialists: some information architects are focused on social software while others are adept at creating enterprise tools. There are some Flash designers who can develop highly visual and immersive worlds, while others specialize in information visualization. The list goes on.
As the medium matures, this is going to continue until, much like the world of print where there are well-defined niches, there won’t be a single definition of the term “Web designer.” Every kind of Web designer will need to know more about the work that other kinds of Web designers do, for sure. But then I think that’s really a good thing.
I couldn’t agree more. Your observation about different behavioral specialties — social networking, information visualization, etc. — is interesting, and not something I’d thought about in that way. Perhaps we’re in the middle of the hourglass, in which a large number of orientations is being compressed into a single point, only to expand out into an equally diverse — but different — set of specializations. But there’s something else here.
A few years ago, I threw a dinner party at which one of my guests, who was involved in a magazine launch, had just returned from a week of focus groups. “I learned the strangest thing,” he said. “Do you know that a lot of our readers in the 65 and up category, when they get a magazine in the mail, the first thing they do is go through it and tear out all the ads?” I’d never heard of this, but three people instantly jumped up and exclaimed that their parents do the same thing. They’d never known that “dad’s eccentricity” was a genuine behavioral practice of the demographic.
The consensus among the guests — largely graphic designers — was basically “wow, that’s weird,” and as we all imagined our favorite magazine horribly mutilated, the conversation shifted elsewhere. Interestingly, it was the two marketing directors, the entrepreneur, and the website designer who seemed to hang on to the topic the longest. There was talk of charging advertisers a premium for pre-perforated ads that could be extracted intact from magazines, unexpected editorial juxtapositions that would have to be anticipated once ads were removed, and whether magazines would ever start selling “vertical half page interior” placements in order to thwart this behavior. It’s telling that so few graphic designers elected to be part of this conversation, a conversation that was about genuine design issues. But for many designers, questions like “what does it mean when people use things in this way?” or “how are these things put together?” or “what extrinsic forces shape the way things look?” are not central to their professional lives. The marketing folks and certainly the website designer are more accustomed to thinking about the interplay between how things are experienced, how things are made, and what they look like — in that order — than those designers at the table who have long had the luxury of approaching design from a purely formal perspective. As I think we’re both pointing out, this luxury is quickly vanishing.
I think it’s this different outlook that’s the fundamental difference between people who will design for the web, and people who won’t. Roger Black, as astute a designer as I have ever met, is still bemoaning the lack of a WYSIWYG html editor, a complaint which to me profoundly misses the point. But unless you’ve thought about the web in terms of markup and content, and understand programming’s ability to smartly manage and multiply information, it’s difficult to even articulate why this misses the point. I fear that your charge to “learn XHTML” will be lost on people who don’t understand that this isn’t like “learning InDesign;” what we’re talking about isn’t so much a set of tools and technologies as it is a philosophical perspective, and both the ability and the interest to be engaged with design in a different way. I don’t know if this can be taught.
“I don’t know if this can be taught.”
So I was born with the proper genetic make-up in order to understand web design?
The problem is you are only teaching people the production end of the process. In addition to XHTML they need to be learning about information architecture and all the other pieces of the puzzle that help guide your design decisions.
Hello Khoi – from London town . . I am very glad you’ve posted this, having had an item on my to do list which reads “Email Khoi Vihn asking advice about converting print-design skills to web” . . Here at the Guardian, as in the rest of the press, there is a lot going on building the web presence . .but obviously the printed product has to keep coming out, so us designers on paper are as busy as ever. I am intrigued though, and eager to learn about the nuts and bolts of how, but also the different way of thinking about content, audience, speed of delivery and small screens too. I have 2 sections to get out the door in the next few hours, so no time to digest your post now, but I look forward to reading it..
Khoi & Jonathan,
Not to intrude on your conversation, but I think what you are both getting at is that print designers are rarely involved in the production of their designs, whereas web designers are responsible for the production of their designs. It is truly a rare sight to see a print designer who oversees the entire printing process, including file preparation, plate production, ink mixing, press checks, assembly, etc. In fact (to your point, Jonathan), the majority of print designers with whom I have interacted are blissfully unaware of the production process at all. They simply hand off their collected Quark documents to a printer and wait for delivery, not unlike how many here describe their relationship with web designers and developers.
My impression is that, not discounting the creative side, modern print design does not require any level of technical proficiency outside of knowing how to use the computer as a design tool. “Learning XHTML” these days is more akin to “learning letterset” in print design of yore. It’s a technical skill that demands incredible attention to detail and a high degree of proficiency to produce results at all, if not high-quality. It also demands a level of understanding of the final outcome during the process. That is, knowing precisely how a layout will look even as one codes or sets.
But this follows a pattern. Graphic design has consistently evolved over the centuries, with technologies replacing skillsets each step of the way. Once there was a time when hand-lettering was an art that could be found in every single printed piece, and along came the printing press. Slowly, the true masters of hand-lettering became obsolete, as master typesetters have become today. There will be a time when a new paradigm in graphic design becomes popular, and web design will forget the days of coding by hand. Those with talent focused on the new paradigm will complain about how web designers don’t understand the nuances of it, and we will be relegated to jokes about 72dpi, box models, and Trebuchet MS.
Sean–I’m not sure I agree, and I think Khoi was closer to the kernel of the issue above when he said the real difference is that web design is about “behaviors” not narrative(s). I don’t think learning (X)HTML is a prerequisite for appreciating this difference, but I agree with Khoi in that it’s a great place to start–it’s a boot camp like experience to start your brain thinking about the user experience issues that need to drive presentation decisions. As mentioned above, a Roger Black style WSIWYG editor for flawless HTML isn’t the issue — understanding, appreciating, and enjoying solving the problems of goal-oriented interactive user experience is the challenge [most] print designers don’t yet embrace.
Technical knowledge is imperative, but theory is helpful too.
Don’t forget Jeffrey Zeldman’s 2001 book “Taking Your Talent to the Web“, all about making the transition from print to web.
@ Jonathan Hoefler & Khoi
As a formally educated print designer who actually knows what the Tollenaar and Ernst formula is, and who is now a professional standards-breathing XHTML/CSS web designer, I just wanted to say THANK YOU for this amazingly rich conversation. If you guys keep this string going, you’ll need to publish a book (that would certainly become required reading)!
I agree that this subject must be approached from a philosophical perspective. Print designers must truly unlearn what they have learned and must learn a new media if you wish to reduce your stress and successfully cross from print to web.
For all you opinionated developers: go Wikipedia Mr. Hoefler.
For all you print designers, meditate on Khoi’s insight that you must
“specifically, come to grips with the fact that, on the Web, design is not a method for implementing narrative, as it is in print, but rather it’s a method for making behaviors possible.”.
Then do yourself a favor and go buy Jeffrey Zeldman’s Designing with Web Standards which I’m surprised no one has mentioned yet.
Lovely article. I must say though, I dislike the trend that I see of designers who are good at neither web nor print, but mediocre at both. There seems to be a glut of design produced by web designers doing print design and print designers doing web design, that is offensive in it’s lack of precision or understanding of the respective medium.
I’m curious what set of skills would best benefit both, where the happy medium would be. Can a designer truly be good, absolutely good at both? I question the idea that print designers don’t care or don’t pay attention to information heirarchy, or that this prima-donna turtle-neck wearing mentality is solely the shortcoming of print designers. Both web and print would benefit with a bit more clarity of vision, less wiggles, cheap photoshop tricks, and poorly considered concepts.
As John Henre-Barac stated more eloquently, I wonder what will be the next design paradigm after web 2.0? As a designer looking to survive the next e-volution, this is where I set my sights.
Tom,
I don’t think we disagree on this. Proficiency may not be a prerequisite for understanding a craft, but is an absolute requirement for those who practice the craft. My point is that print design has evolved to where even understanding beyond the design phase seems to be no longer a requirement, whereas web design must embrace all aspects of design, production, and usability as part of the process.
As a print designer, I think my job is to organize and prioritize things. That’s two concepts I rarely see web sites do well. Sometimes I feel like I’m sorting through a data dump.
Wow, this is the article I’ve been looking for to send to my local chapter of the Graphic Designers of Canada. We are still trying to bridge this print/web gap in our little community – thanks for the excellent insight!
The “implementing narrative” vs. “making behaviors possible” distinction is a great help in clarifying this discussion.
Another way of expressing this difference between print & web is that print is about presenting information while the web is about creating environments where people can work or play with information.
Great post – while I started with Castro too (circa 1997), I missed that whole part about embracing the limitations and nuances of the web. I feel like I’ve finally turned the corner, but I guess it took the semantic and standards wave to reach me.
While I have hope that people coming to web design (and development) now will have more straightforward time of it, it doesn’t help that there is infighting among two of our best and brightest.
Nice work, Khoi.
There is a big barrier to entry for print designers (like me)–it’s a TON OF WORK to learn the web side well. It’s a completely different set of tools and skills. Being a “designer” only gets you about 10% there (and you have to reframe that), the rest is straight up learning and experience. No matter how many print awards you have, you have to be willing to suck for a while before you learn enough not to suck. It’s taken me a few years of crazy obsessed fascination to feel like I’m comfortable on the web side and to feel like my work actually contributes to my clients.
speaking of pixel perfect precision, am I the only one who’s noticed the steady decline of fluid/elastic sites? I’d say the landslide started when ALA went fixed 1024.
Anyway, I’ve been fantasizing about Mark Boulton
creating a fluid grid tutorial, but perhaps there’s still time for you to beat him to the punch 😉
Very nice article Khoi!
I’m glad I coded by hand right from the beginning and started with the web rather than print. Did some print jobs as well, but web has been first 😉
One thing that hasn’t been mentioned in this great conversation is the part about technology’s speed. When the web was in its infancy, coders ruled and loved their advantage of tech over tact, digits over design. As the tools got simpler and easier to adapt, the sites got better and better. The thing I struggle with is learning technologies that die within months. Flash is a labor to use. It can create some great things, but it’s laborious and tedious to create in. Dreamweaver is the same (not unlike any print-oriented software was when it started — Quark, yuck), but the “wild west-ness” of the web and ever the changing technologies make it seem like my HTML and CSS skills can’t stand up to Ruby on Rails and whatever the next language will be. I was speaking with 33-year-old Friday, who told me how scared he was a 17-year old just hacked an iPhone! Certainly the web will change at a faster rate going forward and more software (ever see the program Freeway? Pretty smart) will be introduced to help make the transition easier.
But what happens to print? Do handhelds become our lifeline to text and video for the rest of our lives?
“I really don’t understand this rush to make the web look like print” [Bill]
I don’t think it’s that way round at all.
In the very early days of the web, it looked like the web, because that was all it could look like. Then as HTML 4 introduced a whole raft of formatting measures, people figured out that tables could be used to lay out the page, and Flash became widespread, people working with the web wanted to use all of those features to jazz things up.
So they followed in the footsteps of print media, because that seemed like the right thing to do. The web was clearly more like a newspaper, magazine or book than it was like TV or radio, so that was what they went after. And so web designers tried to use the methods that print designers had used, with mixed success.
We’re now moving away from that. The web is maturing as a technology, we’ve had this kind of graphical website for well over 10 years now, and more and more people are learning that the web is a new media all of its own – yes, it has some things in common with print, but it has lots of differences – some limitations but an awful lot more possibilities. More and more organisations are spending time and money on developing their online presence – not just having one, but getting the most out of it, branding it, making it work for them and their customers. More and more organisations have only ever known online design, have been created on the web and have never printed anything.
Soon, the printers will be doing OUR bidding. Ahahahaha!!!!!
OK, it’s not as simple as that, but you get what I mean. It’s no longer seen everywhere as de facto that the web design is second fiddle to print design, and we can look forward to seeing the growing recognition of web as a media of its own, not as a subset of print.
interesting that a web guru still refers to printed books for information. Hmmm, makes you think, maybe his statement that print will fizzle by the end of the decade is incorrent.
Coming rather late to this conversation, I want say thanks to everyone for an interesting, thoughtful discussion, especially as a print designer who wants to be employed until retirement. I know I’ll have to make the leap to the web someday soon. There are, however a couple of assumptions in the discussion that, as a book designer, rub me the wrong way.
Khoi said up top “Specifically, come to grips with the fact that, on the Web, design is not a method for implementing narrative, as it is in print, but rather it’s a method for making behaviors possible.”
A great insight and a way to frame the issue that helps a print designer change conceptual gears–nothing to argue with there.
But then “it’s far more expedient, to me, to learn HTML and CSS — the foundation for everything — and to learn how to code a simple Web page using those skills (rather than opting for a WYSIWYG tool like DreamWeaver). . . This is why a fundamental understanding of HTML and CSS is so crucial; such knowledge provides the means to begin experimenting, to begin understanding how a page is put together, how it is delivered to a browser, how it behaves and, crucially, how the designer’s intention maps to how it is used by real people.”
The glorification of coding here (and elsewhere) bothers me. Unless I’m misinterpreting the matter, it starts to sound like some kind of macho posturing: you can’t do real web design unless you open up the hood and code.
Well, I never had to learn the underlying structure of glue or hot wax machines when doing paste up. I didn’t have to learn proprietary typesetting codes when using photo typesetters. And I didn’t have to learn PostScript (or LaTeX) to design on the desktop. Admittedly, I did have to put up with years of poorly set Quark pages, with their rivers of white flowing down the page like water from a leaking dam (perhaps I exaggerate).
What I’m getting at is that I haven’t read a convincing argument about why I need to learn code–when I’m supremely uninterested in learning which picky mnemonic code goes where–instead of learning the conceptual shift Khoi so elegantly expressed in the beginning.
As far as I can tell, coding is not graphic design, it’s just getting the damn computer to do what you want. If using the less-than-manly GoDreamLiveWeaver or equivalent places limits on what you can do, can someone explain how that qualitatively differs from the constraints of the web itself.
I produced some decent books in Quark and the much-maligned PageMaker, while dreaming of Herman Zapf’s h-z. At least until InDesign came along with–at last–with hung punc, multi-line hyphenation, optical spacing, and so on
Do WYSIWYG programs actively prohibit experimentation? Can’t I use them to learn what works and what doesn’t? I don’t care if it takes me longer or produces slightly-less than-optimal results. (Or is code bloat still a problem in these days of DSL and cable modems?)
How does coding help you “make behaviors possible” in a way that is impossible in a WYSIWYG editor?
ps–I’m not interested in spec’ing type or having overlays align perfectly, but I am with making clean and comprehensible screens.
Thanks for indulging to this too-long post
It’s not the need to know that you use <a href=”…” title=”…”…</a> to mark up a link that’s important per se, it’s the need to understand how the page works.
With a printed page, the printer has ultimate and absolute control over the outcome. Whatever the designer wants, by and large, he can have – exactly as he designed it. He is limited only by his imagination and the design tools he has available. So the designer needs to know about design – including things like typography and readability – and he needs to know how to use his design tools to produce a format that his printers can work from. It doesn’t matter whether his output is in PostScript or the most enormous high-resolution bitmap, the resulting document is ‘flat’. In technical terms, he has just one audience to design for, the printer.
On the web, it’s different (but you know that anyway). The designer is communicating directly with the readers, who are using a wide range of different technologies, which will all interpret and render the page in slightly different ways. This means that the designer has to be aware of the limitations and how the page might appear in different setups. The page needs to be designed as information-rich, with metadata to help the user-agents to interpret and render it in the most appropriate way. The result is not a flat document but a ‘multi-leveled’ document, containing both content and context. In technological terms, the audience comprises every machine that could be used to read the page.
This means there needs to be a difference in approach. If you’re designing a website that is to be accessible to everyone, you have to understand how technology reads HTML; you have to understand how the page is constructed; you have to understand the semantic context you are giving to elements on the page.
No, you don’t need to know the minutiae of the code, you don’t need to learn the DTD off by heart, you don’t need to be able to construct a complex data table in source view. But you do need to know all the different options available for marking up elements – whether you know them as level-2 headings, table header cells and emphasised text, or as <h2>, <th> and <em>.
The web is not WYSIWYG, but WYGIWYM – what you get is what you mean. That’s why a lot of people frown on editors – it’s very difficult for computer software to accurately infer the semantic meaning of something unless you explicitly tell it, so editors tend to produce ‘tag soup’ rather than lean and accurate semantic code. I’ve not yet found an editor that can produce better HTML than a hand-coder.
PS – there’s a glitch in the comments facility. If you preview the comment, it converts any escaped characters to their literal equivalents, so that when you then post the message, instead of displaying, eg, <em> as text, it inserts an <em> tag in the page
John Svatek asked,
To me, using one of those tools to begin designing a website is a little like opening a manuscript to page 344 and trying to design a book around it. I can make a nice page 344, but I don’t know that from that I could deduce what should happen on page 345 — let alone pages 1-343, or the second edition, or the large type edition, or the French edition.
In the way that it’s not really possible to design a book without reflecting on its contents and thinking through its stylesheets, I don’t know that it’s possible to design a website without thinking through its code and the way that code gets interpreted. Code really isn’t anything more than instructions, and in truth it’s really not that bad. Anyone who can understand Jan Tschichold’s instructions to Penguin can understand CSS’s instructions to Safari.
Its instructions to Firefox and Opera and heaven knows what else are another story, but I don’t think this kind of droll minutia is limited to the web. Some book designers also know about bookstore racking policies, Library of Congress cataloging data, and piece-and-pound mailing rates; whether these areas of specialized knowledge count as “design” is really in the eye of the beholder.