Improve wagtailforms accessibility guidance (#6740)

pull/6759/head
Thibaud Colas 2021-01-29 19:45:48 +00:00 zatwierdzone przez GitHub
rodzic cb29fbba65
commit 30b90a0f65
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 4AEE18F83AFDEB23
1 zmienionych plików z 5 dodań i 4 usunięć

Wyświetl plik

@ -116,15 +116,16 @@ Additionally, you can hide empty heading blocks with CSS:
Forms
-----
The ``wagtailforms`` :ref:`form_builder` uses Djangos forms API, but make sure to go beyond Djangos default forms rendering:
The ``wagtailforms`` :ref:`form_builder` uses Djangos 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 Djangos 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.
----