14
CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

Embed Size (px)

Citation preview

Page 1: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Web Design

CIS 285

January 2005

Page 2: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Facets of Web Design

Profile audience Message you want to communicate Possibilities and limitations of Web

publishing Portability

Page 3: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Site Usability and Accessibility

Web’s usability – measure of how quickly it gets its message across to the user

6-8 sec rule Readers scan Browsers – not all are visual Design for the medium Make your design portable

Page 4: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Know Your Audience

How will users move through the info? Association What will attract them Why do they come to your site Technical level, reading & vocabulary level,

educational level, cultural background, sex

What technologies do users have Connection speeds Types of computers, browsers, plug-ins

Page 5: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Consider Your Own Objectives

Content of site Mission statement, requirements

document, or list of objectives Communication goals Balance end-user considerations with

one’s objectives

Page 6: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Identify Content Goal

E-commerce, on-line shopping Publishing Special interest (personal interest) Billboard Virtual gallery Gaming Product support, catalog Intranet / Extranet

Page 7: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Structuring Information

Drill-down structures Information in site is layered several levels

beneath the homepage

Flat-structure Lessening of the drill down approach Increase navigation options

Multiple browser windows Cab be used for control (forms) Avoid gratuitous use

Page 8: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Design The Site

Craft a look and feel Plan unifying themes and structures Create smooth transitions Use active white space Use a grid to provide the visual

structure Avoid too much content

Page 9: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Developing A Look

Less is often more Backgrounds Icons – intuitive ? Color choices Images Use prepackaged graphical themes Use active white space

Page 10: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Desirable Page Elements

Search engines Navigation tools

Graphics, text, image maps, buttons Links within site VS outside site

Last updated date Contact information Counters

Page 11: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Desirable Page Elements

Guest Books Feedback mechanisms Mailing lists Threaded discussion groups Chat channels Multi-media content

Page 12: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Breaking Up Long Pages

Graphic elements Horizontal rules Images Pull quote Text-based elements Table of contents Text effects

Page 13: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Testing Your Design

Pilot the site Use different browsers Try different platforms Apply different connection

speeds Test with / without plug-ins or

other media

Page 14: CIS 285 Winter Quarter 2005 Robinson Web Design CIS 285 January 2005

CIS 285 Winter Quarter 2005 Robinson

Trends In Web Site Design

Server-side processing Personalization International audience Disabled audience