Thanks, again for all of you coming out to here a talk on Accessibility.
Here are the “Is Your Website Accessible” slides from my presentation on 2008/01/17.
I had a great time this evening doing this. It was worth all the late nights getting ready for the Refresh DC meet-up.
I will be giving an Accessibility presentation at the Janruary 17, 2008, meeting of Refresh DC. The following is the important information:
Thursday, January 17, 2008 7:00 PM – 8:00 PM
Greater Washington Board of Trade
1725 I Street NW, Suite 200
Washington , District of Columbia 20006
Please make sure to register on Upcoming so they have an idea of how many people are coming.
I just finished re-reading Roger Johansson’s wonderful article entitled “Use the label element to make your HTML forms accessible“.
I agree with everything he said, except I think by putting the label and the input elements as part of an un-ordered list (UL) or an ordered list (OL) the screen reader will announce how many items are in the list. By doing so you can then place an UL or OL inside a FIELDSET, which will inform you of how many fields you need to be filled in. This number might be greater than the actual number of items if you have lines of text in the middle of the form field list.
I found this great piece of information about using UL or OL in forms from Justin Stockton when he was looking over a form I was building. He either asked “Why I was using the <BR> tag?” or “Why I had form elements inside of a <P> tag”. I told him that was how I learned to create my forms from articles I had read. He suggested using the UL or the OL for form items. After that, by like only a day or so I was listening to either one of Derek Featherstone, Aaron Gustafson, or boths podcasts about accessibile forms and they mentioned the same thing.
Here is a short code example for filling out personal information on a form:
<fieldset>
<legend>Personal Information</legend>
<ul>
<li>
<label for=”first_name”>First Name</label>
<input type=”text” name=”first_name” id=”first_name” />
</li>
<li>
<label for=”last_name”>Last Name</label>
<input type=”text” name=”last_name” id=”last_name” />
</li>
<li>
<label for=”company”>Company</label>
<input type=”text” name=”company” id=”company” />
</li>
<li>
<label for=”title”>Title</label>
<input type=”text” name=”title” id=”title” />
</li>
</ul>
</fieldset>
Now here is what the code looks like as a form:
Of course you will need to use a bit of CSS to make this look better. You can remove such things as the fieldset border and do a bunch of other things to it. Here is the same example with CSS added, nothing fancy. When you use UL or OL in the fieldset you will be improving the accessibility of the form in my opinion.Please give me your thoughts on this matter of using UL or OL inside a fieldset.
In preparation for my talk on Accessibility for the January, 2008, Refresh DC meeting I am looking to build a small simple accessible web application that might be useful in the end to the DC Technology Community. It will allow people to put in information about themselves and their websites, along with what areas they have skills in. This web application will be used to show how an application can be both 508 compliant, accessible, useful, and use web standards all at the same time.
I am looking for your help in putting together a list of skills people might have or need to work in technology. I know some people are designers, developers, printers, marketers, and business development so the list might be a bit broad. In the long run IÂ think it will mostly be used by people looking for designers and developers.
Below is the list I have so far and I know it is not everything. I’m not sure if it should be more of a general list or should be like “Photoshop CS”, “Photoshop CS2″, “Photoshop CS3″, etc.
Here is what I have so far.
UPDATE – I added missing items or corrected capitalization from the people listed next to them. Justin Stockton also suggested that I add Adobe, Microsoft, etc. in front of items that should have them.
I would like it to be a more general list and I figure the application I’m building could be used to either find people locally with a given skill to help with work or if you have a question that you might need further explanation on. I’m figuring the web application will only be available to retrieve information about people from those people that have signed-up and the other person wants to make their information available to others by web page or e-mail only. The application will contain a notes field so you can expand on the level of your knowledge in a given area or subject.
So please use the comments to add skills I have not listed.
Thanks, greatly in advance for your help.
I found another great meetup by using Ross Karchner‘s DC Tech Events website.
This one was the DC Adaptvie Technology meetup that was held at the DC Public Library in Washington, DC. The event was on Saturday December 1st, 2007, from 1:00 PM to 5:00 PM in room 215 at the Martin Luther King Jr. Memorial Library. The Saturday Technology Trainning sessions are usually for users of Adaptive Technology like the JAWS screenreader, the Zoomtext magnifier, and anything else that is technical and useful someone. They are usually held the first and third Saturdays of each month. No, meeting the third Saturday of December because of the holiday season. These meetings are normally run by Patrick Timony.
I was one of only a few sighted people at this meeting, which had about twelve or fifteen people. This meeting included a demonstration of the ICON accessible PDA, a braille reader, and how to use the new Mac OS (Leopard) for better accessibility given by David Poehlman.
David showed everyone how to use the ICON PDA by LevelStar. This device which is the size of an old style manual light meter allows people to use the following tools a calendar, an address book, a music player to listen to music or your favorite pod casts, allows you to take notes yourself with the voice recorder and journal, and stay on top of your world with a word processor, web browser, and email. This device has wifi/wireless and comes with a comprehensive menu of pre-installed applications , 30GB hard drive, and Bluetooth® built-in.
Next, he showed a braille reader that you plug into your computer or I even believe the ICON PDA. Finally, David demonstrated how you can have the new Mac OS be turned on to read everything out loud to you. I forget how he said you turn it on.
After David got done Jerry Marindin of Freedom Scientific showed everyone how to use the new ONYX Desktop 17 (Closed-circuit television) CCTV. This device allows people with visual issues to magnify papers, books, maps, etc. It also comes in a model that does not have a camera, but plugs into your computer instead. With the remote control that comes with it you can zoom in or out on a document, flip the camera up to point at things in the back of the room and then zoom in on them. This would be great for people at meetings or classrooms that can not see distance. It also allows you to change the color of maps for those that are color blind. You can change the color contrast so if white text on a black background works better for you then you can do that.
I mentioned to Jerry during his presentation that the image under the camera was upside down and he said “I will show you later how to fix that”. He was then able to use the remote to flip the image on the screen to be flipped the proper way that you needed it. He mentioned that when he brought this producted to a meeting a while ago that one of the blind ladies mentioned that the remote when in audible mode said to push the “RED” button. She said what if I can’t see or if I’m color blind. Jerry took that information back with him the company and they fixed that problem. Now the remote says something like “Press the red button in the upper right corner of the remote”. See what happens when you test with really people, you find out things the engineers dont’ think of.
I learned a bit more after the meeting was over by just sitting and talking with the people that were still there. I asked some questions on what type of things bothered them on the web. It seemed the items that gave them the most grief were forms. Either the form had poor instructions or ones that were to long. They wanted to have short understandable instructions of what the form was for and what type of informtion went in the fields. The other things that bothered them was not telling them that a field was in error until like ten or so fields later or at the end. The one woman said she would like to know as soon as possible when things are incorrect, so she can correct it.
When I left the meeting I asked one of the people still there if they wanted help or they wanted to follow me out to the metro, one woman said sure. I had her grab my arm and follow me out. While getting to the metro I was trying not to tell her to go right or left or whatever, I figured that she would know were to go by where I was leading. She mentioned that at times people will yell “STOP” while she’s out walking somewhere. She was like why should I stop when I don’t know who you are anyway and why should I be stopping. The one other thing she mentioned when we crossed the street was the noise that some of the new crosswalk lights make is really annoying. I asked is it because it does not allow her to hear the traffic and she said “Yes”.
Two other things that I thought was interesting was that Patrick gave out two different agenda lists. One for sighted people that had really big text and one for non-sighted people that was in braille. The other item was that both Patrick and Jerry had business cards that were normal on one side and on the other used big blocky text, one card even had braille on it.
In the end I learned a few things, met some really nice people, and it gave me something more to think about while making my web pages more accessible and 508 compliant by using web standards.
So if you get chance go check out their next meeting, I plan on being there and will post when it is after the holidays.