CampTix Ticket form accessibility improvements, changes to HTML structure

There are changes coming to the ticket selection table, order summary, registration form, and edit form to improve the accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) of registering for a WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more.. The changes will deployDeploy Launching code from a local development environment to the production web server, so that it's available to visitors. tomorrow, March 3rd, around 16:00 UTC.

Right now, most form fields didn’t have an “accessible name”, instead the form relies on the table layout to show which question corresponds to each input. This only works for sighted users— for anyone using a screen reader, the form fields are functionally unlabelled.

After this change, all inputs will have labels attached, so screen readers and other assistive tech will be able to connect the questions (for example, First Name) to the text input for the answer. This also changes some of the markup, which might affect your WordCamp’s style, if you have any custom CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site..

  • All ticket questions are now wrapped in a label element
  • All inputs have a unique ID (but this should not be used for styling)
  • Questions with multiple answers (radio buttons or checkboxes) now have their answers wrapped in a fieldset

The ticket selection table has also been updated so navigating through selecting a ticket is easier.

  • The quantity dropdown now uses the ticket name as the label
  • The ticket name is now wrapped in a label, instead of strong, and that table cell is now a th instead of td.

This fixes metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. ticket #1591, you can see the full changes on the GitHub PR. Please check your tickets page, especially if you’ve done any custom styling to it, and let us know in #meta-wordcamp on slackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. (or here in the comments) if you see anything unexpected.

#camptix