There has been a lot of discussion about whether designers should code lately. Again.
Here’s my take.
One definition of design is solving problems in a visual way.
Some of the problems involved in web design include:
- How do we present content to visitors?
- How do we help visitors find other content?
- How do we tell our story visually?
- How do we make our content available to visitors no matter what browser or device they are using?
Drawing a picture in Photoshop is not web design, because a website is not a picture. A website is something that changes as we interact with it, particularly when it comes to links and navigation elements. Also, a website is not something that necessarily works exactly the same in every browser, on every device, with every screen size. Nor should it.
That variety of experience needs to be designed, and Photoshop or Illustrator are not the tools that can deal effectively with that wide variety of experiences.
A painter needs to understand how to work with brushes and paints and canvas. Those are the essential elements that will transform pigments into art.
Yes, some graphics are created within Photoshop and Illustrator. More and more design elements, however, can be created with CSS3. If you are creating drop shadows, rounded corners, gradients and stylized text in Photoshop and Illustrator, please stop. You can do so with CSS now, and if you do, pages will load faster. Yes, some older browsers will not see those design elements. That is ok.
When we say that web designers needs to code, that is too vague. A web designer does not need to write Ruby or Python or even PHP, although having a grasp of some programming concepts helps to know what is possible. But yes, a designer needs to be able to work with HTML markup and CSS, because that is how a website is created, that is how we design on the web. Design in the browser.
To not do so, to pretend that websites are a series of static pictures within a certain set of dimensions, is to deny the rich flexibility and possibilities that the web offers.
Designers know how to solve problems. One of those problems involves creating efficient markup that describes the content and then makes it visually attractive and interactive. Good designs involve good HTML and CSS, which is valid, semantic and accessible.
HTML should be simple. There are relatively few elements. Yet and over, I see truly terribly HTML.
The reality is that it’s not just designers that need to know how to “code.” Developers do as well.
All the effort that goes into creating lean, efficient, magical server-side code is wasted when the front-end code is garbage.
Real award winners for garbage code are often vendors and CMSs. Did the developers learn HTML and CSS 10 years ago and just never bothered to update their knowledge? Is it faster and quicker to throw down some proprietary attribute on an element rather than use valid HTML? Is it convenient to wrap eleven divs around the main content area of a website (I’m looking at you, Acquia Prosper theme for Drupal!)?
If the HTML used to craft websites is so often a midden heap, perhaps this is at least partially due to how little HTML knowledge is valued.
If you look around at job listings, those that primarily involve coding HTML, or even HTML and CSS, are at the bottom of the pay scale. Designers and programmers are honored with higher pay and more illustrious job titles, while those who we ask to write the HTML that actually brings our websites to life are usually entry-level employees.
If we do not value those who write HTML and CSS, is it any wonder that there is so much poorly-written HTML on the web?
I want to be very clear: there are a multitude of fine designers and web developers who write superb HTML and CSS. I tip my hat to you. Thank you for all you do.
HTML and CSS are the building blocks, the pigments, the brushes, the canvas with which we make the web beautiful and useful. Let us honor those skills and know that to create websites requires knowledge of how to manipulates these essential elements.
HTML and CSS, I salute you!