kopia lustrzana https://github.com/wagtail/wagtail
Improve wagtailforms accessibility guidance (#6740)
rodzic
cb29fbba65
commit
30b90a0f65
|
@ -116,15 +116,16 @@ Additionally, you can hide empty heading blocks with CSS:
|
|||
Forms
|
||||
-----
|
||||
|
||||
The ``wagtailforms`` :ref:`form_builder` uses Django’s forms API, but make sure to go beyond Django’s default forms rendering:
|
||||
The ``wagtailforms`` :ref:`form_builder` uses Django’s forms API. Here are considerations specific to forms in templates:
|
||||
|
||||
- Avoid rendering helpers such as ``as_table``, ``as_ul``, ``as_p``, which can make forms harder to navigate for screen reader users or cause HTML validation issues (see Django ticket `#32339 <https://code.djangoproject.com/ticket/32339>`_).
|
||||
- Make sure to visually distinguish required and optional fields.
|
||||
- If relevant, for larger forms take the time to group related fields together in ``fieldset``, with an appropriate ``legend``.
|
||||
- Take the time to group related fields together in ``fieldset``, with an appropriate ``legend``, in particular for radios and checkboxes (see Django ticket `#32338 <https://code.djangoproject.com/ticket/32338>`_).
|
||||
- If relevant, use the appropriate ``autocomplete`` and ``autocapitalize`` attributes.
|
||||
- Make sure to display an example value, or the expected format, for fields that accept arbitrary values but have validation – like Date and Date/Time (see Django ticket `#32340 <https://code.djangoproject.com/ticket/32340>`_).
|
||||
- For Date and Datetime fields, make sure to display the expected format or an example value (see Django ticket `#32340 <https://code.djangoproject.com/ticket/32340>`_). Or use `input type="date" <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date>`_.
|
||||
- For Number fields, consider whether ``input type="number"`` really is appropriate, or whether there may be `better alternatives such as inputmode <https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-design-system-team-changed-the-input-type-for-numbers/>`_.
|
||||
|
||||
There are further issues with Django’s built-in forms rendering (such as `#32338 <https://code.djangoproject.com/ticket/32338>`_) – make sure to test your forms’ implementation and review `official W3C guidance on accessible forms development <https://www.w3.org/WAI/tutorials/forms/>`_ for further information.
|
||||
Make sure to test your forms’ implementation with assistive technologies, and review `official W3C guidance on accessible forms development <https://www.w3.org/WAI/tutorials/forms/>`_ for further information.
|
||||
|
||||
----
|
||||
|
||||
|
|
Ładowanie…
Reference in New Issue