IMC CORSHAM

1
IMC _at_ CORSHAM

• What makes a good website?

2
What Makes a Good Website?

• One that works !
• What do we need to look at first
• Aesthetics
• Navigation
• Content
• Speed
• Promoting your site

3
The Sum is greater than the parts

• Aesthetics looks great no-one sees it
• Content Superb no-one reads it
• Functionality loads no-one uses them
• Navigation easy no-one uses it
• Speed extremely fast (if it were called)

4
Aesthetics
5
Design notes

• Use contrasting colours but not too contrasting
• Dont use pictures as a background
• Make sure that your user feels secure on every
  page
• The ideal design means no info is more than 3
  clicks away
• Try to avoid scrolling pages

6
Be kind on the eye

• Black on white is easiest to read
• This is quite hard against this background
• This is harder
• This is pointless!

7
How to check

• Check out whether your design works at
  http//www.fixingyourwebsite.com/drhtml.html
• HTML validator at W3
• http//validator.w3.org/

8
Practical exercise

• Use these 2 tools to test a range of pages/sites.
• For example
• Your company site
• www.bbc.co.uk
• http//come.to/Kingswestonstables

9
Navigation
10
Be well organised

• Users equate poor organisation with poor design
• Think about what is above the fold
• What size browser window are you designing for?
• Provide different ways of navigating the site,
  using text, buttons, images etc

11
Navigation when its unclear

• How do you set up a free email account on
  Freeserve?
• http//www.freeserve.com/
• How do you find out about browsers at the WWW
  consortium?
• http//www.w3.org/

12
Interactivity

• Involve the user
• Sense of fun, adventure or exploration
• Engagement eg surveys and forums
• Games
• Anything which makes the user actively use the
  site

13
Content
14
Original Content

• Credible, original content
• Keep the content up to date
• Share as much information as you can
  newsletters, ezines, updates, behind the scenes
• Think about the USP of your site (all of the
  above)

15
One to One

• Identify your audience
• Research your audience
• Target them!
• Customise the information if you can (think
  Amazon)

16
Things to avoid

• Splash pages
• Text and links the same format hard to
  differentiate
• Unnecessary links (www.anything.com) especially
  within the text
• Image and text links jumbled up
• Too much content

17
Speed
18
Optimise your files

• Think of the user with a 56K modem
• Break up large tables nested tables better
• Optimise graphics for the web (aim max 20Kb per
  graphic
• Current practice suggests layers rather than
  frames
• Remember the alt text
• Optimise the HTML eg remove spaces, comments,
  commentary etc tools avail to help with this

19
Browser specific

• Not everyone uses Internet Explorer
• Safari, Mozilla, Opera to name a few
• Netscape displays things differently
• This site is optimised for

20
Not everyone uses one of these
21
Promoting your site
22
Your audience needs to know!

• Search engines (metatags/description)
• Links (v imp for Google)
• Affiliate programmes
• Word of mouth
• Is your web address on your business cards?
• Web sources, for example magazines/listings etc

23
Stickability

• Ezines
• Forums
• Regular updates
• Freebies!
• Games
• No pop-ups!

24
Accessibility

• Not just catering for the disabled
• Anyone,
• Anywhere,
• Any equipment

25
Reasons for accessibility

• Rational (business)
• Moral
• Legal / obligational

26
Ethical
http//www.eypd2003.org
27
Remember disabled is not less able

• Watch the following video clip seems easy
• Blind user
• Using JAWS screen reader
• Using refreshable Braille output device
• Filling in forms online (Inland Revenue self
  assessment!)

28
General accessibility themes

• The web is an information medium
• Separate content ( structure) from presentation
• Understandable, navigable content
• Alternative pages/sections only as last resort

29
Easy Assumptions to make

• Needs human intervention to give appropriate
  meaning

Photo of earth from space NASA navigation
button Dense clouds cover most of South
America Information on outer space
30
Taking things for granted

• Requires appreciation of wider issues

Go to ltVital Pagegt by clicking the red apple
31
Well it looks good!

• True accessibility demands good usability
• Bad usability creates problems for all users but
  impacts on those with special needs even more.
• Bobby (http//bobby.watchfire.com/bobby/html/en/in
  dex.jsp) tests web pages for accessibility if
  accessible, entitled to use Bobby logo

32
(No Transcript)
33
(No Transcript)
34
Follow the standards

• World Wide Web Consortium (W3C)
• Web Accessibility Initiative (WAI)

• Web Content Accessibility Guidelines 1.0 WCAG
  1.0
• - 13 Guidelines
• 65 categorised checkpoints
• http//www.w3c.org/WAI

35
WAI checkpoint priority levels

• Priority 1 A Web content developer must
  satisfy this checkpoint. Otherwise, one or more
  groups will find it impossible to access
  information in the document.
• Priority 2 A Web content developer should
  satisfy this checkpoint. Otherwise, one or more
  groups will find it difficult to access
  information in the document..  
• Priority 3 A Web content developer may address
  this checkpoint. Otherwise, one or more groups
  will find it somewhat difficult to access
  information in the document.

36
Practical exercise

• Use the Bobby validator to test 4 sites and
  review the results
• You might want to start with www.wiltscoll.ac.uk !

37
5 Things to check on your site

• All images have appropriate alternative text
• Colour alone is not used to highlight information
• Hyperlinks are appropriate no click here
• Pages dont break when text size is increased
• Everything can be done with the keyboard as well
  as the mouse

38
Sites to consider

• http//www.tuxedogov.org
• http//ianrwww.unl.edu/
• http//www.beatles.com/top.html
• http//historywired.si.edu/index.html
• http//www.almost-famous.com/index_main.html

39
Web pages that suck

• http//www.usoftrecords.com/