3D Effects

Three-dimensional illusion effects are powerful devices that can achieve excellent results. They can also add significantly to overall page filesize, and can reduce usability if overused, so should be used deliberately and with care (unlike the title image above, see cooltext.com if you want one).

Hunt, Ben. Web Design From Scratch (2005). Design>Web Design>Graphic Design>3D

About Goals

I believe that the best way to design web sites is to bear in mind the goals of the site and its users.

Hunt, Ben. Web Design From Scratch (2005). Design>Web Design>Planning

About Personas and Scenarios

Personas are an extremely powerful design tool, which help you to visualise an end-product that you can be confident will suit your users' needs by helping them achieve their goals, and help you test your success.

Hunt, Ben. Web Design From Scratch (2005). Design>Usability>User Centered Design>Personas

Alignment

Alignment is another way of creating associations between visual elements, which help users quickly understand the relationships of objects on a page.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Document Design

Anatomy of HTML Tags

This tutorial describes some of the main attributes that HTML tags can feature.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>HTML

The Attention Map

Attention mapping is a tool to help you start to plan a visual layout around realistic communication between user and site. It can also be a helpful analysis tool, helping you work out what's wrong about a layout.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Document Design>Usability

Basics

Using web sites should be easy and pleasant, just like a great experience in a shop, hotel, or library. I believe that the all Web sites can be made lovable - easy, rewarding and pleasurable to use.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Usability

Block vs. Inline Elements

HTML elements can be displayed either in block or inline style. The difference between these is one of the most basic things you need to know in order to use CSS effectively.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>HTML>CSS

The Business of Web Design

There's a lot more to being a successful web designer than designing good web sites. Your job is actually to satisfy your client. This section provides guidelines from our experience of running web agencies, which we hope will help you be more successful and more fulfilled.

Hunt, Ben. Web Design From Scratch (2006). Careers>Web Design

Case Study: Artorg Makeover

Artorg.co.uk is an online community for artists and designers. At first view, this is a really nice-looking site. It has an appealing, soft colour scheme offset with well-chosen graphics, and the content appears solid and orderly.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Redesign>Case Studies

Case Study: Business Improvement Network Redesign

The Business Improvement Network is a highly successful free club for quality improvement professionals who meet together to share their knowledge and experience. A busy website serves the network's needs well, attracts new members every week, and gives members access to lots of free information.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Redesign>Case Studies

Case Study: Foruse.com Redesign

www.foruse.com is the web site of Constantine and Lockwood. Have a look at their home page to learn more about them. This case study incorporates a brief critical review of the home page, plus a redesign.

Hunt, Ben. Web Design From Scratch (2005). Design>Web Design>Redesign>Case Studies

Clarity

Once you have your content, arranged it into a likely architecture, and worked out where it will sit on the page, you're ready to design the display layer.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Writing>Rhetoric

Colour

Colour is one of the designer's best tools. There are lots of ways to use it to help communicate a message. Colour can carry meaning, express personality, differentiate, frame, and highlight content.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Graphic Design>Color

Containment

'Containment' is the effect where one or more elements is shown as part of a group or category, through a visual mechanism.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Document Design

Contrast

Contrast is the most fundamental design device: it differentiates elements; it brings out dominant elements; it mutes lesser elements; it creates dynamism.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Graphic Design

Datasheet-Style Form

This worked example creates a compact form with multiple similar records, with the familiar appearance of a datasheet.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>DHTML>Forms

Design Like No-One's Watching

Web designers frequently suffer under the illusion that other people look at their web pages the way we do. This is wrong. Designers need to develop the skill of looking at their designs through naïve eyes.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>User Centered Design

The Design Spectrum

'Design' encompasses a very wide spectrum of disciplines and applications, which address an enormous range of different problems. When designing a product, the techniques and priorities a designer should use change according to its purpose.

Hunt, Ben. Web Design From Scratch (2006). Design>Project Management>Methods

Don't Decorate, Communicate!

When you're designing a web page, it's easy to get sucked into the detail. With your 'design' head on, concentrating on crafting and perfecting style elements, it's easy to forget to step back and see things through the eyes of your users. Your users aren't interested in giving your design work marks out of 10. They just care about getting all the relevant information, in as little time as possible, and then moving on.

Brisk, Phil. Web Design From Scratch (2006). Design>Web Design

Effective Text

In the web environment, text has enormous strengths. In many situations, using text delivers far better results than graphics. Web designers should be daring and use text wherever possible.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Writing>Typography

Favourite Logos

When I find a really nice logo, icon or button, I save a copy to file for future inspiration. Here's my collection of logos, with descriptions of why I think each one works. See article on designing logos for guidelines of logo design fundamentals.

Hunt, Ben. Web Design From Scratch (2005). Design>Graphic Design>Web Design

The Future Web 2.0 Social Experience

A long article describing a future more connected world-wide-web and a few killer applications that it makes possible.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>Community Building

Goal-Oriented Design

To me, understanding goals is the single most critical factor in the success of any design project, and fundamental to the Web Design from Scratch approach. In this section, you'll learn techniques that help you discover your own goals and gain insight into what your target audience really wants. If you're working on a project, this section will help you get a clear picture of your purpose, understand the key goals of your target users and start to visualise a high-value solution that ensures everybody wins.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>User Centered Design>Methods

The Golden Rule

Everything that goes into your web site must have a purpose. Every single element and decision must help users achieve their goals and support the site's goals.

Hunt, Ben. Web Design From Scratch (2006). Design>Web Design>User Centered Design>Minimalism