Web design shares many characteristics with traditional graphic design. However its interactive nature and the incomplete control over the final product makes it unique.

WEB DESIGN ELEMENTS

Web pages are composed of a variety of elements.

Type: typeface, font, style, size, alignment, list

Graphics: line, shape, color

Images: type, file format, image maps

Media: animation, audio, video

Hyperlinks: any element can point to another page or another part of the same page

WEB DESIGN PRINCIPLES

Designing useable and visually effective web pages.

Concept: the basic idea, the whole is more than the sum of the parts (gestalt), develop a clear design concept

Communication: purpose and audience, browsers, printability, simplicity/complexity

Visual Language: the particular set of design elements and rules of composition

Consistency: elements and relationship among all elements (e.g. color, font, navigation, interactivity)

Clarity: realization of intentions

Usability: design for the medium, consider portability, browsers, screen size, speed, bandwidth, navigation, scrolling, consistency

Design Process: site structure, content and navigation, visual appearance, details; schematic design, design development, final design

The Challenge: use traditional graphic design skills and experiences and reshape and apply them with an understanding of how the Web works

WEB DESIGN TASKS

Web design involves a number of interrelated disciplines.

Graphic Design: organization and appearance of graphics, type and color (how it looks)

Interface Design: interaction and navigation (how it works)

Information Design: organization of content

HTML Production: creation and maintenance of HTML code (the language of the web)

Programming: advanced functionality (forms, databases, interactivity) using scripts and programming languages

Multimedia: sound, video, animation and interactivity

WEB DESIGN SOFTWARE

Many software applications are available for creating web pages and web content.

Web Authoring: powerful WYSIWYG tools with multimedia and scripting capabilities (Dreamweaver, GoLive, FrontPage)

HTML Editors: simple HTML and text editors (CoffeeCup, HomeSite, BBEdit)

Graphics: image editing and drawing (Photoshop, ImageReady, Illustrator, Fireworks)

Multimedia: creation of interaction, animation, sound and video (Flash, LiveMotion)

Internet: viewing and file transfer(Netscape, Explorer, WS_FTP, Fetch)

A WEB DESIGN STRATEGY

Web site design involves many issues. Effective web page design requires the development of a clear strategy.

Concept: define purpose, identify audience, identify resources and constraints

Content: create and collect information including text, images, media and scripts

Site Structure: diagram site, map out directory structure, develop naming conventions, plan navigation

Page Layout: sketch visual appearance, create templates, develop typography and graphic language

Development: create HTML documents, organize and upload content

Testing and Revision: check content and navigation, get feedback, check different browsers, monitors and platforms