1. Web Design and Usability

2.  Web design has become increasingly complex  First generation sites are simply default backgrounds with "wall to wall" text,horizontal rules and links. Mainly designed by technologists  Second generation sites include visual treatments such as web maps and an opening page with menu options. Web Design and Usability 1 2

3. A third generation site had an entry that entices the user to pursue paths that are designed for their own needs and interests. The "core" page entices visitors to explore the rest of the site, with an exit with rewards for completing the entire site.A site may have multiple core pages for different visitors or entry points. Third generation sites often employ metaphor and visual theme entice and guide, creating a whole experience for visitors from entry to exit 3

4. Web Design and Usability Fourth Generation sites and beyond… Include scalable sites, high quality graphics,browser and plug- in detection, streaming audio-visual content, increased functionality, data tracking, e-commerce sites 4?

5. CLIENT SIDESERVER SIDE HTML Client-side scripting (JavaScript, plug-ins) Multimedia Browsers network Web server CGI scripting Databases Advanced programming (PERL, C++) TCP/IP

6. TECHNOLGY When considering principles of design for the WWW, we find that technology and design often share a co-dependent relationship design Design Vs Technology?

7. Some design issues to consider  Concept (use of analogy or metaphor)  Structure  Functionality  Navigation  Page layout  Colour schemes  Interactivity  User Feedback  Use of media  Quality Vs. Download time

8. Considerations in web design Project Management Design Technology Task tracking and team management Budget & schedule Client interface

9. 4 values of Web Design  Design Value--integration of text, graphics and interface for unity of experience  Content Value--rich, up-to-date, quality information  Production Value--quality control of technology for excellence/speed in digitized format  Utility Value--interactivity through the site (what can you do, get or accomplish at the site) Siegel, David

10. Site structure and navigation PurposeFunctionsStructureNavigation

11. Site Structure and navigation Varieties of site structure  Linear  Hierarchical  Mixed  Mesh/Web

12. Site Structure and navigation Linear

13. Site Structure and navigation Hierarchical (strict)

14. Site Structure and navigation Mixed

15. Site Structure and navigation Mesh

16. Hosting  Domain name registration  Hosting can be in-house and outsourced According to Forrester Research 66% of Fortune 1000 companies outsource their web sites to professional hosting services the cost of hosting the site will depend on how much disk space is required and how much traffic the site gets

17. Hosting  Find the right hosting solution for the client’s needs: guaranteed bandwidth guaranteed response time security scalability traffic tracking

18. Usability Usability is … ISO Definition: …the effectiveness, efficiency and satisfaction with which a specified set of users can achieve specified goals in particular environments…  concerned with how easy an interface is to understand and use  concerned with being able to map user intentions to system actions in order to achieve some goal  feedback on the action is crucial

19. Usability  Effectiveness: user is able to carry out actions and achieve intended goal  Efficiency: goal is achieved within some specified time frame  Satisfaction: how acceptable the system is to the user

20. Usability User Action Application Reaction Feedback on action Interface

21. Usability Heuristics (measures)  Navigation  Help instructions and support  Support in carrying out actions  Error handling  Consistency  Functionality

22. Usability Considerations (web)  Response times  Content presentation  Link colours  Navigation  Large amounts of text  Scannability  Scrolling  Searching Nielsen

23. User Centred Design (UCD)  Involvement of users throughout the design process  Users are central to the design process  Easier to understand software  Improves user satisfaction  Improves productivity

24. User Centred Design (UCD) Three processes:  Consultative  Representative  Consensus

25. User Centred Design (UCD)  Consultative design design team makes decisions users - source of information  Representative design user representatives involved in decision making e.g. Joint Application Development (JAD)

26. User Centred Design (UCD) Consensus design:  Users are continually involved throughout the design process  Can speed up decisions if user has appropriate authority  E.g. Participative design

27. References Norman, D., (1988) The Psychology of Everyday Things, Basic Books Faulkner, X., (2000) Usability Engineering, Macmillan Elsom-Cook, M., (2001) Principles of Interactive Multimedia, McGraw Hill Nielsen, J., (2000) Designing Web Usability, New Riders Powell, A. (1998). Web Site Engineering. Prentice Hall. Siegel, D. (1997). Secrets of Successful Web Sites. Indianapolis: Hayden Books.

28. For further information… HCI and INTERFACE DESIGN Mullet and Sano (1995) Designing Visual Interfaces. Prentice Hall PTR. ISBN: 0133033899 http://www.ergogero.com/ ACCESSIBILITY http://www.usabilityfirst.com http://www.rit.edu/~easi http://www.rnib.org http://www.w3.org/WAI/References/QuickTips http://www.dyslexia.com/qaweb.htm COLOUR http://www.umist.ac.uk/UMIST_OVS/UES/COLOUR0.HTM http://tsi.enst.fr/~brettel/colourblindness.html