WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: <ul> for form layout?

for

From: Poornima
Date: Aug 9, 2017 12:21PM

  • Next message: Jim Allan: "Re: using .svg images accessibly"
  • Previous message: Sandy Feldman: "Re: using .svg images accessibly"
  • Next message in Thread: Birkir R. Gunnarsson: "Re:
      for form layout?"
    • Previous message in Thread: escetic@gmail.com: "
      Though it has one benefit of knowing the number of form fields, I would suggest NOT to use the <ul> for form fields. The cons are -

      - The screen reader keyboard shortcuts are different to interpret the "list items" and "form fields"
      - While in virtual cursor mode (using DOWN arrow key), it first announce the "list" in the beginning of form (e.g.) "list of 7 items". This can be confusing to understand the presence of form elements vs the list items which are considered to be different components by its interpretation
      - Again, nesting of <ul> may be required for the consecutive fields (e.g. Date of Birth)?

      Thanks,
      Poornima.

      -----Original Message-----
      From: <EMAIL REMOVED> [mailto: <EMAIL REMOVED> ]
      Sent: Tuesday, August 08, 2017 11:24 PM
      To: <EMAIL REMOVED>
      Subject: [WebAIM] <ul> for form layout?


      Hi All,

      It's obviously not semantic or the intended use of <ul> to use it for form layout, for example having each label and input on a form as a separate <li>. There does seem to be some precedent for it, it was a technique back in the days of using tables for layout, but it's fallen out of favour for the same reasons we moved away from tables for layouts.

      It does have the benefit of letting a screen reader user know how many inputs there are on a form, assuming a reader announces number of list items. But would most screen reader users find this to be an unexpected or confusing use of lists?

      There is also the argument that it's presenting different user experiences for visual and non-visual users.

      Can anyone offer more pros or cons, are there considerations that swing this firmly in the direction of for or against?

      Thank you!

      Rob