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
13 issues on 4 pages | |
| Do not provide a summary attribute or caption for layout tables. | WCAG 2.1 A F46 Section 508 (2017) A F46 | 3 pages |
|
Remove summary and caption if this is a layout table. | | |
| https://shabab-libya-top.yoo7.com/ | Line 2427 | |
| https://shabab-libya-top.yoo7.com/login | Line 1026 | |
| https://shabab-libya-top.yoo7.com/register | Line 1055 | |
| Each a element must contain text or an img with an alt attribute. | WCAG 2.1 A F89 Section 508 (2017) A F89 | 2 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
| | |
| https://shabab-libya-top.yoo7.com/ | Line 2657 2657 2657 3256 3271 | |
| https://shabab-libya-top.yoo7.com/portal | Line 1416 | |
| For data tables that have two or more logical levels of row or column headers, use markup
to associate data cells and header cells. | WCAG 2.1 A 1.3.1 Section 508 (2017) A 1.3.1 | 1 pages |
|
Include id attributes in th cells and headers attributes in the associated td cells,
or include scope attributes in th cells. | | |
| https://shabab-libya-top.yoo7.com/ | Line 1774 1809 | |
| HTML form control has no label. | WCAG 2.1 A F68 Section 508 (2017) A F68 | 3 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
| | |
| https://shabab-libya-top.yoo7.com/ | Line 3359 3362 3370 5290 5293
...
| |
| https://shabab-libya-top.yoo7.com/login | Line 1096 1105 1111 | |
| https://shabab-libya-top.yoo7.com/portal | Line 572 | |
|
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.
| | |
| https://shabab-libya-top.yoo7.com/ | Line 1747 1778 1794 2457 2485
...
| |
| https://shabab-libya-top.yoo7.com/login | Line 276 292 319 328 340
...
| |
| https://shabab-libya-top.yoo7.com/portal | Line 435 476 479 497 519
...
| |
| https://shabab-libya-top.yoo7.com/register | Line 305 321 348 357 369
...
| |
| iframe and frame elements must have a title attribute. | WCAG 2.1 A 2.4.1 Section 508 (2017) A 2.4.1 | 2 pages |
|
Add a title attribute or ARIA label to each iframe and frame element (e.g. title='Main Content' ). Without a title some screen readers read out the frame filename, which is usually meaningless. Impact on users: - VoiceOver macOS 10.14 Safari 13.0 macOS 10.14.6 Reading: Meaningless frame title read out.
- VoiceOver macOS 10.13 Safari 12.1 macOS 10.13.6 Reading: Meaningless frame title read out.
- VoiceOver macOS 10.12 Safari 10.1.2 macOS 10.12.6 Reading: Meaningless frame title read out.
- VoiceOver macOS 10.11 Safari 9.1.2 macOS 10.11.6 Reading: Meaningless frame title like 'frame zero' read out.
| | |
| https://shabab-libya-top.yoo7.com/ | Line 2469 | |
| https://shabab-libya-top.yoo7.com/portal | Line 540 | |
| img elements must have an accessible name. | WCAG 2.1 A F65 Section 508 (2017) A F65 | 2 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.
| | |
| https://shabab-libya-top.yoo7.com/ | Line 2661 2664 2794 2797 2800
...
| |
| https://shabab-libya-top.yoo7.com/portal | Line 2093 2097 | |
| Scrolling marquee text is very hard to read for low vision users. | WCAG 2.1 A F16 Section 508 (2017) A F16 | 4 pages |
|
Replace the marquee element with a static element like span . This allows low vision users time to read the text. | | |
| https://shabab-libya-top.yoo7.com/ | Line 2453 | |
| https://shabab-libya-top.yoo7.com/login | Line 1058 | |
| https://shabab-libya-top.yoo7.com/portal | Line 531 | |
| https://shabab-libya-top.yoo7.com/register | Line 1087 | |
| The lang attribute specifies a language written right-to-left, so dir=rtl is needed to change the text layout direction. | WCAG 2.1 A 1.3.2 Section 508 (2017) A 1.3.2 | 2 pages |
|
Add dir="rtl" next to the lang attribute. | | |
| https://shabab-libya-top.yoo7.com/ | Line 14 | |
| https://shabab-libya-top.yoo7.com/portal | Line 12 | |
| This page has duplicate IDs which cause problems in screen readers. | WCAG 2.1 A F77 Section 508 (2017) A F77 | 1 pages |
|
Two or more elements on this page share the same ID, which cause problems in screen readers which use IDs for labeling controls and table headings.
This also causes problems in JavaScript methods like getElementById and querySelector , which behave inconsistently when duplicate IDs are present.
Change the ID so it is unique for each element. | | |
| https://shabab-libya-top.yoo7.com/ | Line 5792 | |
| This page has markup errors, causing screen readers to miss content. | WCAG 2.1 A F70 Section 508 (2017) A F70 | 4 pages |
|
Fix the errors listed on the Standards tab of this report. Markup errors like missing end tags mean screen readers may skip important content. | | |
| https://shabab-libya-top.yoo7.com/ | Line 3 | |
| https://shabab-libya-top.yoo7.com/login | Line 337 | |
| https://shabab-libya-top.yoo7.com/portal | Line 452 999 1474 2460 2497
...
| |
| https://shabab-libya-top.yoo7.com/register | Line 366 | |
| This page uses nested tables, which do not make sense when read in a screen reader. | WCAG 2.1 A F49 Section 508 (2017) A F49 | 4 pages |
|
Add role='presentation' if the inner table is a layout table, otherwise modify the inner table to present the same data without nesting tables. | | |
| https://shabab-libya-top.yoo7.com/ | Line 1778 1794 1809 2457 2485
...
| |
| https://shabab-libya-top.yoo7.com/login | Line 276 292 314 319 328
...
| |
| https://shabab-libya-top.yoo7.com/portal | Line 479 497 519 552 558
...
| |
| https://shabab-libya-top.yoo7.com/register | Line 305 321 343 348 357
...
| |
| Use semantic markup like strong instead of using the CSS font-weight property. | WCAG 2.1 A F2 Section 508 (2017) A F2 | 1 pages |
|
Use the strong element instead of the span element for bold text. | | |
| https://shabab-libya-top.yoo7.com/ | Line 5479 5501 5523 5545 5567
...
| |
Level AA
4 issues on 4 pages | |
| Ensure that text and background colors have enough contrast. | WCAG 2.1 AA 1.4.3 Section 508 (2017) AA 1.4.3 | 1 pages |
|
Some users find it hard to read light gray text on a white background, dark gray text on a black background and white text on a red background.
- The contrast ratio should be 3.0 or more for 18 point text, or larger
- The contrast ratio should be 3.0 or more for 14 point bold text, or larger
- The contrast ratio should be 4.5 or more for all other text
| | |
| The text color to background color contrast ratio is: 2.56 with
color: rgb(255,255,255); background-color: rgb(0,170,255); font-size: 11.25pt; font-weight: 400; 4.00 with
color: rgb(255,0,0); background-color: rgb(255,255,255); font-size: 12pt; font-weight: 400; 4.00 with
color: rgb(255,0,0); background-color: rgb(255,255,255); font-size: 12pt; font-weight: 400; 4.00 with
color: rgb(255,0,0); background-color: rgb(255,255,255); font-size: 12pt; font-weight: 400; 4.00 with
color: rgb(255,0,0); background-color: rgb(255,255,255); font-size: 12pt; font-weight: 400; https://shabab-libya-top.yoo7.com/ | Line 3470 3625 4858 4926 5735
...
| |
| Headings should not be empty. | WCAG 2.1 AA G130 Section 508 (2017) AA G130 | 2 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. | | |
| https://shabab-libya-top.yoo7.com/ | Line 1785 | |
| https://shabab-libya-top.yoo7.com/portal | Line 487 | |
| 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 | 4 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. High contrast mode on Windows turns off background images so you must set a `background-color` in addition to a `background-image`. | | |
| The colors used are:
color: #000000; uses browser default
background-color: #d7d7d7; uses browser default
color: rgb(153,50,204); background-color: rgb(255,255,255); uses browser default
color: rgb(255,0,0); background-color: rgb(255,255,255); uses browser default
color: rgb(255,0,0); background-color: rgb(255,255,255); uses browser default
color: rgb(255,0,0); background-color: rgb(255,255,255); uses browser default https://shabab-libya-top.yoo7.com/ | Line 1745 2881 3470 4858 4926
...
| |
| The colors used are:
color: #000000; background-color: #d7d7d7; https://shabab-libya-top.yoo7.com/login | Line 270 | |
| The colors used are:
color: #000000; background-color: #d7d7d7; https://shabab-libya-top.yoo7.com/portal | Line 433 | |
| The colors used are:
color: #000000; background-color: #d7d7d7; https://shabab-libya-top.yoo7.com/register | Line 299 | |
| The CSS outline or border style on this element makes it difficult or impossible to see the dotted link focus outline. | WCAG 2.1 AA F78 Section 508 (2017) AA F78 | 1 pages |
|
Change the style to avoid obscuring the focus outline around focusable elements.
Using a border or outline style that obscures the focus ring causes problems for keyboard-only users in:
- Chrome (obscures the focus indicator on links, buttons, dropdowns and range controls)
- Firefox (obscures the focus indicator on links)
- Internet Explorer (obscures the focus indicator on links, buttons and range controls)
Internet Explorer does not support the `outline-offset:` property, so using this does not reliably avoid focus outline overlap. | | |
| https://shabab-libya-top.yoo7.com/ | Line 5468 5490 5512 5534 5556
...
| |
| Expand all 17 issues | | |