Getting Started; User Customization of Web Content
Page Contents
Introduction
Welcome to Week 1 of the course.
Make sure you leave plenty of time to do the assignments justice. It's better to get a running start at the beginning of a course than to lag behind from the start. You'll enjoy the course more, and you'll probably get a better grade. You probably already know all of that, but it doesn't hurt to hear it again.
So without further explanation, I'll let you get working. Enjoy!
Part 1: Read the syllabus
Go through the syllabus and make sure that you understand what it says. If you have any questions, please send me an email (http://paulbohman.com/contact/).
Part 2: Read/View an Introduction to Web Accessibility
Read "Introduction to Web Accessibility" http://www.webaim.org/intro/. Also watch the video at http://www.washington.edu/doit/Video/www.html.
As you read the article and watch the video, consider these points:
- Never before, throughout the entire history of the world, have people with disabilities been able to access so much information independently as they can now, with the help of computers and assistive technologies. This is truly a remarkable day and age for people with disabilities.
- Web developers can take advantage of the enormous potential of the web for people with disabilities, or they can waste the opportunity by not taking accessibility into account.
- If you don't now have a disability, consider how you might approach this subject differently if you could not use your hands, or if you could not see the computer screen, or if you could not hear videos on the web, or if you had some other condition that altered your web experience.
Part 3: Experiment with different browsers and different settings
Background
Most people use only one web browser. In fact, the majority of people user Microsoft Internet Explorer (IE) 6. It's helpful to know this, but there's also a danger in knowing this. We can wrongly assume that all browsers display web content in the same way that IE displays it. Some developers think that if their content looks ok in IE, then they don't have to worry about the other browsers. Some people don't even know that other browsers exist. Well, they do. There are many other browsers out there besides IE. You'll get a chance to play around with some of them during this assignment.
Step 1: Download a few browsers
At a minimum, I want people to experience the following browsers:
- Windows users:
- Internet Explorer 6 or 7
- Opera 8.5
- Firefox 2.0
- Netscape 4.75 (Yes, it's old. That's part of the point.)
- Mac users:
If you only have access to a Windows machine, or only have access to a Macintosh, that's ok, though I highly recommend using browsers on the other platform, whatever that other platform happens to be for you.
Feel free to download other browsers besides the ones listed here. You could try Netscape 8 or Amaya or Lynx or Konquerer, or Camino... there are plenty of other browsers to choose from. You'll get the most benefit from this lesson if you choose a browser you've never used before—maybe even one you've never heard of before.
Step 2: Use the browsers
View common websites in the various browsers. Do you notice any differences in the way the website appears, or in the way that it acts? How do web sites look in Netscape 4? Try sites like MSNBC.com, ESPN.com, Hotmail.com, Gmail.com, Amazon.com, and other big name sites. How do the videos on MSNBC.com look in Firefox? Can you see the videos at all in any browser other than IE? What about the George Mason site? What about the the site of the place where you work?
Step 3: Experiment with browser settings
Enlarge the font in the browsers then go back through some of the same sites. Most browsers have some method for doing this, usually in the "View" menu. Open documents in new tabs in Firefox (Ctrl + T in Windows) or Opera (Ctrl + N in Windows). How is "tabbed" browsing different than multi-window browsing?
Opera
Opera allows you to enlarge the entire web page. How do web pages look at 200%? 500%? 1000% What do you notice when the pages are enlarged? Do you have to scroll from side to side? Try clicking on the "fit to window width" button (shown in screen shot below). How does this change the appearance of the page when enlarged? How do the graphics appear when enlarged?
In Opera you can switch to user-defined styles quite easily. click on the "user mode" button, then experiment with some of the styles in the drop-down list. Many web pages will look radically different. The real question is not how the web page looks but whether any information is lost when styles are turned off. View sites with the tables turned off (available in drop-down list), with images turned off (you can turn images off by clicking the "show images" button to the right of the "user mode/author mode" button.
You can also quickly turn off Java, JavaScript, and other features from the "Tools" menu option.
How do sites look and act with JavaScript disabled? Can you access your online email program without JavaScript?
Firefox
You can add "add-ons" to Firefox from the "Tools" menu.
If you just installed Firefox for the first time, you won't have any add-ons installed. Click on the "get extensions" link to look at what's available.
You can find many different kinds of extensions to do all kinds of things. One of the most useful for the purposes of this class is the Web Developer toolbar, available at https://addons.mozilla.org/firefox/60/. In fact, this is one of the best tools for web developers to come along in a long time, and it's free. Go ahead and install the toolbar. Experiment with as many of the options as you can. Find out what this toolbar can do. You might want to refer to an article about Evaluating Web Sites for Accessibility with the Firefox Web Developer Toolbar for some ideas.
Step 4: Use the browsers without a mouse
Now try using the tab key and the enter key to move around web sites (use tab to go forward through links and shift+tab to go backwards through links). No fair using the mouse. In fact, you might want to literally turn the mouse upside-down (with the clickable side on the bottom) so you're not tempted to use it. In Opera type "a" or "q" to navigate (instead of using the "tab" key). The tab key in Opera goes between form elements, not from link to link. Here's a challenge: go to your web-based email program and send an email to somebody, without ever using your mouse, not even when you get stuck. Can you do it? Maybe you can and maybe you can't. Are some parts of the process harder than others?
Step 5: Reflect on this experience
What's the use of doing all of these exercises? Maybe you're thinking to yourself, "well I'm always going to use a mouse" or "I'm never going to turn off JavaScript" or "I'm always going to leave the styles alone." Maybe you're right. But the point of this exercise is that there are many ways of viewing and accessing web content. There is no one right way. There is no one right method, or style. There is no one right browser. The beauty of the web is that it's available to everyone all the time, to access it however they like. Later on we'll talk about some of the reasons why user preferences are so important. For now, it's enough to know that there are many types of users with many different kinds of preferences and needs. Hopefully this exercise begins to show you what some of the possibilities are.
