Re: [WSG] Accessible form test
Hi Erwin, there'd be other people on the list that could comment on the use of access keys etc i'm sure. At a stretch I'd kinda consider some aspects of the visual presentation part of the broad spectrum that is accessibility though - or at least usability. i like thisarticle that looks at the pros/cons of form layout, label positioning alignment: http://www.lukew.com/resources/articles/web_forms.html applying some of those presentation ideas would enhance the ability to quickly grasp the different parts to the form (i'm getting some mis-alignment with some of the form labels in the enquiry details part of teh form). browser cam results here: http://www.browsercam.com/public.aspx?proj_id=168943 I havent read Joe's book. does he specifically recommened the use of definition lists for layout? sounds like a decent enough idea. theres potential to go without the dl though, and use the form tag itself and the label tags as the hooks to define styles alignment. theres a bunch of examples for form layout which youve probably already seen, i often go back to Cameron Adams' article and examples: http://www.themaninblue.com/writing/perspective/2004/03/24/ but yeah - as mentioned,you're probably afterspecific feedback on the use of accesskeys etc - hopefully some of the gurus will chime in :) cheers, pete ottery On 6/10/05, Erwin Heiser [EMAIL PROTECTED] wrote: Hi all,I'm sorry for sending this againg but the link for the new form was wrong,that's what happens when you've been staring at a screen for too long... I¹m pretty new to marking up forms so I decided to ³get it right² right fromthe start.I¹ve recoded a contact form they are using on a website I¹m working on.The old form (the one currently in use) is here: http://www.pixelsandtext.be/tests/oldform.htmlThe new form is here:http://www.pixelsandtext.be/tests/newform.html Both forms validate to their respective DTD.The old one is marked-up using tables, the new one uses a definition listand a few CSS-rules for the layout. I've read Joe Clarks book building accessible websites and applied most of the stuff in the Forms chapter.(Funny thing, even when adding all the CSS rules and the accessiblityextra's to the HTML the file size is roughly the same as the old form) Would some of the WSG accessibility gurus please have a look at this form?I'd welcome any comment and/or suggestions...Thanks in advance,Erwin Heiser** The discussion list forhttp://webstandardsgroup.org/See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help**
RE: [WSG] Accessible form test
-Original Message- From: Erwin Heiser [mailto:[EMAIL PROTECTED] Sent: Friday, 10 June 2005 3:27 AM To: wsg@webstandardsgroup.org Subject: [WSG] Accessible form test Hi all, The new form is here: http://www.pixelsandtext.be/tests/newform.html I've read Joe Clarks book building accessible websites and applied most of the stuff in the Forms chapter. Hmm... Did you get the idea of using the definition lists from that book? I wonder why that was suggested? I mean, the labels and their FOR element already create a link to the form elements. And the fieldsets define a group of elements. Using Definition Lists is a bit of doubling up, in my opinion. And if you got rid of them the size of yoour HTML would reduce by quite a bit. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Accessible form test
The only purpose definition lists in forms serve is to provide some visual formatting in cases where CSS is turned off. There was some discussion on the technique at simplebits around a year or so ago, and it is basically just substituting one set of tags for another (dl, dt, dl in lieu of using p, br /, and div. It's a technique I'm not in favor of because definition lists have their own use, and specific semantic meaning. Personally, I think you should stick to using fieldsetlegends and labels -- tags specifically for use in forms. If you really want your form to hang together when there are no style sheets then use br's at the end of each line and hide them with css. The jury's out on accesskeys. The major barriers to them are: 1) There is no standard implementation across different sites 2) They are a hidden attribute of a handful of tags and it's difficult to inform your users about them 3) They may conflict with users own browser and/or assistive technology keyboard shortcuts 4) Most assistive technologies have their own form handling shortcuts. The other side of the coin - 1) when used judiciously they provide handy shortcuts to fequently used part of your web site 2) Not everybody who rely on keyboard navigation use assistive technology. If you do use accesskeys use a published guideline (e.g. in New Zealand use e-govt web guidelines) regards Terrence Wood. On 10 Jun 2005, at 11:52 AM, Peter Ottery wrote: Hi Erwin, there'd be other people on the list that could comment on the use of access keys etc i'm sure. At a stretch I'd kinda consider some aspects of the visual presentation part of the broad spectrum that is accessibility though - or at least usability. i like this article that looks at the pros/cons of form layout, label positioning alignment: http://www.lukew.com/resources/articles/web_forms.html applying some of those presentation ideas would enhance the ability to quickly grasp the different parts to the form (i'm getting some mis-alignment with some of the form labels in the enquiry details part of teh form). browser cam results here: http://www.browsercam.com/public.aspx?proj_id=168943 I havent read Joe's book. does he specifically recommened the use of definition lists for layout? sounds like a decent enough idea. theres potential to go without the dl though, and use the form tag itself and the label tags as the hooks to define styles alignment. theres a bunch of examples for form layout which youve probably already seen, i often go back to Cameron Adams' article and examples: http://www.themaninblue.com/writing/perspective/2004/03/24/ but yeah - as mentioned, you're probably after specific feedback on the use of accesskeys etc - hopefully some of the gurus will chime in :) cheers, pete ottery On 6/10/05, Erwin Heiser [EMAIL PROTECTED] wrote: Hi all, I'm sorry for sending this againg but the link for the new form was wrong, that's what happens when you've been staring at a screen for too long... I¹m pretty new to marking up forms so I decided to ³get it right² right from the start. I¹ve recoded a contact form they are using on a website I¹m working on. The old form (the one currently in use) is here: http://www.pixelsandtext.be/tests/oldform.html The new form is here: http://www.pixelsandtext.be/tests/newform.html Both forms validate to their respective DTD. The old one is marked-up using tables, the new one uses a definition list and a few CSS-rules for the layout. I've read Joe Clarks book building accessible websites and applied most of the stuff in the Forms chapter. (Funny thing, even when adding all the CSS rules and the accessiblity extra's to the HTML the file size is roughly the same as the old form) Would some of the WSG accessibility gurus please have a look at this form? I'd welcome any comment and/or suggestions... Thanks in advance, Erwin Heiser ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Accessible form test
Hi Erwin 1. i would ditch the accesskeys: see these articles for why: http://wats.ca/articles/accesskeys/19 http://wats.ca/articles/accesskeyconflicts/37 2. use javascript to clear the comments textarea on focus (if it contains the default text). 3. mark up abbreviations and acronyms abbr title=numberNr/abbr FYI here is an example read out of the form using IBM homepage reader note: using spans to style characters within words causes the word to be read out incorrectly example departure becomes de- e -parture or the read out for 'nr. persons' is (note repetition of s ) 'Nr. of person Press Alt + Shift + ss'(i think this is a bug in homepage reader) Name Press Alt + Shift + m [Text.] Surname Press Alt + Shift + s [Text.] E-mai Press Alt + Shift + ll [Text.] Comments Press Alt + Shift + o [TextArea.] Enquiry Details Arrival Date Press Alt + Shift + d (Start of select menu with 32 items.) [Collapsed.] Choose day [Selected.] (End of select menu.) (Start of select menu with 13 items.) [Collapsed.] Choose month [Selected.] (End of select menu.) (Start of select menu with 4 items.) [Collapsed.] choose year [Selected.] (End of select menu.) Departure Date Press Alt + Shift + p (Start of select menu with 32 items.) [Collapsed.] Choose day [Selected.] (End of select menu.) (Start of select menu with 13 items.) [Collapsed.] Choose month [Selected.] (End of select menu.) (Start of select menu with 4 items.) [Collapsed.] choose year [Selected.] (End of select menu.) Nights Press Alt + Shift + i [Text.] Room Press Alt + Shift + r (Start of select menu with 8 items.) [Collapsed.] Choose one [Selected.] (End of select menu.) Nr. of person Press Alt + Shift + ss [Text.] How did you hear about Read's? Press Alt + Shift + y [Text.] Additional enquiries or comments Press Alt + Shift + q [TextArea: If interested in any particular package...] [Send: Submit button.] [Clear: Reset button.] (End of form 2.) with regards Steven Faulkner Web Accessibility Consultant National Information Library Service (NILS) 454 Glenferrie Road Kooyong Victoria 3144 Phone: (613) 9864 9281 Fax: (613) 9864 9210 Email: [EMAIL PROTECTED] National Information Library Service A subsidiary of RBS.RVIB.VAF Ltd. |-+- | | Erwin Heiser | | | [EMAIL PROTECTED]| | | Sent by: | | | [EMAIL PROTECTED]| | | dsgroup.org | | | | | | | | | 10/06/2005 03:27 | | | AM| | | Please respond to | | | wsg | | | | |-+- ---| | | | To: wsg@webstandardsgroup.org | | cc: | | Subject: [WSG] Accessible form test | ---| Hi all, I'm sorry for sending this againg but the link for the new form was wrong, that's what happens when you've been staring at a screen for too long... I¹m pretty new to marking up forms so I decided to ³get it right² right from the start. I¹ve recoded a contact form they are using on a website I¹m working on. The old form (the one currently in use) is here: http://www.pixelsandtext.be/tests/oldform.html The new form is here: http://www.pixelsandtext.be/tests/newform.html Both forms validate to their respective DTD. The old one is marked-up using tables, the new one uses a definition list and a few CSS-rules for the layout. I've read Joe Clarks book building accessible websites and applied most of the stuff in the Forms chapter. (Funny thing, even when adding all the CSS rules and the accessiblity extra's to the HTML the file size is roughly the same as the old form) Would some of the WSG accessibility gurus please have a look at this form? I'd welcome any comment and/or suggestions... Thanks in advance, Erwin Heiser ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
