1. Lecture 9: Usability , Accessibility & professional practices SFDV2001 Web Development
2. What is usability? 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. 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. Usability is about enhancing the experience for all users.
19. What are professional practices? Making a web page isn't hard - anybody can get something on the web. Making quality web pages requires skill, requires a professional. Some professional practices are things that by law you should conform to. Others are the things that distinguish your work from that of an amateur. We expect professionals to possess significant skills, that they produce work of a quality not obtainable by an amateur and that their knowledge is significant.
23. Use tabs to indent the different levels of your code: <table> <tr> <td> <p>Content</p> </td> </tr> </table> Code Layout Layout your code in a way that makes it easy to read. In the lab Taco will do this for you (with various degrees of success). You can, of course, alter Taco's attempt or forgo the automatic option altogether and do it manually.
24.
25. Fonts If you specify a specific font face, you should always provide a suitable generic font family name too: <font face="arial, sans-serif "> font-family: courier, monospace Images Use correct width and height specifications. Resize your images with graphic editing software not with your HTML code. Use good alt values - descriptive sentences. alt="Percy the cat." alt="Giraffe in hiking gear."
26. Image size and the web Dialup (56k modem) = 56 kilo bits per second, not kilobytes! 56 kilobits = 7 kilobytes per second. So, a single 32KB image will take at least 4.5 seconds. "Broadband" starts at 256 kilobits (32KB per second) maximum. 1 megabit (1024 kilobits) broadband = 128KB per second max.
27.
28.
29. Don’t forget the text in your <title> , alt , etc. Use a spell checker to help, but don’t rely on it alone. Spelling and grammar Nothing suggests a sloppy attitude quite like failing to take the time to proof read the content of your pages.
30. Testing Check and double-check that all your links work. Before and after you upload to your web server. Test on every browser and operating system you can get your hands on. Test with different connection speeds. Test on different screen resolutions. Test on different monitor types. Usability testing.
31. Involvement Keep up with what’s new in the field. There is always something to learn. For web development, one of the best way to stay current is to participate in and read the many quality web-based publications in the profession. A List Apart ( http://alistapart.com/ ) Digital Web Magazine ( http://www.digital-web.com/ ) Style Gala ( http://www.stylegala.com/ ) Mailing Lists: W3C ( http://www.w3.org/Mail/ )
32. 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/ The Web Standards Project: http://www.webstandards.org/ Further reading: Don’t Make Me Think by Steve Krug Web Bloopers by Jeff Johnson
Editor's Notes
Project 1 (and project 2) application of these concepts is very Important.
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.
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
Provide on/off controls for music.
Show aboutsct.html as an example of a poor choice.