views:

370

answers:

10

As a professional web designer, what are the essential techniques?

In my opinion, these are the must-learns.

  • XHTML
  • CSS
  • JavaScript
  • Script language like PHP, Perl, and Python

But however, learning these and skills using these languages may only produce well-written codes, as a skilled C/C++ programmer does. The layout of a page, colour, and accessibility issues may not be well enough.

Now the question is that, besides these essential languages, what other things must a web designer learn?

+3  A: 

First, you should read this: What should a developer know before building a public web site?

When you have done that, spend time surfing the web. Look at the design of sites that you visit and determine why you like it or not. In that I would stress that it is just as important to look at bad design as good.

Fredrik Mörk
+6  A: 

One thing I would add is a good understanding of accessibility - important for designer and developer.

Galwegian
+10  A: 

Most of the (good) web designers that I know have art degrees. And very few of them really know the technologies underlying a website.

kdgregory
I agree with this. Sometimes I've seen enough well-designed websites, but just sat and appreciate, when coming back to my own website, and sadly found no inspirations.
ryanli
Heh. My personal website shows very clearly that I *don't* have an art degree.
kdgregory
+2  A: 

Stackoverflow Archive:

Jonathan Sampson
hmmm. four out of five of those have to do with web development, not web design. The question is strictly about a web designer is it not?
Bryan Oakley
The author of the question included programming languages in his "Must-learns" list. I think it's more broad than mere design.
Jonathan Sampson
A: 

As a web designer, you should probably be proficient with Photoshop and/or Illustrator as well. And I wouldn't say you need to know XHTML, you might get by fine by knowing HTML, especially with the rise of HTML5 and the fall of XHTML2

peirix
In fact they have not much difference, I used XHTML to mean both. :-)
ryanli
A: 

Learning a little bit about Apache helps (or IIS), but more importantly, understanding HTTP (mostly GET/POST) can really make you see the big picture. Knowing exactly what is happening from your users' browsers to your code lets you fully understand how everything works...which hopefully leads to smarter design.

Use the Firebug addon to Firefox to be able to see all the requests/responses and headers for sites...that way you can see the redirects, and cookies which make sessions work, etc.

Dan Breen
+4  A: 

You need an eye for design. I suspect you can learn a lot about colors, fonts, layouts and so forth but it really helps if you have a built-in sense of what makes for a good design.

You also need an understanding of the underlying technologies. It makes no sense to craft some incredible design if it's not implementable. So, you need a background and understanding of the limitations of the platform(s) you are designing for.

Finally, you need a driving desire not to make something "cool" but something usable.

