Web Design Small Cover

Buy the PDF of
Web Design:
A Complete Introduction

See the book at amazon.co.uk or amazon.com

Related Site

Web Security Topics

Related Books

Secure Communication Cover

Securing A Server Cover

References for Chapter 10

Books

Steve Krug, Don't Make Me Think!: A Common Sense Approach to Web Usability, 2nd ed (New Riders: 2006)

A very popular book on usability, which includes material on visual design. The message is in the title.

Greg Berryman, Notes on Graphic Design and Visual Communication, revised edition (Crisp Publications:1990).

Only 46 pages, without colour, and by no means new, this dense text produced in uppercase "handwriting" is nevertheless still one of the best and most popular introductions to fundamental visual design principles, and therefore more worthwhile than many longer or more flashy books.

David Crow, Visible Signs (AVA Publishing: 2003).

Large format highly visual introduction to semiotics. A useful and interesting guide to this important subject, with lots of practical examples for the visually oriented.

Alan Fletcher, The Art of Looking Sideways (Phaidon: 2001).

Very popular and amazing value, this huge, hardcover book is a highly idiosyncratic and unique "guide to visual awareness" by an internationally-known designer. It is like a well-informed and carefully designed scrap-book full of all kinds of ideas, facts, images, quotes and thoughts.

David Dabner, Graphic Design School (Thames and Hudson: 2004).

Popular, cheap and cheerful, highly illustrated but basic introduction to graphic design in general. The few pages specifically about Web design are best ignored.

Leslie Cabarga, The Designer's Guide to Color Combinations (North Light Books: 2003).

Square format hardcover book, only 144 pages, but full of practical ideas for colour combinations, arranged and illustrated according to historical era (for example, combinations typical of the 1960s or of Victorian times). Colours are specified in CMYK values but it's easy to adapt for the Web. Surprisingly useful for generating ideas for colour schemes for sites.

Faber Birren and Johannes Itten, The Elements of Color: A Treatise on the Color System of Johannes Itten, Based on His Book "The Art of Color" (John Wiley & Sons, Inc.: 1970).

Short (96 pages) square format hardcover book with good colour illustrations, introducing Itten's famous ideas about colour. As in "The Art of Color" the text is not easy to understand, but some important points are graphically illustrated.

For those who want and can afford the full work, Itten's "The Art of Color" is at last available again.

Carolyn Knight and Jessica Glaser, The Graphic Designer's Guide to Effective Visual Communication: Creating Hierarchies with Type Image, and Color (RotoVision: 2005).

Only for serious graphic designers, this hardcover book is entirely about creating visual hierarchies and includes lots of examples from the (print) industry as well as practical exercises.

Jennifer Tidwell, Designing Interfaces (O'Reilly: 2005).

This book describes generally applicable ideas about interface design that you can apply to Web applications, whose Web pages constitute their interface.

Online Resources

Accessible, Usable, Universal, & Stunning Web Designs | Accessites.org: Home Page

A site designed to showcase and award the developers and owners of accessible, usable, universal, and beautiful, standards compliant websites.

Gestalt Principles of Perception in Design | Gestalt and the Principles of Graphic Design

Links to articles and resources specifically concerned with gestalt principles.

Visual Design

A set of links to articles and resources on visual design for usability.

Usability.gov

The United States' Government's official guide to developing usable and useful Web sites …

Functioning Form - Visual Communication & Web Application Design

Luke Wroblewski's article on Visual Communication Principles for Web Application Interface Design. Summary on this page with full PDF to download.

Typetease

An online tool for previewing a short text sample in various Emigre Fonts.

The Luscher Color Test

On online version of the Max Luscher's 1969 colour test, which is concerned with the psychology of colour

valcasey.com . Visual Design

A well-known American designer's set of notes on aspects of visual and interaction design for the Web. Rather idiosyncratic, but has a lot of links to real examples.

Inkscape tutorial: Elements

A short, simple, illustrated introduction to some basic elements of visual design.

ColorBlender.com | Your free online color matching toolbox

Nice little free award-winning online tool for colour palette design and colour matching. Results can be saved or downloaded for use in Photoshop or Illustrator.

The Best Designs - [TheBestDesigns.com] - Recognizing The Best of Web Design

A young American female Web designer's selection of the best web design examples on the Internet, web design articles, and web design resources.

Digital Web Magazine - The Principles of Design

An illustrated article summarizing some basic visual design principles, with some useful links.

Floatutorial: Step by step CSS float tutorial

A set of tutorial examples showing how to achieve various useful effects with CSS floats.

Open Source Templates

A collection of page templates, made available under a Creative Commons Licence, which means that they can be used for free by anybody. The quality is variable, and no information is provided about whether the templates comply with Web standards. The site also has themes for some popular blogging services.

Websites as graphs - an HTML DOM Visualizer Applet

A lovely Java applet which displays the structure of a Web page as a coloured graph, giving a visual impression of its complexity. Colours are used for different types of element, so, for instance, you can spot table-based layouts at a glance, because they have many red nodes.

curvyCorners - JavaScript Rounded Corners and more.

CSS3 provides a simple and clean implementation of rounded corners, for those who like them, but not all browsers yet implement them. In the meantime, if you really want to have rounded corners on your page, using JavaScript is probably the best way to go. This site offers a free implementation, which is compatible with all the main browsers.

IAB Standards and Guidelines - Universal Ad Packages

These are the standard shapes and sizes for ads embedded in Web pages. If you need to design pages that can accommodate adverts, or you need to design adverts themselves, you will need to know what these standards are.

Design Eye for the ______ Guy

A site showing how a group of designers redesigned some well-known sites. The redesign of Jakob Nilsen's site is particularly good at showing how visual design is much more than decoration and can make a major contribution to usability.

Webby Awards

Webby awards are about as meaningful as Oscars, but the annual showcase inevitably points you at some interesting design work.

Mobile Web Best Practices 1.0

Making sites that work on devices like mobile phones is going to be the next big challenge for Web designers. Here is advice from W3C on the matter.

Vitamin Features » The MySpace problem

Not a particularly perceptive or deep article, but one that raises an important point: if people actually like pages that any professional designer would consider a complete mess, what is the basis for our judgements on design?

Design Observer: writings about design and culture

Design Observer is a sort of online magazine about design in general. More graphic design than Web design, but sometimes there are ideas that can be translated to the Web.