Over the last years of web programming, I've noticed how bad I am at designing things. I have substantial knowledge of HTML and CSS, I can make a website look like I want it to, I have some pretty intense knowledge about usability. My only problem is: I can't design a web-site or even an element of it to look good and solid. Either the colors are wrong or the spacing, I can't pinpoint it most of the time, but something is off every time.

How could I get a better feeling for design matters like compositing or coloring? Could you recommend any books, articles or maybe trainings?

6 Answers
6

If you are anything like me, you are a code monkey with the artistic skills of a 2 year old. Honestly, this is where I allow other people to use their strengths; or use a third party template. When artists need code, they come to me. When I need art, I go to the artists. It works well that way.

If I really need a nice design, I pay for the template and then massage it to what I want. However, if you really want to learn, I would encourage you to take a design course. It would be an almost necessary start.

Nice design -- yes, no doubt about it, I'll go a proper designer. However sometimes I need a little idea of my own, e.g. for small projects. I don't need super-graphics, but I need consistency which I don't get.
–
Nikolai ProkoschenkoNov 9 '10 at 12:38

1

Use a free template then dissect it. Use firefox with the firebug plugin to see what elements are composed with what CSS and HTML. Great way to learn.
–
JosaphNov 9 '10 at 12:42

Also, design programs in colleges are teaching CSS and web design tools (Dreamweaver, etc.) to their students. So, for people like me who know a good design when they see one but could never create it themselves (just program it), we don't necesarily have to anymore.
–
Michael KNov 9 '10 at 14:27

I have no real difficulty coding CSS and HTML, I'm more interested in the visual part of it.
–
Nikolai ProkoschenkoNov 9 '10 at 14:46

@rassie: Right. But that is where the templates come in. They have a myriad of designs available to download. Download them and see how they designed the aspects to work together with color tables, etc.
–
JosaphNov 9 '10 at 17:01

You can look into Making and Breaking the Grid and History of Graphic Design. Maybe get a book on type too, and something on color psychology. Don't be overly concerned with the books though; they'll just give you the basics and principles. Probably the most important thing to do is to set up a drafting table and start practicing.

And I mean drafting table; a lot of the digital page layout/drawing/typesetting tools people use these days were built to ease the processes of putting a layout together. Seeing the original processes first hand will make it that much easier to apply them in the modern context. The switch out of a computer environment will also give you a more direct experience with what you're trying to achieve (which is incidentally the same in print and on the web; a readable, engaging layout).

Basically, just read up on the theory, then practice. A lot.

That's about as good a process as I can think of, sadly. In the same way that you can't really Learn C++ In 21 Days, you can't really Learn Design In 21 Days. You can get enough of the basics that people won't laugh at your layouts, but getting really good at it requires a lot of effort and focus.

@rassie - my bad; linked it to the Meggs text as intended. It's useful, even though it has the word "history" in the title. Also, as a note, I don't know if "Making..." is widely accepted, I just found it useful for understanding layout concepts.
–
InaimathiNov 9 '10 at 13:59

I was a full-time graphic designer before I became a programmer. A graphic design class will lay down a solid foundation here. It'll be business cards and menus, but it will give a good introduction to font styling and selection, basic layout principles, and the like, most of which will be applicable to the web (but not all). A couple of quick resources to help you get started on the web stuff:

Don't Make Me Think by Steve Krug is an excellent introduction to clean, efficient web design. You won't find the latest design trends, but you will find the ones that work.

Khoi Vinh of the excellently designed Subtraction website is about to release a book: Ordering Disorder: Grid Principles for Web Design, which is highly anticipated. He's really going to get into the details of what principles from print design theory applies and what doesn't.

The Non Designer's Design Book is a good introduction to the general principles. I found that, combined with Don't Make Me Think were a real help in giving me an overview of practical design.

If I want a good design I talk to a graphic designer, but if I have a good design I can implement it across a website and if I want a kind of good-enough design for a prototype or a project where the design isn't so important, I can manage that myself.

Those will give you a foundation in the IDEAS behind design and use of color. After that, nothing will help you like decomposing designs that you like, figuring out how the ideas that you've learned are being applied. Then try to accomplish similar things but using the design elements differently.

How I learned to have some sense of graphical design: firstly, I figured there was really no theory. If you want to create mediocre design, just copy it from someone else: the source for copying is vast and endless, that's Internet; if you want to have an innovative, genius design, then read the "theory" and do the opposite.

Keep studying how best designs are done, all by yourself. Take a web site that made you say "wow" at first glance, then start digging, decomposing and dissecting it, not necessarily literally of course, to see what exactly was that excited you so much. Or what is it about a given web site that you wouldn't have figured yourself (is it spacing, fonts, the color scheme?). Note everything and go on to the next design.

After a while, and it may take months and even years, you will build up your internal sense of graphical beauty. Anyone can do it. It's just that it takes time and patience.

(Try doing artistic photography at your spare time, too: it's probably the easiest of all arts, but again, improves your tastes. Don't forget to study the best photographers' works.)

If I could vote this down I would. Design is almost entirely composed of theory—it's those theories that allow for so much variety—and learning those theories will help the OP immensely. Designers rarely "do the opposite", good design is as much about applying those theories in innovative ways; if someone is doing the opposite it's because the project calls for it. That's why it's called theory. Second, not all designs can be freely copied, there are copyrights that need to be managed as well. I'm all for fair use, derivative works, and all that, but care must be taken here.
–
Philip ReganNov 9 '10 at 14:28

@Philip Regan: by copying I mean borrowing ideas rather than copying the layout and the whole look. Further, is there a theory of musical composition? Certainly there is. But the funny thing is geniuses don't needed it (or actually theorists improve and extend the "theory" based on their work), and to mediocre composers the theory is of no help anyway. Because it's art, not technology, neither is it science. All you need in art is a good taste and motivation.
–
mojubaNov 9 '10 at 14:33

@Philip Regan: in any case I improved my design skills by studying actual work rather than theory, in fact both in web site design and photography.
–
mojubaNov 9 '10 at 14:35