Bryan Oakley
Thanks for the `usable' word.
ryanli
+6  A: 

That's very strange that most people sticked to just technologies in their answer.

To become a professional web designer you need art/media/psychology education behind you, or at the very least some art taste, sense of beautiness and predisposition to these things. For a pure techie who cannot choose a color theme for a site and cannot understand why some UI design could be bad for end users, the design career path is closed forever. That's the most of the coders/developers.

Try to learn it on its own, read books on UI design, computer interaction psychology, learn about colors and their effects. Try doing it for at least a year, then you will see whether it's "yours" or not. Then if it works you can decide to specialize here by visiting some trainings, courses or maybe making a degree at some university.

ADDED:

Programmer's "design" example: http://www.flowershop.com/

Designer's design: http://www.reallywildflowers.co.uk/

Feel the difference...

User
In many occasions, I tend to link web designer to frontend GUI designer, now I've realized the differences.
ryanli
What differences? Both are involved in crafting a system that enables a user to accomplish a task. While in practice they both work with different toolsets and constraints, fundamentally web designers and desktop GUI designers have the same job.
Bryan Oakley
Sometimes the same job, but not the same qualifications. Consider an unqalified immigrant building you a house "off the record" and an experienced engineer with theoretical and practical knowledge. In both cases the house will be there, but in the first case will likely fall apart in the first year, in the second - could stay 50 years.
User
For short, I think web pages are sometimes more similar to a book. And in software develop, you are more affected by restrictions of the toolkits you use.
ryanli
The analogy with the immigrant makes no sense to me. You're comparing an untrained/self-trained person against someone with formal training. I'm not saying an untrained GUI developer is the same as a trained web designer. I'm saying a trained web designer and a trained GUI designer should have the same qualifications. The only difference is the toolset. In both cases -- designing a GUI or designing a website -- usability is the main goal and that requires knowledge of color, design, layout, psychology, etc.
Bryan Oakley
When speaking of GUI design, people usually refer to desktop applications and form developer. There are other strategies in design. Web sites and applications are very different. Especially, people do not generally try to make desktop applications beautiful and stylish. And you can't really make a desktop application with standard control look beautiful without making it look weird. So the tasks for designing desktop and web interfaces are very different, so are the people who do it.
User
I will agree that web sites and applications are very different from a visual point of view, and will concede that a web app designer perhaps more often needs a bit more of an artistic background than a desktop app designer. I still think they share the same goal -- to create an interface that lets a user easily accomplish a task.
Bryan Oakley
@Bryan Oakley: With the last part absolutely agree. Though again, the very understanding of facilitating user-machine communication via well designed interfaces is generally absent with desktop developers while web developers are generally at least aware of their mission.
User
Oh, I agree with the "is generally absent with desktop developers" statement. I was discussing what skills a GUI designer_should_ have rather than what most GUI designers seem to have. :-\
Bryan Oakley
A: 

A good course of study in Human Factors Engineering will also help.

HLGEM
+2  A: 

This is a huge question because "design" has two meanings: "decoration" (graphic design) and "planning" (experience/UI design). I would argue they both influence "aesthetics" (a point often lost on people with formal training in either fine arts or computer science, who sometimes see "design" as something pretty slapped on top of a stack of engineering.)

If you're interested in improving your graphic design chops, you'll need an understanding and appreciation of basic design principles: contrast, proximity, color and typography. I also wouldn't hire a designer who can't draw perspective, still life, and human figures on a piece of paper with a pencil or charcoal, and without using rulers. I believe aesthetic and artistic ability can be learned (others argue aesthetic judgment is to some degree inborn). But at a certain level, you'll need to care a lot about how things look. (Litmus test: every designer in the world has a passionate opinion about Helvetica. Do you?)

All the good graphic designers I know spend some of their free time design doodling: a fun game is to take a piece of bad design (like a used-car ad or a Thai takeout menu) and make it into a piece of good design, but without altering the copy.

For graphic design, I'd recommend starting with a few books in design basics:

  • The Non-Designer's Design Book
  • The Elements of Typographic Style
  • Designer's Color Manual ad/or Light and Color in Nature and Art Books by Wucius Wong, particularly Principles of Form and Design
  • Meggs' History of Graphic Design, and/or Graphic Design History by Steven Heller
  • The works of Edward Tufte

Taking a few classes in design basics and drawing at your local art school or community college wouldn't hurt.

I'd be hesitant to hire a graphic designer who couldn't wield Photoshop and Illustrator with proficiency, although someone with a good eye can learn these apps on the job.

I question whether experience design can be profitably learned from a book or class. It comes from working with all the parties who interact with a website: users, graphic designers, product managers, developers. IME really good experience designers begin with business objectives and then work with users or test groups to develop a mental model for delivering those objectives. They then break that model down into task domains (which might map to features) ... each of which gets its own user experience flow, wireframes and so on.

I guess I'd recommend these books:

  • Information Architecture (Rosenfeld)
  • Designing Interfaces (Tidwell)
  • Be familiar with Jakob Nielsen's work but don't let it run your life
  • Edward Tufte (again)

There's no standard technologies for UX design, although you'll probably use Visio or OmniGraffle at some point. Study other designers' wireframes and flowcharts. Michael Angeles and Khoi Vinh have a lot of their thinking online.

In regards to web design in particular, the future seems to be frameworks and modular CMSes, with a rich interaction layer (ie. AJAX). Build a website in Drupal, Django, or Rails, just to see how those things work, and add a few Ajaxy elements to get a feel for those, too.

Finally, spend a lot of time on the web and pay attention. Think hard about every web experience you have. Good UX is invisible: It makes tasks so simple you don't have to think about them. So every time you find yourself trying to figure something out on a website, ask yourself how you'd make it better.

Paul Souders