Lecture 9 Usability Orignal


Published on

Published in: Education, Technology, Design
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Project 1 (and project 2) application of these concepts is very Important.
  • From The New York Times: One officer commented on the new process of calling for backup: “ Do you think that if you’re hunkered down and someone’s shooting at you in your car, you’re going to be able to sit there and look for Control or Alt or Function?” The users of the new system say they weren’t consulted about it’s design. Two studies by the Nielsen Norman Group. One with adults, one with teens (13-17). Participants of both studies were assigned tasks to complete at 23 web sites of well-known companies. Teens completed these tasks 55% of the time. Adults completed 66% of the time. Teens didn’t cope as well because their reading and research skills are poorer and lack perseverance by comparison to the adult participants.
  • Development - Coding, technical construction. In many respects the “easy bit”. You can be completely devoid of usability, accessibility and design skills amd still be a competent developer. Design - considering aesthetic , functional and many other aspects of an object.
  • Rules for personal sites are generally laxer but if you are working on something purely for your use, why publish it on the web? The act of placing something on the web invites an audience. Personal web sites can be read by potential employers. Commercial sites need to care about usability most - their viability relies on their ability to attract customers. Clubs and societies may have a reasonably limited audience and may wish to tailor their content to members.
  • Tip: Hold your breath while you page loads.
  • Coca-cola - The Gods Must Be Crazy (1980): A Sho in the Kalahari desert encounters technology for the first time--in the shape of a Coke bottle. He takes it back to his people, and they use it for many tasks. The people start to fight over it, so he decides to return it to the God--where he thinks it came from.
  • What’s the point of putting content on the web? To inform To advertise something To sell something To display your artistic ability To mislead
  • Not including a title/leaving the default title, is a very common bad habit. Do a search for allintitle: untitled document in Google. Titles used as default bookmark text by many browsers.
  • Do parts of a site contradict each other? Dunedin SPCA hides it’s open hours. The Art Gallery maybe doesn’t really make it obvious enough. The Public Library gives what we’d expect.
  • Provide on/off controls for music.
  • Clicker questions to follow.
  • Clicker Question
  • Lecture 9 Usability Orignal

    1. 1. Lecture 9: Usability Identifying the Good, the Bad and the Ugly. SFDV2001 Web Development
    2. 2. But first: Clickers You should all now have a clicker - a bright orange remote control. You are going to use these remote controls to answer questions in lectures. This means you can test your knowledge and we know when to spend more time on a concept. When I present a question, you aim your clicker at a receiver and press the button on the remote which corresponds to the answer you think is correct. Easy! Let’s try it.
    3. 3. What is usability? Usability is a quality used to refer to an interface’s ease of use. Usability is about ensuring that something you create is usable. Usable not by you, but by the intended audience. Why should we care about usability? Because if you don’t people won’t want to use your site. Remember there are millions of other web sites to use and they are all just a few clicks away.
    4. 4. The San Jose Police Force installed a new dispatch system in its patrol cars. Officers claim the system is too complex and difficult to use. A non-web example: Many of these “usability problems” are just old people not coping with technology. Younger people have no problems coping. Right? Wrong! Studies shows that teenagers are less web-savvy than their parents.
    5. 5. Accessibility is about measures you can take to make your pages easier to use for people with disabilities. Usability is about enhancing the experience for all users. Design is used rather openly with regard to web pages and people often really mean development (your textbook is a classic case). Usability, accessibility, design… what’s the difference? Usability Accessibility Design Development
    6. 6. <ul><li>Pay close attention to how you feel when you use a web page. </li></ul><ul><ul><li>What makes you feel frustrated or confused? </li></ul></ul><ul><ul><li>What makes your visit to a site a good one? </li></ul></ul><ul><li>Expectations for different kinds of sites vary: </li></ul><ul><ul><li>Personal </li></ul></ul><ul><ul><li>Commercial </li></ul></ul><ul><ul><li>Clubs and societies </li></ul></ul>Creating successful web pages depends on your ability to critically analyse pages that you create and encounter.
    7. 7. When we click on a result from our query we normally don’t know what we will be confronted with. One of the first questions we may ask ourselves upon arrival is: What is this about? First Impressions: Often when we want to find information on the web, we use a search engine to find a list of sites that possibly contain the information we are looking for. You should be able to look at the home page of any site and figure out what the site is about within four seconds. If you can't, your site has failed. - Vincent Flanders ( Web Pages that Suck )
    8. 8. <ul><ul><li>http://www.trademe.co.nz/ </li></ul></ul><ul><ul><li>http://www.sorted.org.nz/ </li></ul></ul>Some examples: <ul><ul><li>http://www.1amp.com/ </li></ul></ul><ul><ul><li>http://www.resultassociates.com/ </li></ul></ul>Those who don’t get it: Those who do get it:
    9. 9. A (very) few companies can get away with not being explicit: http://www.cocacola.com/ http://www.mcdonalds.com/ But it wouldn’t hurt for them to say who they are and what they do. A product or company may be familiar in one particular culture, but the potential audience for web pages is world wide.
    10. 10. Content Quality content is vital. Your site needs to contain things of use or interest to those who visit. For repeat visitors you need to regularly provide fresh content. <ul><li>Ultimately, users visit your website for its content. Everything else is just the backdrop. </li></ul><ul><li>Jakob Nielsen ( www.useit.com ) </li></ul>
    11. 11. <ul><li>Problems occur when: </li></ul><ul><ul><ul><li>Initial enthusiasm for a website fades. </li></ul></ul></ul><ul><ul><ul><li>Company pays for development only, not maintenance. </li></ul></ul></ul><ul><li>Out of date </li></ul><ul><ul><li>For many sites the “freshness” of their content is key. http://news.bbc.co.uk </li></ul></ul><ul><li>Unfinished </li></ul><ul><ul><ul><li>Poorly planned. </li></ul></ul></ul><ul><ul><ul><li>Enthusiasm lost. </li></ul></ul></ul><ul><ul><ul><li>The dreaded “under construction” page. </li></ul></ul></ul>
    12. 12. <ul><li>Appropriate titles - [change examples below as required] </li></ul><ul><ul><ul><li>Used by both people and search engines. </li></ul></ul></ul><ul><ul><ul><li>Used as default bookmark names in many browsers. </li></ul></ul></ul><ul><ul><ul><li>Will be read out of context. </li></ul></ul></ul><ul><ul><ul><li>Should help distinguish pages from each other. </li></ul></ul></ul>
    13. 13. <ul><li>Writing for the web </li></ul><ul><li>Text should be: </li></ul><ul><ul><li>Simple </li></ul></ul><ul><ul><li>Clear </li></ul></ul><ul><ul><li>Short </li></ul></ul><ul><li>Avoid jargon & “geek speak”. </li></ul><ul><li>Check spelling and grammar, names and dates, etc. </li></ul><ul><li>Make important information easy to find </li></ul><ul><ul><li>Contact information - email, phone, address </li></ul></ul><ul><ul><li>Store location </li></ul></ul><ul><ul><li>Open hours </li></ul></ul>
    14. 14. <ul><li>Tiny text </li></ul><ul><li>Poor contrast </li></ul><ul><li>Inconsistency </li></ul><ul><li>Horizontal scrolling </li></ul><ul><li>Odd Behavior </li></ul>Appearance Problems
    15. 15. Backgrounds Flashing things Entrance pages Flash Intros Be careful with: Avoid: Music that starts up without warning Pop-up windows Required plug-ins
    16. 16. Anyone who slaps a 'this page is best viewed with Browser X' label on a Web page appears to be yearning for the bad old days, before the Web, when you had very little chance of reading a document written on another computer, another word processor, or another network. -Tim Berners-Lee in Technology Review, July 1996 “ The site is best viewed in Internet Explorer because I am too lazy  to test it in anything else.” “ We can not be bothered to validate our HTML or look at the page in another browser.” Browser requirements
    17. 17. Your pages will not look the same in every browser. But they can be usable in every browser. [Change images as needed] The web isn’t like print
    18. 18. <ul><li>Planning - The key phase in any project. </li></ul><ul><ul><li>What is the purpose of your web site? </li></ul></ul><ul><ul><li>Who is your target audience? </li></ul></ul><ul><ul><li>What information will you present on your site? </li></ul></ul><ul><ul><li>How will your site be structured? </li></ul></ul>Creation process Plan first and code later. Measure twice and cut once.
    19. 19. <ul><li>Construction </li></ul><ul><ul><li>Construct and test a template page before continuing with the rest of the site. </li></ul></ul><ul><li>Evaluation </li></ul><ul><ul><li>Repeated throughout the creation of a web site. Never a one-off event. </li></ul></ul><ul><ul><li>Test, test some more, test again. </li></ul></ul>
    20. 20. It's easy to make things difficult, but it's difficult to make things easy. Learn the rules so you know how to break them properly. - Dali Lama
    21. 21. Recommended sites: Dey Alexander (user experience design specialist) http://www.deyalexander.com/ Jakob Nielsen’s website http://www.useit.com/ Vincent Flanders’ Web Pages That Suck http://www.webpagesthatsuck.com/ Further reading: Don’t Make Me Think by Steve Krug Web Bloopers by Jeff Johnson