aboutsummaryrefslogtreecommitdiffstats
path: root/vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md
diff options
context:
space:
mode:
authorMario Vavti <mario@mariovavti.com>2020-08-22 19:40:57 +0200
committerMario Vavti <mario@mariovavti.com>2020-08-22 19:40:57 +0200
commita9e19cb89ed08689dc58c92b3d5491318a703f0e (patch)
tree468e236e5cb4927a4fd01f650fab7ad9f6cfc895 /vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md
parent48786119871aaf1029fac12a37d212afddafc757 (diff)
downloadvolse-hubzilla-a9e19cb89ed08689dc58c92b3d5491318a703f0e.tar.gz
volse-hubzilla-a9e19cb89ed08689dc58c92b3d5491318a703f0e.tar.bz2
volse-hubzilla-a9e19cb89ed08689dc58c92b3d5491318a703f0e.zip
composer update bootstrap
Diffstat (limited to 'vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md')
-rw-r--r--vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md13
1 files changed, 11 insertions, 2 deletions
diff --git a/vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md b/vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md
index cdbfa794a..606bf4b75 100644
--- a/vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md
+++ b/vendor/twbs/bootstrap/site/docs/4.5/components/input-group.md
@@ -370,6 +370,15 @@ Input groups include support for custom selects and custom file inputs. Browser
## Accessibility
-Screen readers will have trouble with your forms if you don't include a label for every input. For these input groups, ensure that any additional label or functionality is conveyed to assistive technologies.
+Ensure that all form controls have an appropriate accessible name so that their purpose can be conveyed to users of assistive technologies. The simplest way to achieve this is to use a `<label>` element, or—in the case of buttons—to include sufficiently descriptive text as part of the `<button>...</button>` content.
-The exact technique to be used (`<label>` elements hidden using the `.sr-only` class, or use of the `aria-label` and `aria-labelledby` attributes, possibly in combination with `aria-describedby`) and what additional information will need to be conveyed will vary depending on the exact type of interface widget you're implementing. The examples in this section provide a few suggested, case-specific approaches.
+For situations where it's not possible to include a visible `<label>` or appropriate text content, there are alternative ways of still providing an accessible name, such as:
+
+- `<label>` elements hidden using the `.visually-hidden` class
+- Pointing to an existing element that can act as a label using `aria-labelledby`
+- Providing a `title` attribute
+- Explicitly setting the accessible name on an element using `aria-label`
+
+If none of these are present, assistive technologies may resort to using the `placeholder` attribute as a fallback for the accessible name on `<input>` and `<textarea>` elements. The examples in this section provide a few suggested, case-specific approaches.
+
+While using visually hidden content (`.sr-only`, `aria-label`, and even `placeholder` content, which disappears once a form field has content) will benefit assistive technology users, a lack of visible label text may still be problematic for certain users. Some form of visible label is generally the best approach, both for accessibility and usability.