Yes! That was easy. This is a question asked time and time again by designers, developers and managers alike. However, the answer has little to do with anything else besides the simple fact that all creative designers should know their canvas. Even the creative types that seek to break convention and purposefully break the conventions of their canvas do so only by first knowing that canvas. Web Designers (or designers who design for the web) should (must) know how to code. They should know and understand the medium in which their design is intended.
All designers must know the medium and canvas in which they design for. How can a sculptor sculpt without knowing the difference in stones? How can a painter paint without knowing the difference in brushes, paint or canvas? How can a print designer create without knowing about the printing process, types of paper stock or difference between CMYK and RGB? And how can a web designer design without knowing how to code, or at least how the code works? The important aspect to mention is that a web designer must know how to code, but doesn’t need to or have to actually code.
A web designer must not only know the possibilities and limitations of the browser but the code in which brings the design to that browser. It’s been debated that designers who code will let that knowledge limit their design – designers who have to code their own designs might be inclined to design easy elements to code for. Lets get one thing clear — a lazy designer is a lazy designer; a knowledgeable designer is not a lazy designer!
Knowing the acceptable system fonts, knowing how repeatable graphics repeat, knowing if an element will be an image in the mark-up or a background image in the CSS as well as knowing something as basic as browser resolution grid widths are all examples of essential elements that a web designer who knows how to code will think about when designing for the web – and their designs will be greater for it!
Remember designers; a photoshop document is not your canvas. A PSD file will do nothing on the internet but take a really long time to download.
Does a Web Designer need to be an HTML junkie or a CSS master? No. But a Web Designer must know the fundamentals of the medium, and the elements of, that their designs will utilize to come to life. If you are just a designer who occasionally designs for the web, then have at it – if you truly aspire to be a Web Designer; then learn your medium.
Dan Drinkard
November 27th 2007
I totally agree! But there’s more to it; this is a two-way street… The only thing worse in my opinion than a print designer loosed upon the internet is a developer who doesn’t consider front-end polish important.
Just like a beautiful psd is useless on the internet, a brilliant app is just as bad without intuitive and (dare i say it?) attractive interface.
As build-out times decrease exponentially with the rise of agile patterns on the web, the only thing left to distinguish you from the thousand other sites exactly like yours is the comfort level users derive from a nicely thought-out design, and as a developer who at least likes to think he appreciates things that look good, I’m not very tolerant of hearing “I’m a developer” used as an excuse for half-assing the front end. Design != art, and while there’s an innate level of talent involved, the code-jockeys of the world should at least take the time to learn the principles.
Flash Framer
November 27th 2007
I’m a designer and my career really took off when I started coding more. I’ve found it’s hard for most designer to bridge the gap but It’s a must if you want to survive in the digital age.
http://www.flashframer.com
Martin Ringlein
November 27th 2007
April, I think you make a good point — the real solution is communication and team work. And perhaps my point of view has been skewed a bit because many of our clients are start-ups and the ones that aren’t are running like they are (fast paced schedules with restricted budgets and minimal resources).
In that environment there is no time to spend on figuring out “how to work together” — that time is better spent on building the project. The new wave of fast-paced development seems to be to hire great talent that “gets it” and assume if everyone knows what they are doing and is advocating a best-practices mentality with everything they do; then there will be this magical synergy where things just come together.
It sounds like a fantasy, but we’ve seen it be a successful technique time and time again.
April Holle
November 27th 2007
Great topic! Designers definitely need to know what’s possible and developers definitely need to know about usability and designing interfaces. However, I think it’s easier to meet in the middle and discuss this on open ground when starting a project or beginning a professional relationship together. Both jobs are equally specialized and honestly you can’t expect one to know EVERYTHING about the other. Communication is important.
At my workplace they have realized the importance of xhtml/css, browser compliance and standards. So we’ve added a third team to the mix. Production, made up of front end architects (myself being one of them) that choose to be the middle ground and make sure that the boundaries of design and development meet in a civil manner. This enables each department to really step up everyones performance and ability to really shine at our specialized departmental jobs.
Again, great post, I think the web is a complicated canvas for new designers and needs to be understood before really approaching.
Dan Drinkard
November 27th 2007
Gimp’s not that bad… Elements is ok too. As for designer’s block, I have the same problems, but I’m comfortable with leaving the design to the designers. Asset creation/adjustment as needed and an appreciation for the pixel-perfectness of what’s been given to me I think are all a developer is responsible for bringing to the design table. As far as using the tools… psdtuts is phenomenal, though you have to use photoshop to play along :(
Martin Ringlein
November 27th 2007
Jeremy, I agree with you — large problem that is often debated is the fact that Photoshop (the industry standard graphics program) is so damn expensive.
I’ve heard of a lot of alternatives (mostly from developers) — but the sad reality is that Photoshop is the best tool, IMO.
A designer can code with nothing more than TextEdit or NotePad — a developer on the other hand has to pick and choose what they can do if they want to work with the design — unless of course you want to fork over the big buck for Photoshop (or risk stealing it).
To those developers who want a design tool — ask yourself, what would you use it for? If it is just slight photo manipulation and graphics tweaks, you can probably use Photoshop Elements for that. The biggest thing to consider is if the file the designer provides you to work from is going to be compatible with what ever alternative software you end up using.
It is a terrible situation that many have brought up with little GREAT solution to come.
Jeremy Carbaugh
November 27th 2007
Overall I agree with the comments: It is important for a developer to understand what goes into creating the design and to be able to pitch in when needed.
The biggest issue I have is a perceived barrier to entry. I can’t really justify paying $650 for Photoshop when I will rarely use it. I’ve used Photoshop in the past for photo manipulation and that was easy enough, but I don’t even know where to begin when staring at a blank screen; especially when there are so many ways to accomplish one goal. I’ve seen plenty of tutorials on the concept of design, but not much on how to actually use the tools to get something done. Any suggestions?
It’s probably not that hard and that I’m just more comfortable behind a command prompt than a canvas. :)
Martin Ringlein
November 27th 2007
Lee,
All is calm here; glad to see you are passionate about the topic though.
The context of the post was one of a professional nature — not a personal one. When working in a professional atmosphere, there is no excuse for ignorance with respect to your job. I have been around the block enough — and as an interactive Creative Director, it would never be acceptable for a designer to present a concept that didn’t think beyond the Photoshop document. Why does a developer need to waste the time asking what the body background should be? That should be accounted for. I am all for collaboration … but there is a difference between collaborating together and one team member holding another team members hand because they lack the knowledge to present an adequate deliverable.
I also don’t believe that being knowledgeable of the code will in anyway diminish or replace the fundamentals of design such as typography, user interface design or balance.
Remember, there is a difference between a designer and a web designer; or ever a designer who designs for the web.
You show me a world-class web designer with a lack of knowledge for the code and I will show you a frustrated front-end developer.
Lee Santos
November 27th 2007
Calm down, Martin.
Maybe you haven’t been around long enough, but I’ve seen world-class Web designers who have only the most fundamental understanding of code. They invariably bring to the table other, more valuable assets than so many “designers” today. I’m talking about an understanding of user interface design, typography, balance, and restraint. And then there’s organizational ability and just plain common sense.
Every creative endeavor requires collaboration. What’s wrong with taking the initiative with the aspects of the site I mentioned above, and at the same time working closely with the person implementing the design?
Alex Giron
November 27th 2007
Jeremy posed an interesting question over at mixx Should a coder know how to design?. To which I replied:
Ideally yes, however I don’t think it’s necessary for a coder to be a “designer”. It all depends on what the work required is…
On small projects a front-end developer might just take a PSD cut it up and create the css/xhtml…
However on a larger project, a front-end developer might need to know how to take a design direction and extend it…. that means having some sort of design knowledge and/or understanding.
Martin Ringlein
November 27th 2007
Lindsay,
We know your pain! While I don’t personally like to play in that grey area, I do love to mark-up some beautiful XHTML/CSS.
It was the lack of being able to define ourselves that really pushed up to start nclud — that is the meaning behind the name. “Web Design” is really this all inclusive element, it is almost difficult to do web design correctly when you aren’t thinking of all the elements of all the job descriptions. We are not just designers and we are not just developers. I think the future will show a push away from this concept that everyone needs to be silo’ed off into these pre-organized buckets; force to conform as opposed being allowed to breathe and explore.
Lindsay Donaghe
November 27th 2007
I’m one of the people who “play in that grey line between the back-end programming and front-end mark-up.” and it’s not so bad. :)
I like to code as much as I like doing design work. And I find it interesting that there aren’t more people who do both. There’s beauty and creativity on the coding side and there’s lots of puzzles to solve with well-defined constraints and requirements on the design side, so it seems like there should be more crossover.
It is hard finding the appropriate title for what I do though. If it has the word “design” in it then people assume I can’t code, and if it has the word “developer” in it then people assume I can’t do graphic work. And seems rare that you find an employer who understand that they need both sides of the coin (or that one person can do both).
Good post by the way. I hope everyone learns from it.
Martin Ringlein
November 27th 2007
It is a tough call – I think you are right. While I see the need and the purpose for pure front-end guys in large organizations. The reality is that those who are multi-talented will win-out at the end of the day. A designer that can code well is a valuable asset; a developer with a strong eye for design is an amazing resource.
The evolution of the front-end developer will be more on back-end integration. Someone will always need to play in that grey line between the back-end programming and the front-end mark-up. I know I don’t want to do it!
Dan Drinkard
November 27th 2007
Perhaps the curse surrounding front-end is correlated somewhat to the salary associated with it as a stand-alone profession ;) It’s my contention that everybody does the XHTML/CSS/JS…
Martin Ringlein
November 27th 2007
Dan,
You make a great point and have reason for your frustrations! The true issue with the “I am a developer” mentality is that the idea or notion of a “front-end developer” is still extremely lost in many organizations. Who does XHTML/CSS? The web designer, the web developer, the network admin, the intern?
It is as if front-end development has a curse around it that many fear to touch. So many old school designers and developers fear change as well — a desire to want to ignore the progression of the web and web standards.
The job of “front-end developer” is a crucially important one. We, nclud, strongly believe that the beauty of the code is just as important as the beauty of the visual front-facing aesthetic.
Martin Ringlein
November 27th 2007
Flash, I agree — the web is becoming less and less of a playground for designers who only design. Companies and clients are more and more seeking all-in-one solutions. I don’t think that design should be compromised by technical knowledge or expertise — but it really does help.
Some artistic fields just demand it — designers must learn to evolve; but not all need to or will.