Site Report
This tab shows accessibility issues, indicating problems for older users, people with disabilities or accessibility needs. Automated testing cannot detect all accessibility issues, so should be used alongside human testing.
| Level | WCAG 2.1 | Section 508 - 2017 | Key |
|---|
| A |  | | Pages with level A issues are unusable for some people |
|---|
| AA |  | | Pages with level AA issues are very difficult to use |
|---|
| AAA | | |  Pages with level AAA issues can be difficult to use |
|---|
| Priority | Description and URL | Guideline and Line# | Count |
|---|
Level A
8 issues on 5 pages | |
| | All fieldset elements should be labeled with legend elements. | WCAG 2.1 A H71 Section 508 (2017) A H71 | 3 pages |
|
The first child element inside a fieldset must be a legend element, which provides a label or description for the group. legend elements in other positions may be ignored. | | |
| http://www.ravelry.com/invitations | Line 323 | |
| https://www.ravelry.com/account/login | Line 84 93 102 | |
| https://www.ravelry.com/account/login?return_to=/designers/tania-richter | Line 96 105 114 | |
| | All onmouseout handlers should have an equivalent onblur handler. | WCAG 2.1 A F54 Section 508 (2017) A F54 | 1 pages |
|
Some users are unable to use a mouse, so use the keyboard instead. Add an equivalent keyboard event handler to help these users. | | |
| http://www.ravelry.com/designers/tania-richter | Line 252 | |
| | All onmouseover handlers should have an equivalent onfocus handler. | WCAG 2.1 A F54 Section 508 (2017) A F54 | 1 pages |
|
Some users are unable to use a mouse, so use the keyboard instead. Add an equivalent keyboard event handler to help these users. | | |
| http://www.ravelry.com/designers/tania-richter | Line 252 | |
| | Duplicate id - the same ID is used on more than one element. | HTML5 WCAG 2.1 A 4.1.1 Section 508 (2017) A 4.1.1 | 1 pages |
|
| | |
| id=stores_show_tab id=stores_show_tab id=sort id=sort id=hopper_1
http://www.ravelry.com/designers/tania-richter | Line 362 369 446 481 517
...
| |
| | Each a element must contain text or an img with an alt attribute. | WCAG 2.1 A F89 Section 508 (2017) A F89 | 3 pages |
|
A link name allows screen readers to voice what the links does. If there is no link text or the `alt` text is blank, screen readers have nothing to read, so read out the URL instead. To add a name do one of the following:
- Add text between the
a element start and end tags
- Add an
aria-label attribute
- Add an
aria-labelledby attribute
- Add an
img alt attribute if the link contains an img element
| | |
| http://www.ravelry.com/carts | Line 91 | |
| http://www.ravelry.com/designers/tania-richter | Line 86 329 358 381 407
...
| |
| http://www.ravelry.com/invitations | Line 94 | |
| | HTML form control has no accessible name. | WCAG 2.1 A F68 Section 508 (2017) A F68 | 1 pages |
|
A label (or name) linked to the control allows screen readers to voice the label correctly when reading the control. To add a label do one of the following:
- Use a
label element with the for attribute set to the ID of the form control
- Wrap a
label element around the form control
- Add a
title attribute
- Add an
aria-label attribute
- Add an
aria-labelledby attribute
| | |
| http://www.ravelry.com/designers/tania-richter | Line 269 289 308 1681 | |
|
Data tables allow screen reader users to understand column and row relationships.
Layout tables read cells as a series of unrelated paragraphs with no tabular structure.
Without th or role, screen readers apply heuristics to decide whether a table is a layout table or data table.
These heuristics vary greatly between screen readers, and are affected by browser being used, window size,
and font size (so the outcome is very unpredictable without th or role).
If a data table has headers marked up using td, then change these to th.
If a data table has no headers, add th elements describing each row and/or column.
If the table is only used for layout add role=presentation to the table element. Impact on users: - JAWS Reading: Treats tables without
th and role as layout tables if the table contains cells above or below certain pixel sizes. This measurement is affected by browser window size, browser font size, and the browser used. - NVDA Reading: Applies a layout table heuristic to tables without
th and role which varies depending on the browser used and on the window size in some circumstances. - VoiceOver Reading: Uses a sophisticated heuristic on tables without
th and role, which is similar (but not identical) to the heuristic used by NVDA with Firefox.
| | |
| http://www.ravelry.com/designers/tania-richter | Line 299 1672 | |
| | img elements must have an accessible name. | WCAG 2.1 A F65 Section 508 (2017) A F65 | 5 pages |
|
Add an alt attribute describing the image, which screen readers voice instead of the image.
Spacer images and purely decorative images should use alt="".
Do not use alt text containing only spaces since that's voiced as an unlabeled image. Impact on users: - NVDA 2019.2 Chrome 79 Windows 10 Reading: Image unlabeled.
- NVDA 2019.2 FF68 Windows 10 Reading: Image ignored.
- NVDA 2019.2 IE11 Windows 10 Reading: Image ignored.
- NVDA 2018.4 Chrome 73 Windows 10 Reading: Image ignored.
- NVDA 2018.4 FF60 Windows 10 Reading: Image ignored.
- NVDA 2018.4 IE11 Windows 10 Reading: Image ignored.
- JAWS 2019.1912.1 Chrome 79 Windows 10 Reading: Image unlabeled.
- JAWS 2019.1912.1 FF68 Windows 10 Reading: Image ignored.
- JAWS 2019.1912.1 IE11 Windows 10 Reading: Image ignored.
- JAWS 2018.1811.2 Chrome 73 Windows 10 Reading: Image ignored.
- JAWS 2018.1811.2 FF60 Windows 10 Reading: Image ignored.
- JAWS 2018.1811.2 IE11 Windows 10 Reading: Image ignored.
- VoiceOver macOS 10.14 Safari 13.0 macOS 10.14.6 Reading: Image filename read out.
- VoiceOver macOS 10.13 Safari 12.1 macOS 10.13.6 Reading: Image filename read out.
- VoiceOver macOS 10.12 Safari 10.1.2 macOS 10.12.6 Reading: Image filename read out.
- VoiceOver iOS 12.4 Safari iOS 12.4 iOS 12.4.1 Touch: Image filename read out.
- VoiceOver iOS 11.4 Safari iOS 11.4 iOS 11.4.1 Touch: Image filename read out.
- VoiceOver iOS 10.3 Safari iOS 10.3 iOS 10.3 Touch: Image filename read out.
| | |
| http://www.ravelry.com/designers/tania-richter | Line 87 88 89 92 121
...
| |
| http://www.ravelry.com/invitations | Line 96 98 100 105 178
...
| |
| https://www.ravelry.com/account/login | Line 61 | |
| https://www.ravelry.com/account/login?return_to=/designers/tania-richter | Line 73 | |
| This issue was found on another 1 pages.
The trial version is limited to showing issues on 4 pages.
| | |
Level AA
2 issues on 3 pages | |
| | Headings should not be empty. | WCAG 2.1 AA G130 Section 508 (2017) AA G130 | 1 pages |
|
Add text to the heading, or alt text if the heading contains an image. Screen readers read out page headings, allowing users to quickly skip to a section, but some older screen readers do not ignore empty headings. | | |
| http://www.ravelry.com/carts | Line 288 | |
| | If you set any of the colors on the body or a elements you must set all of them. | WCAG 2.1 AA F24 Section 508 (2017) AA F24 | 2 pages |
|
In HTML the color attributes are text, bgcolor, link, alink and vlink.
In CSS the attributes are color and background-color.
Some users have browser defaults set to white text on a black background, so setting
one color without setting the others can result in black text on a black background. | | |
| The colors used are:
color: rgb(0,0,0) and
background: rgb(255,255,255) from browser settings
https://www.ravelry.com/account/login | Line 120 | |
| The colors used are:
color: rgb(0,0,0) and
background: rgb(255,255,255) from browser settings
https://www.ravelry.com/account/login?return_to=/designers/tania-richter | Line 132 | |
| Expand all 10 issues | | |