Front End Accessibility Development Guide

Header

  • Carefully write heading(h1,h2,h3) for screen reader.

Alternative Image

  • Provide alt text for both essential and functional images.
  • Provide empty alt text (alt=””) for decorative images.
  • Don’t repeat the alt text of an image in the adjacent text.
  • Define decorative image as CSS background images.
  • CSS be used instead of spacer images.

Labeling Form Elements

  • Must ensure the forms can be navigated and completed using keyboard.
  • Ensure “for” and “id” attributes are associated in the label and form element.
  • Use a fieldset to group several associated form elements such as checkboxes and radio buttons. Legend text should be visible and concise.
  • 1 

Use html buttons, input or button element for

  • submitting a form
  • Opening model dialogs
  • Dynamic page updates
  • 2 3