Web Usability


Published on

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

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

No notes for slide

Web Usability

  1. 1. Welcome Sub : Usability of web Mangesh Monde (Webdesigner & Sr. faculty, Edit institute)
  2. 2. Usability <ul><li>Usable sites are those which help users to accomplish a goal easily, quickly, and pleasantly. </li></ul><ul><li>You should test your Web site to see if it is usable . </li></ul>
  3. 3. What is usability? <ul><li>Usable Web sites are those which help users to accomplish a goal (e.g. to obtain some information) easily, quickly, and pleasantly. </li></ul><ul><li>Some specific usability strategies include making sure the content is worthwhile, and keeping page size small so that the site can be navigated quickly. </li></ul>
  4. 4. Help users to achieve a goal <ul><li>can help users to achieve a goal (usually, to obtain some information or &quot;do something&quot; such as ordering a book). </li></ul><ul><li>makes it easy for them to achieve that goal. </li></ul><ul><li>allows them to achieve it quickly . </li></ul><ul><li>gives a pleasant (i.e. not boring or painful) experience while the goal is being achieved . </li></ul>
  5. 5. Worthwhile content <ul><li> To be usable, your site must do something useful - provide information or services that will be of interest to your audience. The content is worthwhile. it is easy to find desired information within the site. </li></ul><ul><li>E.g. users heading to an electronics manufacturer's site are likely to have one (or both) of two goals in mind: </li></ul><ul><li>1. information about products </li></ul><ul><li>2. chance to buy products </li></ul>
  6. 6. Making it easy & quick <ul><li>Pages can make it easy to obtain content by providing good navigation controls, and helping the user to understand the navigation scheme with location information etc. </li></ul><ul><li>pages download quickly and there are not too many &quot;clicks&quot; between the front page and a target page. </li></ul><ul><li>There are two main ways to make a Web site quick to use: </li></ul><ul><li>1. Making pages download quickly. </li></ul><ul><li>2. Designing the site so that users can get to a desired page quickly . </li></ul>
  7. 7. Clean design <ul><li>Clean design can make pages more pleasant to look at, and also easier to use. You don't need to be an expert graphic designer to create cleanly-designed pages. </li></ul><ul><li>Avoid unnecessary elements (graphics or text that isn't relevant). </li></ul><ul><li>Avoid distracting elements (animated GIFs, striking colors, etc.) </li></ul><ul><li>Don't use techniques you don't understand. </li></ul><ul><li>Arrange the page into visual areas (title, content, navigation, references, etc.) and stick to that template. </li></ul>
  8. 8. Usability problems <ul><li>Many sites on the Web are not very usable. Some common problems include a lack of clarity (the site does not explain what it is about) and slow loading times due to overuse of large graphics. </li></ul>
  9. 9. What causes problems? <ul><li>confusion because the site does not clearly explain what it is about? </li></ul><ul><li>long loading times due to overuse of large graphics, Java applets, ad banners, and other &quot;flashy&quot; elements. </li></ul><ul><li>inconvenience because sites require bizarre software to be installed. </li></ul><ul><li>difficult navigation because the navigation controls are hard to find or poorly labeled - or because there are far too many navigation links on the front page. </li></ul><ul><li>poor readability because of inappropriate design. </li></ul>
  10. 10. What causes problems? <ul><li>ugliness because of bad or inconsistent graphic design, when a simpler approach within the designer's capabilities would have worked better. </li></ul><ul><li>irrelevance because pages were designed considering only what a company wants, not what the users of its Web site want. </li></ul><ul><li>complexity because the page designer expects users to &quot;learn&quot; the site, rather than using standard conventions. </li></ul><ul><li>inaccessibility because the site was not designed correctly and cannot be viewed by users with disabilities. </li></ul>
  11. 11. Site identity <ul><li>Every page on the Web should ensure that users can understand its purpose. Even users not in the target audience should be able to figure out enough about the site to know whether it has content they are interested in or not. </li></ul><ul><li>This can usually be achieved by a few sentences on the front page, linked to a more detailed &quot;about this site&quot; section. </li></ul><ul><li>Many, many sites on the Web neglect this basic duty, which means that users' time is wasted as they look around the site trying to gain some sense of its purpose - which could have been simply summarized to them from the start. </li></ul>
  12. 12. Speed problems <ul><li>Lots of Web sites are unnecessarily slow to use. Speed problems can be caused by a variety of issues, most of which are within the control of the site designer. </li></ul><ul><li>Large graphics. </li></ul><ul><li>Each page's total size should be kept small , as small as possible. This means avoiding large graphics wherever possible. </li></ul><ul><li>Gratuitous technology. </li></ul><ul><li>Unnecessary Java applets, Flash movies, MIDI files, and the like adorn far too many Web pages. </li></ul><ul><li>Superfluous graphics. </li></ul><ul><li>&quot;send me email&quot; animated GIFs, &quot;Best viewed with Internet Explorer&quot; buttons, &quot;Under Construction&quot; icons: these all increase download time, and are completely unnecessary. </li></ul>
  13. 13. Speed problems <ul><li>Abuse of tables. </li></ul><ul><li>Tables are often used (usually inappropriately) to layout pages. If the entire page is placed in a table, then some browsers will not display any of the page until the whole thing has loaded. </li></ul><ul><li>Including too much on a page . </li></ul><ul><li>If a page has more than 50 KB of text, then something is probably . </li></ul><ul><li>Poor Internet connectivity. </li></ul><ul><li>Some sites, especially on free services, may suffer from slow data transfer rates. </li></ul>
  14. 14. Difficult navigation <ul><li>Some sites have navigational controls which : </li></ul><ul><li>are not clear to new users, because they use an unnecessary symbol. </li></ul><ul><li>are not clear because they rely on icons without explanatory text. </li></ul><ul><li>are confusing because the titles were poorly chosen. </li></ul><ul><li>are far too numerous, so that it is difficult to find the desired choice. </li></ul>
  15. 15. Poor readability <ul><li>Sites are often difficult to read because: </li></ul><ul><li>a small font was specified. </li></ul><ul><li>Poor colors were chosen. </li></ul><ul><li>the &quot;measure&quot; (length of a line in words) is too long, so that text is too difficult to read. </li></ul><ul><li>a repeating background image or texture was used, making text difficult to read. </li></ul>
  16. 16. Ugliness <ul><li>To understand is that pages do not have to include lots of graphics, complex color schemes, or interesting layout in order to look good. A page can still look good even if it is very simple. </li></ul><ul><li>The problems mostly occur when people attempt complex designs. </li></ul>
  17. 17. Worthlessness <ul><li>A Web site probably is intended to fulfill objectives for the designer or the company; it must meet the user's requirements first and foremost. Web sites are about users, and if users are upset or put off by a site, it makes no difference whether the marketing department's message got through: they're gone. </li></ul>
  18. 18. Design Tip for Web Site Usability <ul><li>1. Design a clear and simple navigation system. </li></ul><ul><li>According to Web usability expert a good navigation system should answer three questions: </li></ul><ul><ul><li>Where am I? </li></ul></ul><ul><ul><li>Where have I been? </li></ul></ul><ul><ul><li>Where can I go? </li></ul></ul><ul><ul><li>Your site's navigation system will answer all three questions if you're careful to include these basic elements: </li></ul></ul><ul><ul><li>A) Keep it consistent. </li></ul></ul><ul><ul><li>The navigation system should be in the same place on every page and have the same format. Visitors will get confused and frustrated if links appear and disappear unpredictably. </li></ul></ul>
  19. 19. Design Tip for Web Site Usability <ul><ul><li>B) Use suitable text inside links. </li></ul></ul><ul><ul><li>Don't make your visitors guess where a link is going to take them. Visitors should be able to expect a link's destination by reading the text in the link or on the navigation button. </li></ul></ul><ul><ul><li>C) Use CSS to highlight text links. </li></ul></ul><ul><ul><li>To Use CSS style to highlight text link, consistent visual </li></ul></ul><ul><ul><li>technique like a background color, different font, or text color that </li></ul></ul><ul><ul><li>indicates a hyperlink. </li></ul></ul>
  20. 20. Design Tip for Web Site Usability <ul><ul><ul><li>D) Always include text links. </li></ul></ul></ul><ul><ul><ul><li>Every page should have basic text links that link to all major sections of the site. </li></ul></ul></ul><ul><ul><ul><li>E) Add a text-based site map. </li></ul></ul></ul><ul><ul><ul><li>Large or complex sites should always have a text-based site map in addition to text links. Every page should contain a text link to the site map. </li></ul></ul></ul><ul><ul><ul><li>F) Include a home page link inside your main navigation system . </li></ul></ul></ul><ul><ul><ul><li>Visitors may enter your site via an internal page, but hopefully they'll want to head for the home page next. </li></ul></ul></ul>
  21. 21. Design Tip for Web Site Usability <ul><ul><ul><li>G) Include a site search box. </li></ul></ul></ul><ul><ul><ul><li>A healthy site search feature helps visitors quickly locate the information they want. Make the search box prominent and be sure that it searches all of your site - and only your site </li></ul></ul></ul><ul><ul><ul><li>H) Keep the content clear and simple. </li></ul></ul></ul><ul><ul><ul><li>You may attract visitors with an eye-catching design, but content is what keeps them at the site and encourages them to return. Content is also the best way to improve your site in search engine rankings. . </li></ul></ul></ul>
  22. 22. Design Tip for Web Site Usability <ul><ul><ul><li>I) Don't save the best for last. </li></ul></ul></ul><ul><ul><ul><li>Place your most important content high on the page. Think of a newspaper: the top story is always prominently displayed above the fold. </li></ul></ul></ul><ul><ul><ul><li>J) Make page content easy to scan. </li></ul></ul></ul><ul><ul><ul><li>Format your content so that it's easy to scan. highlight important points (or product characteristics) with a combination of header tags, bold type, color, or lists . </li></ul></ul></ul>
  23. 23. Design Tip for Web Site Usability <ul><ul><ul><li>K) Add ALT and TITLE attributes to all images. </li></ul></ul></ul><ul><ul><ul><li>Each image should have a descriptive ALT attribute and TITLE attribute associated with it - particularly images that are also links to other pages </li></ul></ul></ul><ul><ul><ul><li>L) Contrast, contrast, contrast! </li></ul></ul></ul><ul><ul><ul><li>Be careful with background images and colors because they can unclear the text content on the page. Make sure you have a good reason to deviate from the successful dark text on a light background model. Visitors can't buy your products if they can't read the content. </li></ul></ul></ul>
  24. 24. Design Tip for Web Site Usability <ul><li>2. Consistent </li></ul><ul><li>A good brand creates a user's impression of the site. </li></ul><ul><ul><li>Keep colors and typefaces consistent. </li></ul></ul><ul><ul><li>Choose your colors and fonts carefully and use them consistently throughout the site. </li></ul></ul><ul><ul><li>Keep page layout consistent. </li></ul></ul><ul><ul><li>Use a Web site template to make compulsory a uniform page structure. Visitors should be able to expect the location of important page elements after visiting just one page in your site. </li></ul></ul>
  25. 25. Design Tip for Web Site Usability <ul><li>3. Provide for visitor feedback </li></ul><ul><li>Forms are critical to the success of ecommerce sites. Without forms, you can't have a shopping cart. But any site usually needs at least one form to allow for user feedback. A form helps you control how user feedback is formatted and sent. </li></ul><ul><ul><li>Keep feedback forms short and clearly note which information is required to successfully submit the form. </li></ul></ul><ul><ul><li>Remember your international users and don't require information they may not have - like area codes or ZIP codes. </li></ul></ul><ul><ul><li>Present complete contact information including your business phone number and postal address. </li></ul></ul>
  26. 26. Design Tip for Web Site Usability <ul><li>4. Test the site on real users. </li></ul><ul><li>Remember that you are use almost usability But now it's time to get user feedback - before your online users start sending it in. </li></ul><ul><li>It also gives you valuable answers to other questions: </li></ul><ul><ul><li>Do visitors enjoy using the site? If so, they'll stay longer and read more content. </li></ul></ul><ul><ul><li>Do they understand the purpose of the site? If not, there's no compelling reason to return. </li></ul></ul><ul><ul><li>Is there any incentive to return after the first visit? </li></ul></ul><ul><ul><li>Your site should try to be the ultimate authority on the Web for your topic. A site with depth and breadth encourages visitors to bookmark it and refer friends interested in the same topic. </li></ul></ul>
  27. 27. <ul><li>Thanks </li></ul>