Accessibility Scan Report

Title: Preserve Chunk 2 Issue: #140 Date: 3/13/2026, 4:36:52 PM Duration: 25.5m URLs: 77 / 77

Summary

Issues

  • By Level: A (1486), AA (552), AAA (75)
  • By Version (A & AA): WCAG 2.0 (1561), WCAG 2.1 (0), WCAG 2.2 (477)
  • By Category: axe-strict (1259), Best Practice (141), Other unique errors (13475)
  • Total: 14875 across 79 unique rules and 5 accessibility engines

By Severity

Critical
Serious
Moderate
Minor

By Role

UX Designer
Visual Designer
Content Author
Front-End Developer

Issues

🎯 Pages with Most Errors

Focus your efforts on these pages to make the biggest impact. Click any error count to filter the rule list below.

Page axe UniqueALFA UniqueEqual Access UniqueAccessLint UniqueQualWeb Unique Total Unique
View Page Summer Collection – Preserve 357
View Page Preserve Toothbrush in Lightweight Pouch | Single 352
View Page Preserve Toothbrush in Lightweight Pouch | 6-pack 328
View Page Preserve Toothbrush in Lightweight Pouch | Single 310
View Page Preserve Toothbrush in Lightweight Pouch | Single 307
View Page Medium Compostable Plate | 24 Count – Preserve 300
View Page Preserve Colander | Small 300
View Page Preserve Everyday Tableware Set | Pack for 4 295
View Page Preserve Shave 5 Razor System | Handle & 1 Blade 295
View Page Preserve Kids Toothbrush | Single 295

🔧 Most Common Issues (ALFA)

18 rules
970 Moderate alfa SIA-R86: Page has a mechanism to bypass repeated blocks of content
68 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The element is marked as decorative but is exposed
Mode: light
<div class="PwzrButtonBase-root-245 PwzrButton-root-216 PwzrButton-text-218 rio-swatch-border-double-7981204b-2158-4273-b178-848afc7659b0" tabindex="0" role="none" aria-disabled="false" data-option-value="Bright Poppy Red" style="position: relative; background-color: rgb(253, 52, 29); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);">...</div>
XPath: /div[@class="PwzrButtonBase-root-245 PwzrButton-root-216 PwzrButton-text-218 rio-swatch-border-double-7981204b-2158-4273-b178-848afc7659b0"]
Example 2 View on Page
The element is marked as decorative but is exposed
Mode: light
<div class="PwzrButtonBase-root-277 PwzrButton-root-248 PwzrButton-text-250 rio-swatch-border-double-eaa8ab42-014a-4515-b6b3-77d2a2c0f617" tabindex="0" role="none" aria-disabled="false" data-option-value="Navy" style="position: relative; background-color: rgb(15, 55, 126); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);">...</div>
XPath: /div[@class="PwzrButtonBase-root-277 PwzrButton-root-248 PwzrButton-text-250 rio-swatch-border-double-eaa8ab42-014a-4515-b6b3-77d2a2c0f617"]
Example 3 View on Page
The element is marked as decorative but is exposed
Mode: light
<div class="PwzrButtonBase-root-309 PwzrButton-root-280 PwzrButton-text-282 rio-swatch-border-double-de22b4f2-43d0-4566-8309-b9f0cd5b55dc" tabindex="0" role="none" aria-disabled="false" data-option-value="Key Lime" style="position: relative; background-color: rgb(232, 247, 86); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);">...</div>
XPath: /div[@class="PwzrButtonBase-root-309 PwzrButton-root-280 PwzrButton-text-282 rio-swatch-border-double-de22b4f2-43d0-4566-8309-b9f0cd5b55dc"]
Example 4 View on Page
The element is marked as decorative but is exposed
Mode: light
<div class="PwzrButtonBase-root-341 PwzrButton-root-312 PwzrButton-text-314 rio-swatch-border-double-e3e92ee7-81f9-4b6f-b698-c7f4d957c69f" tabindex="0" role="none" aria-disabled="false" data-option-value="Sunshine" style="position: relative; background-color: rgb(248, 231, 28); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);">...</div>
XPath: /div[@class="PwzrButtonBase-root-341 PwzrButton-root-312 PwzrButton-text-314 rio-swatch-border-double-e3e92ee7-81f9-4b6f-b698-c7f4d957c69f"]
Example 5 View on Page
The element is marked as decorative but is exposed
Mode: light
<div class="PwzrButtonBase-root-373 PwzrButton-root-344 PwzrButton-text-346 rio-swatch-border-double-a6633040-3219-4095-8179-06d3b9d996c4" tabindex="0" role="none" aria-disabled="false" data-option-value="Coral" style="position: relative; background-color: rgb(250, 202, 196); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);">...</div>
XPath: /div[@class="PwzrButtonBase-root-373 PwzrButton-root-344 PwzrButton-text-346 rio-swatch-border-double-a6633040-3219-4095-8179-06d3b9d996c4"]
477 Serious alfa SC 2.5.8 AA SIA-R111: Interactive elements have a sufficient target size
75 pages affected

Rule Information

Engine: alfa

Roles: UX Designer, Visual Designer

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 2.5.8 AA

Affected Pages

Examples

Example 1 View on Page
Target has insufficient size
Mode: light
<a href="/account">...</a>
XPath: /a
Example 2 View on Page
Target has insufficient size
Mode: light
<a href="/collections" class="nav-link">Shop</a>
XPath: /a[@class="nav-link"]
Example 3 View on Page
Target has insufficient size
Mode: light
<a href="/cart" class="CartToggle">...</a>
XPath: /a[@class="CartToggle"]
Example 4 View on Page
Target has insufficient size
Mode: light
<a href="/account">...</a>
XPath: /a
Example 5 View on Page
Target has insufficient size
Mode: light
<a href="/collections" class="nav-link">Shop</a>
XPath: /a[@class="nav-link"]
151 Critical alfa SC 4.1.2 A SIA-R11: Button elements have an accessible name
75 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer, Content Author

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 4.1.2 A

Affected Pages

Examples

Example 1 View on Page
The link does not have an accessible name
Mode: light
<a href="/account">...</a>
XPath: /a
Example 2 View on Page
The link does not have an accessible name
Mode: light
<a href="/cart" class="CartToggle header-cart" />
XPath: /a[@class="CartToggle header-cart"]
Example 3 View on Page
The link does not have an accessible name
Mode: light
<a href="/account">...</a>
XPath: /a
Example 4 View on Page
The link does not have an accessible name
Mode: light
<a href="/cart" class="CartToggle header-cart" />
XPath: /a[@class="CartToggle header-cart"]
Example 5 View on Page
The link does not have an accessible name
Mode: light
<a href="/account">...</a>
XPath: /a
141 Moderate alfa Best Practice SIA-R53: Headings follow a logical hierarchy
75 pages affected

Rule Information

Engine: alfa

Roles: Content Author, UX Designer

Blocking: No

WCAG: Best Practice

Affected Pages

Examples

Example 1 View on Page
The heading skips one or more levels
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: /h5[@class="uppercase"]
Example 2 View on Page
The heading skips one or more levels
Mode: light
<h3 class="home__subtitle">Related</h3>
XPath: /h3[@class="home__subtitle"]
Example 3 View on Page
The heading skips one or more levels
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: /h5[@class="uppercase"]
Example 4 View on Page
The heading skips one or more levels
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: /h5[@class="uppercase"]
Example 5 View on Page
The heading skips one or more levels
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: /h5[@class="uppercase"]
137 Critical alfa SC 1.3.1, SC 4.1.2 A SIA-R8: Form elements have accessible labels
75 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer, UX Designer

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 1.3.1, SC 4.1.2 A

Affected Pages

Examples

Example 1 View on Page
The form field does not have an accessible name
Mode: light
<input class="search-bar" type="search" name="q" />
XPath: /input[@class="search-bar"]
Example 2 View on Page
The form field does not have an accessible name
Mode: light
<input class="search-bar" type="search" name="q" />
XPath: /input[@class="search-bar"]
Example 3 View on Page
The form field does not have an accessible name
Mode: light
<div class="slick-track" style="opacity: 1; width: 4422px; transform: translate3d(-737px, 0px, 0px);" role="listbox">...</div>
XPath: /div[@class="slick-track"]
Example 4 View on Page
The form field does not have an accessible name
Mode: light
<input class="search-bar" type="search" name="q" />
XPath: /input[@class="search-bar"]
Example 5 View on Page
The form field does not have an accessible name
Mode: light
<input class="search-bar" type="search" name="q" />
XPath: /input[@class="search-bar"]
85 Serious alfa SC 3.1.1 A SIA-R2: HTML elements have a valid lang attribute
75 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

WCAG: SC 3.1.1 A

Affected Pages

Examples

Example 1 View on Page
The image does not have an accessible name
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645" />
XPath: /img
Example 2 View on Page
The image does not have an accessible name
Mode: light
<img srcset="https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/180x/ 180w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/360x/ 360w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/720x/ 720w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/900x/ 900w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/1080x/ 1080w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/1200x/ 1200w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/1920x/ 1920w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/2048x/ 2048w" sizes="100vw" src="https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/" class="shogun-image " decoding="async" loading="eager" draggable="false" />
XPath: /img[@class="shogun-image "]
Example 3 View on Page
The image does not have an accessible name
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645" />
XPath: /img
Example 4 View on Page
The image does not have an accessible name
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645" />
XPath: /img
Example 5 View on Page
The image does not have an accessible name
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645" />
XPath: /img
82 Moderate alfa SIA-R68: Accessible name contains the visible label text
62 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The element owns no elements as required by its semantic role
Mode: light
<ul class="tabs product-tabs-title"> </ul>
XPath: /ul[@class="tabs product-tabs-title"]
Example 2 View on Page
The element owns no elements as required by its semantic role
Mode: light
<fieldset class="bsub-widget" role="radiogroup" data-bsub-widget="">...</fieldset>
XPath: /fieldset[@class="bsub-widget"]
Example 3 View on Page
The element owns no elements as required by its semantic role
Mode: light
<ul class="tabs product-tabs-title"> </ul>
XPath: /ul[@class="tabs product-tabs-title"]
Example 4 View on Page
The element owns no elements as required by its semantic role
Mode: light
<ul class="tabs product-tabs-title"> </ul>
XPath: /ul[@class="tabs product-tabs-title"]
Example 5 View on Page
The element owns no elements as required by its semantic role
Mode: light
<ul class="tabs product-tabs-title"> </ul>
XPath: /ul[@class="tabs product-tabs-title"]
75 Serious alfa SC 2.4.4, SC 4.1.2 A SIA-R12: Links have an accessible name
75 pages affected

Rule Information

Engine: alfa

Roles: Content Author, UX Designer

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 2.4.4, SC 4.1.2 A

Affected Pages

Examples

Example 1 View on Page
The button does not have an accessible name
Mode: light
<button type="submit" class="btn search-btn" />
XPath: /button[@class="btn search-btn"]
Example 2 View on Page
The button does not have an accessible name
Mode: light
<button type="submit" class="btn search-btn" />
XPath: /button[@class="btn search-btn"]
Example 3 View on Page
The button does not have an accessible name
Mode: light
<button type="submit" class="btn search-btn" />
XPath: /button[@class="btn search-btn"]
Example 4 View on Page
The button does not have an accessible name
Mode: light
<button type="submit" class="btn search-btn" />
XPath: /button[@class="btn search-btn"]
Example 5 View on Page
The button does not have an accessible name
Mode: light
<button type="submit" class="btn search-btn" />
XPath: /button[@class="btn search-btn"]
75 Serious alfa SC 2.4.2 A SIA-R4: Page has a descriptive title
75 pages affected

Rule Information

Engine: alfa

Roles: Content Author, UX Designer

Blocking: No

WCAG: SC 2.4.2 A

Affected Pages

Examples

Example 1 View on Page
The `lang` attribute is either missing, empty, or only whitespace
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-i4-active wf-opensans-i7-active wf-opensans-n4-active wf-opensans-n7-active wf-active" style="">...</html>
XPath: /html[@class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-i4-active wf-opensans-i7-active wf-opensans-n4-active wf-opensans-n7-active wf-active"]
Example 2 View on Page
The `lang` attribute is either missing, empty, or only whitespace
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-n4-active wf-opensans-n7-active wf-opensans-i7-active wf-opensans-i4-active wf-active" style="">...</html>
XPath: /html[@class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-n4-active wf-opensans-n7-active wf-opensans-i7-active wf-opensans-i4-active wf-active"]
Example 3 View on Page
The `lang` attribute is either missing, empty, or only whitespace
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-n4-active wf-opensans-n7-active wf-opensans-i4-active wf-opensans-i7-active wf-active" style="">...</html>
XPath: /html[@class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-n4-active wf-opensans-n7-active wf-opensans-i4-active wf-opensans-i7-active wf-active"]
Example 4 View on Page
The `lang` attribute is either missing, empty, or only whitespace
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-i7-active wf-opensans-i4-active wf-opensans-n4-active wf-opensans-n7-active wf-active" style="">...</html>
XPath: /html[@class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-i7-active wf-opensans-i4-active wf-opensans-n4-active wf-opensans-n7-active wf-active"]
Example 5 View on Page
The `lang` attribute is either missing, empty, or only whitespace
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-i4-active wf-opensans-n7-active wf-opensans-i7-active wf-oswald-n4-active wf-active" style="">...</html>
XPath: /html[@class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-i4-active wf-opensans-n7-active wf-opensans-i7-active wf-oswald-n4-active wf-active"]
75 Moderate alfa SC 1.4.6 AAA SIA-R66: Text has enhanced contrast with its background
75 pages affected

Rule Information

Engine: alfa

Roles: Visual Designer

Blocking: No

WCAG: SC 1.4.6 AAA

Affected Pages

Examples

Example 1 View on Page
The highest possible contrast of the text is 4.55:1 which is below the required contrast of 7:1
Mode: light
Example 2 View on Page
The highest possible contrast of the text is 4.55:1 which is below the required contrast of 7:1
Mode: light
Example 3 View on Page
The highest possible contrast of the text is 4.55:1 which is below the required contrast of 7:1
Mode: light
Example 4 View on Page
The highest possible contrast of the text is 4.55:1 which is below the required contrast of 7:1
Mode: light
Example 5 View on Page
The highest possible contrast of the text is 4.55:1 which is below the required contrast of 7:1
Mode: light
72 Moderate alfa SIA-R72:
71 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The text of the paragraph is uppercased
Mode: light
<p class="h6 name_wrapper"> Shave 5 Razor System | Handle & 1 Blade ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 2 View on Page
The text of the paragraph is uppercased
Mode: light
<p class="h6 name_wrapper"> Sandwich Food Storage Container | Set of ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 3 View on Page
The text of the paragraph is uppercased
Mode: light
<p class="h6 name_wrapper"> Shave 5 Razor System | Handle & 1 Blade ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 4 View on Page
The text of the paragraph is uppercased
Mode: light
<p class="h6 name_wrapper"> Everyday Tableware Set | Pack for 4 ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 5 View on Page
The text of the paragraph is uppercased
Mode: light
<p class="h6 name_wrapper"> Toothbrush in Lightweight Pouch | Single ...</p>
XPath: /p[@class="h6 name_wrapper"]
72 Moderate alfa SIA-R73: Text spacing can be adjusted without loss of content
71 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The line height of the paragraph is less than 1.5
Mode: light
<p class="h6 name_wrapper"> Shave 5 Razor System | Handle & 1 Blade ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 2 View on Page
The line height of the paragraph is less than 1.5
Mode: light
<p class="h6 name_wrapper"> Sandwich Food Storage Container | Set of ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 3 View on Page
The line height of the paragraph is less than 1.5
Mode: light
<p class="h6 name_wrapper"> Shave 5 Razor System | Handle & 1 Blade ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 4 View on Page
The line height of the paragraph is less than 1.5
Mode: light
<p class="h6 name_wrapper"> Everyday Tableware Set | Pack for 4 ...</p>
XPath: /p[@class="h6 name_wrapper"]
Example 5 View on Page
The line height of the paragraph is less than 1.5
Mode: light
<p class="h6 name_wrapper"> Toothbrush in Lightweight Pouch | Single ...</p>
XPath: /p[@class="h6 name_wrapper"]
68 Moderate alfa SIA-R18: ARIA states are consistent with element semantics
68 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The attribute is not allowed for the element on which it is specified
Mode: light
Example 2 View on Page
The attribute is not allowed for the element on which it is specified
Mode: light
Example 3 View on Page
The attribute is not allowed for the element on which it is specified
Mode: light
Example 4 View on Page
The attribute is not allowed for the element on which it is specified
Mode: light
Example 5 View on Page
The attribute is not allowed for the element on which it is specified
Mode: light
66 Moderate alfa SIA-R78: Headings of same level have text content between them
66 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
There is no content between this heading and the next
Mode: light
<h5 class="product__price uppercase h5">...</h5>
XPath: /h5[@class="product__price uppercase h5"]
Example 2 View on Page
There is no content between this heading and the next
Mode: light
<h5 class="product__price uppercase h5">...</h5>
XPath: /h5[@class="product__price uppercase h5"]
Example 3 View on Page
There is no content between this heading and the next
Mode: light
<h5 class="product__price uppercase h5">...</h5>
XPath: /h5[@class="product__price uppercase h5"]
Example 4 View on Page
There is no content between this heading and the next
Mode: light
<h5 class="product__price uppercase h5">...</h5>
XPath: /h5[@class="product__price uppercase h5"]
Example 5 View on Page
There is no content between this heading and the next
Mode: light
<h5 class="product__price uppercase h5">...</h5>
XPath: /h5[@class="product__price uppercase h5"]
62 Moderate alfa SIA-R61:
62 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The document does not start with a level 1 heading
Mode: light
Example 2 View on Page
The document does not start with a level 1 heading
Mode: light
Example 3 View on Page
The document does not start with a level 1 heading
Mode: light
Example 4 View on Page
The document does not start with a level 1 heading
Mode: light
Example 5 View on Page
The document does not start with a level 1 heading
Mode: light
3 Serious alfa SC 1.4.3 AA SIA-R69: Text has sufficient contrast with its background
3 pages affected

Rule Information

Engine: alfa

Roles: Visual Designer

Blocking: No

WCAG: SC 1.4.3 AA

Examples

Example 1 View on Page
The highest possible contrast of the text is 4.37:1 which is below the required contrast of 4.5:1
Mode: light
Example 2 View on Page
The highest possible contrast of the text is 4.28:1 which is below the required contrast of 4.5:1
Mode: light
Example 3 View on Page
The highest possible contrast of the text is 2.09:1 which is below the required contrast of 4.5:1
Mode: light
1 Moderate alfa SIA-R85:
1 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
The text of the paragraph is all italic
Mode: light
<p class="small compare-at em" id="ComparePriceWrapper-product">...</p>
XPath: /p[@id="ComparePriceWrapper-product"]
1 Moderate alfa SIA-R3: lang attribute has a valid language code
1 pages affected

Rule Information

Engine: alfa

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
The element does not have a unique ID
Mode: light
<div class="grid__item large--one-third" id="productInfo-product">...</div>
XPath: /div[@id="productInfo-product"]

🔧 Most Common Issues (axe)

10 rules
383 Critical axe SC 1.1.1 A image-alt:
75 pages affected

Rule Information

Engine: axe

Roles: Content Author

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 1.1.1 A

Affected Pages

Examples

Example 1 View on Page
Images must have alternative text
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645">
XPath: a[href$="account"] > img
Example 2 View on Page
Images must have alternative text
Mode: light
<img srcset="https://i.shgcdn.com..." sizes="100vw" src="https://i.shgcdn.com..." class="shogun-image " decoding="async" loading="eager" draggable="false">
XPath: img[loading="eager"]
Example 3 View on Page
Images must have alternative text
Mode: light
<img srcset="https://i.shgcdn.com..." sizes="100vw" src="https://i.shgcdn.com..." class="shogun-image " decoding="async" loading="lazy" draggable="false">
XPath: img[loading="lazy"]
Example 4 View on Page
Images must have alternative text
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645">
XPath: a[href$="account"] > img
Example 5 View on Page
Images must have alternative text
Mode: light
<img src="https://cdn.shopify.com/s/files/1/2372/0029/files/bcorp-icon.PNG?6054642618249289208">
XPath: .tooltip:nth-child(1) > img
141 Moderate axe heading-order:
75 pages affected

Rule Information

Engine: axe

Roles: Content Author, UX Designer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Heading levels should only increase by one
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: .large--one-third.grid__item:nth-child(1) > h5
Example 2 View on Page
Heading levels should only increase by one
Mode: light
<h3 class="home__subtitle">Related</h3>
XPath: h3
Example 3 View on Page
Heading levels should only increase by one
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: .large--one-third.grid__item:nth-child(1) > h5
Example 4 View on Page
Heading levels should only increase by one
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: .large--one-third.grid__item:nth-child(1) > h5
Example 5 View on Page
Heading levels should only increase by one
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: .large--one-third.grid__item:nth-child(1) > h5
83 Moderate axe region:
75 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
All page content should be contained by landmarks
Mode: light
<div class="header-account-link"> <a href="/account"><img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645"></a> </div>
XPath: .header-account-link
Example 2 View on Page
All page content should be contained by landmarks
Mode: light
<div class="header-account-link"> <a href="/account"><img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645"></a> </div>
XPath: .header-account-link
Example 3 View on Page
All page content should be contained by landmarks
Mode: light
<div class="header-account-link"> <a href="/account"><img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645"></a> </div>
XPath: .header-account-link
Example 4 View on Page
All page content should be contained by landmarks
Mode: light
<div class="header-account-link"> <a href="/account"><img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645"></a> </div>
XPath: .header-account-link
Example 5 View on Page
All page content should be contained by landmarks
Mode: light
<div class="header-account-link"> <a href="/account"><img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645"></a> </div>
XPath: .header-account-link
75 Critical axe SC 4.1.2 A button-name:
75 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer, Content Author

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 4.1.2 A

Affected Pages

Examples

Example 1 View on Page
Buttons must have discernible text
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: .search-btn
Example 2 View on Page
Buttons must have discernible text
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: .search-btn
Example 3 View on Page
Buttons must have discernible text
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: .search-btn
Example 4 View on Page
Buttons must have discernible text
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: .search-btn
Example 5 View on Page
Buttons must have discernible text
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: .search-btn
75 Serious axe SC 3.1.1 A html-has-lang:
75 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

WCAG: SC 3.1.1 A

Affected Pages

Examples

Example 1 View on Page
<html> element must have a lang attribute
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n7-active wf-opensans-n4-active wf-opensans-i4-active wf-opensans-i7-active wf-oswald-n4-active wf-active" style="">
XPath: html
Example 2 View on Page
<html> element must have a lang attribute
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-i4-active wf-opensans-i7-active wf-opensans-n7-active wf-opensans-n4-active wf-active" style="">
XPath: html
Example 3 View on Page
<html> element must have a lang attribute
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-n7-active wf-opensans-n4-active wf-opensans-i7-active wf-opensans-i4-active wf-active" style="">
XPath: html
Example 4 View on Page
<html> element must have a lang attribute
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-oswald-n4-active wf-opensans-n4-active wf-opensans-n7-active wf-opensans-i7-active wf-opensans-i4-active wf-active" style="">
XPath: html
Example 5 View on Page
<html> element must have a lang attribute
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n7-active wf-opensans-n4-active wf-oswald-n4-active wf-opensans-i7-active wf-opensans-i4-active wf-active" style="">
XPath: html
75 Critical axe SC 4.1.2 A label:
75 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer, UX Designer

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 4.1.2 A

Affected Pages

Examples

Example 1 View on Page
Form elements must have labels
Mode: light
<input class="search-bar snize-input-style" type="search" name="q" role="combobox" aria-haspopup="listbox" aria-autocomplete="list" aria-expanded="false" autocorrect="off" autocapitalize="off" autocomplete="off">
XPath: .search-bar
Example 2 View on Page
Form elements must have labels
Mode: light
<input class="search-bar snize-input-style" type="search" name="q" role="combobox" aria-haspopup="listbox" aria-autocomplete="list" aria-expanded="false" autocorrect="off" autocapitalize="off" autocomplete="off">
XPath: .search-bar
Example 3 View on Page
Form elements must have labels
Mode: light
<input class="search-bar snize-input-style" type="search" name="q" role="combobox" aria-haspopup="listbox" aria-autocomplete="list" aria-expanded="false" autocorrect="off" autocapitalize="off" autocomplete="off">
XPath: .search-bar
Example 4 View on Page
Form elements must have labels
Mode: light
<input class="search-bar snize-input-style" type="search" name="q" role="combobox" aria-haspopup="listbox" aria-autocomplete="list" aria-expanded="false" autocorrect="off" autocapitalize="off" autocomplete="off">
XPath: .search-bar
Example 5 View on Page
Form elements must have labels
Mode: light
<input class="search-bar" type="search" name="q">
XPath: .search-bar
72 Serious axe SC 1.4.3 AA color-contrast:
67 pages affected

Rule Information

Engine: axe

Roles: Visual Designer

Blocking: No

WCAG: SC 1.4.3 AA

Affected Pages

Examples

Example 1 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<span id="qab_message" style="color: inherit; font-size: 18px;">FREE SHIPPING ON ALL U.S. ORDERS OVER $50! </span>
XPath: #qab_message
Example 2 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<span id="qab_message" style="color: inherit; font-size: 18px;">FREE SHIPPING ON ALL U.S. ORDERS OVER $50! </span>
XPath: #qab_message
Example 3 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<span id="qab_message" style="color: inherit; font-size: 18px;">FREE SHIPPING ON ALL U.S. ORDERS OVER $50! </span>
XPath: #qab_message
Example 4 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<span id="qab_message" style="color: inherit; font-size: 18px;">FREE SHIPPING ON ALL U.S. ORDERS OVER $50! </span>
XPath: #qab_message
Example 5 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<span id="qab_message" style="color: inherit; font-size: 18px;">FREE SHIPPING ON ALL U.S. ORDERS OVER $50! </span>
XPath: #qab_message
62 Serious axe SC 4.1.2 A aria-input-field-name:
62 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer, Content Author

Blocking: ⚠️ Yes (Task-Blocking)

WCAG: SC 4.1.2 A

Affected Pages

Examples

Example 1 View on Page
ARIA input fields must have an accessible name
Mode: light
<div class="slick-track" style="opacity: 1; width: 4422px; transform: translate3d(-737px, 0px, 0px);" role="listbox">
XPath: .slick-track
Example 2 View on Page
ARIA input fields must have an accessible name
Mode: light
<div class="slick-track" style="opacity: 1; width: 4422px; transform: translate3d(-737px, 0px, 0px);" role="listbox">
XPath: .slick-track
Example 3 View on Page
ARIA input fields must have an accessible name
Mode: light
<div class="slick-track" style="opacity: 1; width: 3685px; transform: translate3d(-737px, 0px, 0px);" role="listbox">
XPath: .slick-track
Example 4 View on Page
ARIA input fields must have an accessible name
Mode: light
<div class="slick-track" style="opacity: 1; width: 5159px; transform: translate3d(-737px, 0px, 0px);" role="listbox">
XPath: .slick-track
Example 5 View on Page
ARIA input fields must have an accessible name
Mode: light
<div class="slick-track" style="opacity: 1; width: 19899px; transform: translate3d(-737px, 0px, 0px);" role="listbox">
XPath: .slick-track
62 Moderate axe SC 4.1.2 A aria-toggle-field-name:
62 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

WCAG: SC 4.1.2 A

Affected Pages

Examples

Example 1 View on Page
ARIA toggle fields must have an accessible name
Mode: light
<div class="product__photo slick-slide slick-current slick-active" data-thumb="//www.preserve.eco/cdn/shop/files/preserve-large-fs-green_small_cropped.jpg?v=1764175523" data-slick-index="0" aria-hidden="false" style="width: 737px;" tabindex="-1" role="option" aria-describedby="slick-slide00">
XPath: .slick-current
Example 2 View on Page
ARIA toggle fields must have an accessible name
Mode: light
<div class="product__photo slick..." data-thumb="//www.preserve.eco/c..." data-slick-index="0" aria-hidden="false" style="width: 737px;" tabindex="-1" role="option" aria-describedby="slick-slide00">
XPath: .slick-current
Example 3 View on Page
ARIA toggle fields must have an accessible name
Mode: light
<div class="product__photo slick..." data-thumb="//www.preserve.eco/c..." data-slick-index="0" aria-hidden="false" style="width: 737px;" tabindex="-1" role="option" aria-describedby="slick-slide00">
XPath: .slick-current
Example 4 View on Page
ARIA toggle fields must have an accessible name
Mode: light
<div class="product__photo slick-slide slick-current slick-active" data-thumb="//www.preserve.eco/cdn/shop/products/otg-cups-green_small_cropped.jpg?v=1517173673" data-slick-index="0" aria-hidden="false" style="width: 737px;" tabindex="-1" role="option" aria-describedby="slick-slide00">
XPath: .slick-current
Example 5 View on Page
ARIA toggle fields must have an accessible name
Mode: light
<div class="product__photo slick-slide slick-current slick-active" data-thumb="//www.preserve.eco/cdn/shop/files/LWP_small_cropped.jpg?v=1697593659" data-slick-index="0" aria-hidden="false" style="width: 737px;" tabindex="-1" role="option" aria-describedby="slick-slide00">
XPath: .slick-current

🔧 Most Common Issues (Equal Access)

32 rules
1726 Moderate equalAccess style_focus_visible:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Check the keyboard focus indicator is visible when using CSS declaration for 'border' or 'outline'
Mode: light
<input name="q" type="search" class="search-bar">
Example 2 View on Page
Check the keyboard focus indicator is visible when using CSS declaration for 'border' or 'outline'
Mode: light
<button class="btn search-btn" type="submit">
Example 3 View on Page
Check the keyboard focus indicator is visible when using CSS declaration for 'border' or 'outline'
Mode: light
<div style="position: relative; background-color: rgb(253, 52, 29); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Bright Poppy Red" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-245 PwzrButton-root-216 PwzrButton-text-218 rio-swatch-border-double-5d5e798f-2ec2-4da1-afc9-c401d9255372">
Example 4 View on Page
Check the keyboard focus indicator is visible when using CSS declaration for 'border' or 'outline'
Mode: light
<div style="position: relative; background-color: rgb(15, 55, 126); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Navy" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-277 PwzrButton-root-248 PwzrButton-text-250 rio-swatch-border-double-a2e75297-2452-4201-9ee2-b5c3ad0b036c">
Example 5 View on Page
Check the keyboard focus indicator is visible when using CSS declaration for 'border' or 'outline'
Mode: light
<div style="position: relative; background-color: rgb(232, 247, 86); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Key Lime" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-309 PwzrButton-root-280 PwzrButton-text-282 rio-swatch-border-double-56d16267-1e2a-4f7b-9949-c8c8aaf16515">
1045 Moderate equalAccess aria_attribute_deprecated:
68 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The ARIA attributes "aria-disabled" are deprecated for the role "none" in the ARIA specification
Mode: light
<div style="position: relative; background-color: rgb(253, 52, 29); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Bright Poppy Red" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-245 PwzrButton-root-216 PwzrButton-text-218 rio-swatch-border-double-5d5e798f-2ec2-4da1-afc9-c401d9255372">
Example 2 View on Page
The ARIA attributes "aria-disabled" are deprecated for the role "none" in the ARIA specification
Mode: light
<div style="position: relative; background-color: rgb(15, 55, 126); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Navy" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-277 PwzrButton-root-248 PwzrButton-text-250 rio-swatch-border-double-a2e75297-2452-4201-9ee2-b5c3ad0b036c">
Example 3 View on Page
The ARIA attributes "aria-disabled" are deprecated for the role "none" in the ARIA specification
Mode: light
<div style="position: relative; background-color: rgb(232, 247, 86); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Key Lime" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-309 PwzrButton-root-280 PwzrButton-text-282 rio-swatch-border-double-56d16267-1e2a-4f7b-9949-c8c8aaf16515">
Example 4 View on Page
The ARIA attributes "aria-disabled" are deprecated for the role "none" in the ARIA specification
Mode: light
<div style="position: relative; background-color: rgb(248, 231, 28); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Sunshine" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-341 PwzrButton-root-312 PwzrButton-text-314 rio-swatch-border-double-ea7768c3-7f1f-416f-b286-3ff78a6ad46b">
Example 5 View on Page
The ARIA attributes "aria-disabled" are deprecated for the role "none" in the ARIA specification
Mode: light
<div style="position: relative; background-color: rgb(250, 202, 196); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Coral" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-373 PwzrButton-root-344 PwzrButton-text-346 rio-swatch-border-double-bb62adff-9fd3-4ab3-8c5b-bd4eb5ef8ff2">
1045 Moderate equalAccess element_tabbable_role_valid:
68 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The tabbable element's role 'generic' is not a widget role
Mode: light
<div style="position: relative; background-color: rgb(253, 52, 29); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Bright Poppy Red" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-245 PwzrButton-root-216 PwzrButton-text-218 rio-swatch-border-double-5d5e798f-2ec2-4da1-afc9-c401d9255372">
Example 2 View on Page
The tabbable element's role 'generic' is not a widget role
Mode: light
<div style="position: relative; background-color: rgb(15, 55, 126); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Navy" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-277 PwzrButton-root-248 PwzrButton-text-250 rio-swatch-border-double-a2e75297-2452-4201-9ee2-b5c3ad0b036c">
Example 3 View on Page
The tabbable element's role 'generic' is not a widget role
Mode: light
<div style="position: relative; background-color: rgb(232, 247, 86); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Key Lime" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-309 PwzrButton-root-280 PwzrButton-text-282 rio-swatch-border-double-56d16267-1e2a-4f7b-9949-c8c8aaf16515">
Example 4 View on Page
The tabbable element's role 'generic' is not a widget role
Mode: light
<div style="position: relative; background-color: rgb(248, 231, 28); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Sunshine" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-341 PwzrButton-root-312 PwzrButton-text-314 rio-swatch-border-double-ea7768c3-7f1f-416f-b286-3ff78a6ad46b">
Example 5 View on Page
The tabbable element's role 'generic' is not a widget role
Mode: light
<div style="position: relative; background-color: rgb(250, 202, 196); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Coral" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-373 PwzrButton-root-344 PwzrButton-text-346 rio-swatch-border-double-bb62adff-9fd3-4ab3-8c5b-bd4eb5ef8ff2">
833 Moderate equalAccess element_tabbable_visible:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Confirm the element should be tabbable and if so, it becomes visible when it has keyboard focus
Mode: light
<a href="/pages/contact-us123">
Example 2 View on Page
Confirm the element should be tabbable and if so, it becomes visible when it has keyboard focus
Mode: light
<a class="CartToggle header-cart" href="/cart">
Example 3 View on Page
Confirm the element should be tabbable and if so, it becomes visible when it has keyboard focus
Mode: light
<a itemprop="url" href="/">
Example 4 View on Page
Confirm the element should be tabbable and if so, it becomes visible when it has keyboard focus
Mode: light
<a class="nav-link" href="/collections">
Example 5 View on Page
Confirm the element should be tabbable and if so, it becomes visible when it has keyboard focus
Mode: light
<a class="nav-link" href="/pages/overview">
405 Moderate equalAccess aria_role_redundant:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The explicitly-assigned ARIA role "banner" is redundant with the implicit role of the element <header>
Mode: light
<header role="banner" class="site-header header--large showMobile">
Example 2 View on Page
The explicitly-assigned ARIA role "main" is redundant with the implicit role of the element <main>
Mode: light
<main role="main" class="main-content">
Example 3 View on Page
The explicitly-assigned ARIA role "contentinfo" is redundant with the implicit role of the element <footer>
Mode: light
<footer itemtype="http://schema.org/Organization" itemscope="" data-section-type="footer" data-section-id="footer" role="contentinfo" class="site-footer-wrapper">
Example 4 View on Page
The explicitly-assigned ARIA role "banner" is redundant with the implicit role of the element <header>
Mode: light
<header role="banner" class="site-header header--large showMobile">
Example 5 View on Page
The explicitly-assigned ARIA role "main" is redundant with the implicit role of the element <main>
Mode: light
<main role="main" class="main-content">
383 Moderate equalAccess img_alt_valid:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The image has neither an accessible name nor is marked as decorative or redundant
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645">
Example 2 View on Page
The image has neither an accessible name nor is marked as decorative or redundant
Mode: light
<img draggable="false" loading="eager" decoding="async" class="shogun-image " src="https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/" sizes="100vw" srcset="https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/180x/ 180w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/360x/ 360w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/720x/ 720w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/900x/ 900w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/1080x/ 1080w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/1200x/ 1200w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/1920x/ 1920w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/2048x/ 2048w">
Example 3 View on Page
The image has neither an accessible name nor is marked as decorative or redundant
Mode: light
<img draggable="false" loading="lazy" decoding="async" class="shogun-image " src="https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/" sizes="100vw" srcset="https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/180x/ 180w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/360x/ 360w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/720x/ 720w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/900x/ 900w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/1080x/ 1080w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/1200x/ 1200w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/1920x/ 1920w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/2048x/ 2048w">
Example 4 View on Page
The image has neither an accessible name nor is marked as decorative or redundant
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645">
Example 5 View on Page
The image has neither an accessible name nor is marked as decorative or redundant
Mode: light
<img src="https://cdn.shopify.com/s/files/1/2372/0029/files/bcorp-icon.PNG?6054642618249289208">
338 Moderate equalAccess aria_id_unique:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The 'id' "slick-slide00" specified for the ARIA property 'aria-describedby' value is not valid
Mode: light
<div aria-describedby="slick-slide00" role="option" tabindex="-1" style="width: 483px;" aria-hidden="false" data-slick-index="0" data-thumb="//www.preserve.eco/cdn/shop/files/preserve-large-fs-green_small_cropped.jpg?v=1764175523" class="product__photo slick-slide slick-current slick-active">
Example 2 View on Page
The 'id' "slick-slide01" specified for the ARIA property 'aria-describedby' value is not valid
Mode: light
<div aria-describedby="slick-slide01" role="option" tabindex="-1" style="width: 483px;" aria-hidden="true" data-slick-index="1" data-thumb="//www.preserve.eco/cdn/shop/files/preserve-large-fs-red_46054568-9d83-4313-ace5-5b1d727d3e61_small_cropped.jpg?v=1764175523" class="product__photo product__photo--additional slick-slide">
Example 3 View on Page
The 'id' "slick-slide02" specified for the ARIA property 'aria-describedby' value is not valid
Mode: light
<div aria-describedby="slick-slide02" role="option" tabindex="-1" style="width: 483px;" aria-hidden="true" data-slick-index="2" data-thumb="//www.preserve.eco/cdn/shop/files/preserve-large-fs-aqua_small_cropped.jpg?v=1764175523" class="product__photo product__photo--additional slick-slide">
Example 4 View on Page
The 'id' "slick-slide03" specified for the ARIA property 'aria-describedby' value is not valid
Mode: light
<div aria-describedby="slick-slide03" role="option" tabindex="-1" style="width: 483px;" aria-hidden="true" data-slick-index="3" data-thumb="//www.preserve.eco/cdn/shop/products/Large-Round-Lifestyle_small_cropped.png?v=1764014540" class="product__photo product__photo--additional slick-slide">
Example 5 View on Page
The 'id' "slick-slide00" specified for the ARIA property 'aria-describedby' value is not valid
Mode: light
<div aria-describedby="slick-slide00" role="option" tabindex="-1" style="width: 483px;" aria-hidden="false" data-slick-index="0" data-thumb="//www.preserve.eco/cdn/shop/products/POPi-TB-Package-NeptuneGreen-TB-pack_small_cropped.jpg?v=1569491339" class="product__photo slick-slide slick-current slick-active">
239 Moderate equalAccess text_block_heading:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Confirm this text 'info@preserve.eco info@preserve.eco' is used as a heading and if so, modify to use a heading element or role
Mode: light
<p>
Example 2 View on Page
Confirm this text 'FREE SHIPPING ON ALL U.S. ORDERS OVER $50!' is used as a heading and if so, modify to use a heading element or role
Mode: light
<div style="text-align: center; display: inline-block; width: 100%; color: inherit; position: relative; z-index: 1; font-size: 18px;" aria-hidden="true" id="qab_content">
Example 3 View on Page
Confirm this text 'Quantity' is used as a heading and if so, modify to use a heading element or role
Mode: light
<div id="Quantity-product" class="quantity-selector__wrapper text-center">
Example 4 View on Page
Confirm this text 'info@preserve.eco info@preserve.eco' is used as a heading and if so, modify to use a heading element or role
Mode: light
<p>
Example 5 View on Page
Confirm this text 'FREE SHIPPING ON ALL U.S. ORDERS OVER $50!' is used as a heading and if so, modify to use a heading element or role
Mode: light
<div style="text-align: center; display: inline-block; width: 100%; color: inherit; position: relative; z-index: 1; font-size: 18px;" aria-hidden="true" id="qab_content">
231 Moderate equalAccess a_text_purpose:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Hyperlink has no link text, label or image with a text alternative
Mode: light
<a href="/account">
Example 2 View on Page
Hyperlink has no link text, label or image with a text alternative
Mode: light
<a href="/pages/contact-us123">
Example 3 View on Page
Hyperlink has no link text, label or image with a text alternative
Mode: light
<a class="CartToggle header-cart" href="/cart">
Example 4 View on Page
Hyperlink has no link text, label or image with a text alternative
Mode: light
<a href="/account">
Example 5 View on Page
Hyperlink has no link text, label or image with a text alternative
Mode: light
<a href="/pages/contact-us123">
213 Moderate equalAccess input_label_visible:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The ‘placeholder’ is the only visible label
Mode: light
<input name="contact[email]" autocapitalize="off" autocorrect="off" aria-label="your-email@example.com" class="input-group-field" id="mail" placeholder="your-email@example.com" type="email">
Example 2 View on Page
The input element does not have an associated visible label
Mode: light
<input value="Subscribe" id="subscribe" name="subscribe" class="btn uppercase" type="submit">
Example 3 View on Page
The input element does not have an associated visible label
Mode: light
<input mm-step="1" step="1" mm-stock-max="NaN" mm-min="1" data-submit="" id="" name="quantity" pattern="[0-9]*" aria-label="quantity" data-id="" min="1" value="1" class="js-qty__num QuantityInput" type="text">
Example 4 View on Page
The ‘placeholder’ is the only visible label
Mode: light
<input name="contact[email]" autocapitalize="off" autocorrect="off" aria-label="your-email@example.com" class="input-group-field" id="mail" placeholder="your-email@example.com" type="email">
Example 5 View on Page
The input element does not have an associated visible label
Mode: light
<input value="Subscribe" id="subscribe" name="subscribe" class="btn uppercase" type="submit">
212 Moderate equalAccess input_label_exists:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Form control element <input> has no associated label
Mode: light
<input name="q" type="search" class="search-bar">
Example 2 View on Page
Form control element <button> has no associated label
Mode: light
<button class="btn search-btn" type="submit">
Example 3 View on Page
Form control element <input> has no associated label
Mode: light
<input name="q" type="search" class="search-bar">
Example 4 View on Page
Form control element <button> has no associated label
Mode: light
<button class="btn search-btn" type="submit">
Example 5 View on Page
Form control with "listbox" role has no associated label
Mode: light
<div role="listbox" style="opacity: 1; width: 2898px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
204 Moderate equalAccess element_attribute_deprecated:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The HTML attribute(s) "http-equiv" is deprecated for the <meta> element in HTML 5
Mode: light
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
Example 2 View on Page
The HTML attribute(s) "http-equiv" is deprecated for the <meta> element in HTML 5
Mode: light
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
Example 3 View on Page
The HTML attribute(s) "align" is deprecated in HTML 5
Mode: light
<div align="left">
Example 4 View on Page
The HTML attribute(s) "frameborder, scrolling" is deprecated for the <iframe> element in HTML 5
Mode: light
<iframe style="overflow: hidden; height: 1860px; width: 100%; box-shadow: unset; outline: unset; color-scheme: none;" margin="0" scrolling="no" frameborder="0" width="100%" height="1860px" src="https://loox.io/widget/4JZEXBcfNh/reviews/12512376587?h=1773069892567" title="Product reviews widget" id="looxReviewsFrame">
Example 5 View on Page
The HTML attribute(s) "http-equiv" is deprecated for the <meta> element in HTML 5
Mode: light
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
134 Moderate equalAccess element_tabbable_unobscured:
68 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Confirm that when the element receives focus, it is not covered or, if covered by user action, can be uncovered without moving focus
Mode: light
<div style="position: relative; background-color: rgb(250, 202, 196); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Coral" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-373 PwzrButton-root-344 PwzrButton-text-346 rio-swatch-border-double-bb62adff-9fd3-4ab3-8c5b-bd4eb5ef8ff2">
Example 2 View on Page
Confirm that when the element receives focus, it is not covered or, if covered by user action, can be uncovered without moving focus
Mode: light
<div style="position: relative; background-color: rgb(179, 235, 233); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Neptune" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-405 PwzrButton-root-376 PwzrButton-text-378 rio-swatch-border-double-3f18ec0a-85b8-4922-bef7-2cf9821bbc75">
Example 3 View on Page
Confirm that when the element receives focus, it is not covered or, if covered by user action, can be uncovered without moving focus
Mode: light
<div style="position: relative; background-color: rgb(17, 207, 240); background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2240px%22%20height%3D%2240px%22%20fill%3D%22none%22%20viewBox%3D%220%200%20120%20120%22%20data-reactroot%3D%22%22%3E%3Cpath%20fill%3D%22rgba(17%2C%20207%2C%20240%2C%201)%22%20d%3D%22M0%200H120V120H0z%22%3E%3C%2Fpath%3E%3Cpath%20fill%3D%22rgba(200%2C%20235%2C%2017%2C%201)%22%20d%3D%22M40%200H120V120H40z%22%3E%3C%2Fpath%3E%3Cpath%20fill%3D%22rgba(229%2C%2022%2C%20125%2C%201)%22%20d%3D%22M80%200H120V120H80z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E"); background-size: cover; background-position: center center; background-repeat: no-repeat; min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Surprise Me!" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-437 PwzrButton-root-408 PwzrButton-text-410 rio-swatch-border-double-4b167724-3c21-4a5c-8fd6-db7b99c1d2a6">
Example 4 View on Page
Confirm that when the element receives focus, it is not covered or, if covered by user action, can be uncovered without moving focus
Mode: light
<a class="share__link" href="//twitter.com/share?url=https://www.preserve.eco/products/round-food-storage-container-large&text=" target="_blank">
Example 5 View on Page
Confirm that when the element receives focus, it is not covered or, if covered by user action, can be uncovered without moving focus
Mode: light
<div style="position: relative; background-color: rgb(255, 203, 0); min-width: 40px; width: 40px; height: 40px; outline: none; box-sizing: border-box; border: 3px solid rgb(220, 220, 220);" data-option-value="Yellow" aria-disabled="false" role="none" tabindex="0" class="PwzrButtonBase-root-1366 PwzrButton-root-1337 PwzrButton-text-1339 rio-swatch-border-double-a2779434-6d2f-4db2-8219-ec227ba99293">
124 Moderate equalAccess aria_form_label_unique:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Multiple elements with "form" role do not have unique labels
Mode: light
<form class="product-form-product product-form" data-section="product" id="AddToCartForm-{{ section.id }" enctype="multipart/form-data" method="post" action="/cart/add">
Example 2 View on Page
Multiple elements with "form" role do not have unique labels
Mode: light
<form class="contact-form" accept-charset="UTF-8" id="contact_form" action="/contact#contact_form" method="post">
Example 3 View on Page
Multiple elements with "form" role do not have unique labels
Mode: light
<form class="product-form-product product-form" data-section="product" id="AddToCartForm-{{ section.id }" enctype="multipart/form-data" method="post" action="/cart/add">
Example 4 View on Page
Multiple elements with "form" role do not have unique labels
Mode: light
<form class="contact-form" accept-charset="UTF-8" id="contact_form" action="/contact#contact_form" method="post">
Example 5 View on Page
Multiple elements with "form" role do not have unique labels
Mode: light
<form class="product-form-product product-form" data-section="product" id="AddToCartForm-{{ section.id }" enctype="multipart/form-data" method="post" action="/cart/add">
87 Moderate equalAccess aria_keyboard_handler_exists:
63 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Verify the <div> element with "listbox" role has keyboard access
Mode: light
<div role="listbox" style="opacity: 1; width: 2898px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 2 View on Page
Verify the <input> element with "combobox" role has keyboard access
Mode: light
<input autocomplete="off" autocapitalize="off" autocorrect="off" aria-expanded="false" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" name="q" type="search" class="search-bar snize-input-style">
Example 3 View on Page
Verify the <div> element with "listbox" role has keyboard access
Mode: light
<div role="listbox" style="opacity: 1; width: 2898px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 4 View on Page
Verify the <fieldset> element with "radiogroup" role has keyboard access
Mode: light
<fieldset data-bsub-widget="" role="radiogroup" class="bsub-widget">
Example 5 View on Page
Verify the <div> element with "listbox" role has keyboard access
Mode: light
<div role="listbox" style="opacity: 1; width: 2415px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
82 Moderate equalAccess aria_child_valid:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The element with role "list" does not own any child element with any of the following role(s): "listitem"
Mode: light
<ul class="tabs product-tabs-title">
Example 2 View on Page
The element with role "radiogroup" owns the child element with the role "graphics-document" that is not one of the allowed role(s): "radio"
Mode: light
<fieldset data-bsub-widget="" role="radiogroup" class="bsub-widget">
Example 3 View on Page
The element with role "list" does not own any child element with any of the following role(s): "listitem"
Mode: light
<ul class="tabs product-tabs-title">
Example 4 View on Page
The element with role "list" does not own any child element with any of the following role(s): "listitem"
Mode: light
<ul class="tabs product-tabs-title">
Example 5 View on Page
The element with role "list" does not own any child element with any of the following role(s): "listitem"
Mode: light
<ul class="tabs product-tabs-title">
80 Moderate equalAccess widget_tabbable_exists:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Component with "listbox" role does not have a tabbable element
Mode: light
<div role="listbox" style="opacity: 1; width: 2898px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 2 View on Page
Component with "listbox" role does not have a tabbable element
Mode: light
<div role="listbox" style="opacity: 1; width: 2898px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 3 View on Page
Component with "radiogroup" role does not have a tabbable element
Mode: light
<fieldset data-bsub-widget="" role="radiogroup" class="bsub-widget">
Example 4 View on Page
Component with "listbox" role does not have a tabbable element
Mode: light
<div role="listbox" style="opacity: 1; width: 2415px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 5 View on Page
Component with "listbox" role does not have a tabbable element
Mode: light
<div role="listbox" style="opacity: 1; width: 3381px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
75 Moderate equalAccess html_lang_exists:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Page detected as HTML, but does not have a 'lang' attribute
Mode: light
<html style="" class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-n7-active wf-oswald-n4-active wf-opensans-i4-active wf-opensans-i7-active wf-active">
Example 2 View on Page
Page detected as HTML, but does not have a 'lang' attribute
Mode: light
<html style="" class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-i4-active wf-opensans-n7-active wf-opensans-i7-active wf-oswald-n4-active wf-active">
Example 3 View on Page
Page detected as HTML, but does not have a 'lang' attribute
Mode: light
<html style="" class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-i4-active wf-opensans-n7-active wf-opensans-i7-active wf-oswald-n4-active wf-active">
Example 4 View on Page
Page detected as HTML, but does not have a 'lang' attribute
Mode: light
<html style="" class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-i4-active wf-opensans-n7-active wf-opensans-i7-active wf-oswald-n4-active wf-active">
Example 5 View on Page
Page detected as HTML, but does not have a 'lang' attribute
Mode: light
<html style="" class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-i4-active wf-opensans-n7-active wf-opensans-i7-active wf-oswald-n4-active wf-active">
75 Moderate equalAccess style_color_misuse:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Verify color is not used as the only visual means of conveying information
Mode: light
<link media="all" type="text/css" rel="stylesheet" href="//www.preserve.eco/cdn/shop/t/21/assets/style.scss.css?v=161406752355558598801726754389">
Example 2 View on Page
Verify color is not used as the only visual means of conveying information
Mode: light
<link media="all" type="text/css" rel="stylesheet" href="//www.preserve.eco/cdn/shop/t/21/assets/style.scss.css?v=161406752355558598801726754389">
Example 3 View on Page
Verify color is not used as the only visual means of conveying information
Mode: light
<link media="all" type="text/css" rel="stylesheet" href="//www.preserve.eco/cdn/shop/t/21/assets/style.scss.css?v=161406752355558598801726754389">
Example 4 View on Page
Verify color is not used as the only visual means of conveying information
Mode: light
<style type="text/css">
Example 5 View on Page
Verify color is not used as the only visual means of conveying information
Mode: light
<style type="text/css">
75 Moderate equalAccess style_highcontrast_visible:
75 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Confirm Windows high contrast mode is supported when using CSS to include, position or alter non-decorative content
Mode: light
<link media="all" type="text/css" rel="stylesheet" href="//www.preserve.eco/cdn/shop/t/21/assets/style.scss.css?v=161406752355558598801726754389">
Example 2 View on Page
Confirm Windows high contrast mode is supported when using CSS to include, position or alter non-decorative content
Mode: light
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Open+Sans">
Example 3 View on Page
Confirm Windows high contrast mode is supported when using CSS to include, position or alter non-decorative content
Mode: light
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Open+Sans">
Example 4 View on Page
Confirm Windows high contrast mode is supported when using CSS to include, position or alter non-decorative content
Mode: light
<style type="text/css">
Example 5 View on Page
Confirm Windows high contrast mode is supported when using CSS to include, position or alter non-decorative content
Mode: light
<style type="text/css">
72 Moderate equalAccess text_contrast_sufficient:
67 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Text contrast of 4.30 with its background is less than the WCAG AA minimum requirements for text of size 18px and weight of 400
Mode: light
<span style="color: inherit; font-size: 18px;" id="qab_message">
Example 2 View on Page
Text contrast of 4.30 with its background is less than the WCAG AA minimum requirements for text of size 18px and weight of 400
Mode: light
<span style="color: inherit; font-size: 18px;" id="qab_message">
Example 3 View on Page
Text contrast of 4.30 with its background is less than the WCAG AA minimum requirements for text of size 18px and weight of 400
Mode: light
<span style="color: inherit; font-size: 18px;" id="qab_message">
Example 4 View on Page
Text contrast of 4.30 with its background is less than the WCAG AA minimum requirements for text of size 18px and weight of 400
Mode: light
<span style="color: inherit; font-size: 18px;" id="qab_message">
Example 5 View on Page
Text contrast of 4.30 with its background is less than the WCAG AA minimum requirements for text of size 18px and weight of 400
Mode: light
<span style="color: inherit; font-size: 18px;" id="qab_message">
64 Moderate equalAccess text_sensory_misuse:
38 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Confirm the user instruction is still understandable without the word(s) 'Round, Large'
Mode: light
<span>
Example 2 View on Page
Confirm the user instruction is still understandable without the word(s) 'Round, Large'
Mode: light
<h1 class="h2" itemprop="name">
Example 3 View on Page
Confirm the word(s) 'screw-top' of the user instruction is used to indicate a logical rather than visual position
Mode: light
<span>
Example 4 View on Page
Confirm the user instruction is still understandable without the word(s) 'Medium'
Mode: light
<span style="font-size: 14px; color: rgb(0, 0, 0); font-weight: normal; text-transform: none;">
Example 5 View on Page
Confirm the user instruction is still understandable without the word(s) 'big, pocket-sized'
Mode: light
<span>
62 Moderate equalAccess aria_child_tabbable:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
None of the descendent elements with "option" role is tabbable
Mode: light
<div role="listbox" style="opacity: 1; width: 2898px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 2 View on Page
None of the descendent elements with "option" role is tabbable
Mode: light
<div role="listbox" style="opacity: 1; width: 2898px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 3 View on Page
None of the descendent elements with "option" role is tabbable
Mode: light
<div role="listbox" style="opacity: 1; width: 2415px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 4 View on Page
None of the descendent elements with "option" role is tabbable
Mode: light
<div role="listbox" style="opacity: 1; width: 3381px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
Example 5 View on Page
None of the descendent elements with "option" role is tabbable
Mode: light
<div role="listbox" style="opacity: 1; width: 13041px; transform: translate3d(-483px, 0px, 0px);" class="slick-track">
62 Moderate equalAccess aria_widget_labelled:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Interactive component with ARIA role 'option' does not have a programmatically associated name
Mode: light
<div aria-describedby="slick-slide00" role="option" tabindex="-1" style="width: 483px;" aria-hidden="false" data-slick-index="0" data-thumb="//www.preserve.eco/cdn/shop/files/preserve-large-fs-green_small_cropped.jpg?v=1764175523" class="product__photo slick-slide slick-current slick-active">
Example 2 View on Page
Interactive component with ARIA role 'option' does not have a programmatically associated name
Mode: light
<div aria-describedby="slick-slide00" role="option" tabindex="-1" style="width: 483px;" aria-hidden="false" data-slick-index="0" data-thumb="//www.preserve.eco/cdn/shop/products/POPi-TB-Package-NeptuneGreen-TB-pack_small_cropped.jpg?v=1569491339" class="product__photo slick-slide slick-current slick-active">
Example 3 View on Page
Interactive component with ARIA role 'option' does not have a programmatically associated name
Mode: light
<div aria-describedby="slick-slide00" role="option" tabindex="-1" style="width: 483px;" aria-hidden="false" data-slick-index="0" data-thumb="//www.preserve.eco/cdn/shop/products/Lunchpack_productlisting_small_cropped.jpg?v=1516759503" class="product__photo slick-slide slick-current slick-active">
Example 4 View on Page
Interactive component with ARIA role 'option' does not have a programmatically associated name
Mode: light
<div aria-describedby="slick-slide00" role="option" tabindex="-1" style="width: 483px;" aria-hidden="false" data-slick-index="0" data-thumb="//www.preserve.eco/cdn/shop/products/otg-cups-green_small_cropped.jpg?v=1517173673" class="product__photo slick-slide slick-current slick-active">
Example 5 View on Page
Interactive component with ARIA role 'option' does not have a programmatically associated name
Mode: light
<div aria-describedby="slick-slide00" role="option" tabindex="-1" style="width: 483px;" aria-hidden="false" data-slick-index="0" data-thumb="//www.preserve.eco/cdn/shop/files/LWP_small_cropped.jpg?v=1697593659" class="product__photo slick-slide slick-current slick-active">
62 Moderate equalAccess frame_src_valid:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Verify <frame> content is accessible
Mode: light
<iframe style="overflow: hidden; height: 1860px; width: 100%; box-shadow: unset; outline: unset; color-scheme: none;" margin="0" scrolling="no" frameborder="0" width="100%" height="1860px" src="https://loox.io/widget/4JZEXBcfNh/reviews/12512376587?h=1773069892567" title="Product reviews widget" id="looxReviewsFrame">
Example 2 View on Page
Verify <frame> content is accessible
Mode: light
<iframe style="overflow: hidden; height: 1820px; width: 100%; box-shadow: unset; outline: unset; color-scheme: none;" margin="0" scrolling="no" frameborder="0" width="100%" height="1820px" src="https://loox.io/widget/4JZEXBcfNh/reviews/3750152470580?h=1773069892567" title="Product reviews widget" id="looxReviewsFrame">
Example 3 View on Page
Verify <frame> content is accessible
Mode: light
<iframe style="overflow: hidden; height: 1349px; width: 100%; box-shadow: unset; outline: unset; color-scheme: none;" margin="0" scrolling="no" frameborder="0" width="100%" height="1349px" src="https://loox.io/widget/4JZEXBcfNh/reviews/12512370187?h=1773069892567" title="Product reviews widget" id="looxReviewsFrame">
Example 4 View on Page
Verify <frame> content is accessible
Mode: light
<iframe style="overflow: hidden; height: 1762px; width: 100%; box-shadow: unset; outline: unset; color-scheme: none;" margin="0" scrolling="no" frameborder="0" width="100%" height="1762px" src="https://loox.io/widget/4JZEXBcfNh/reviews/12512360907?h=1773069892567" title="Product reviews widget" id="looxReviewsFrame">
Example 5 View on Page
Verify <frame> content is accessible
Mode: light
<iframe style="overflow: hidden; height: 1497px; width: 100%; box-shadow: unset; outline: unset; color-scheme: none;" margin="0" scrolling="no" frameborder="0" width="100%" height="1497px" src="https://loox.io/widget/4JZEXBcfNh/reviews/12512364235?h=1773069892567" title="Product reviews widget" id="looxReviewsFrame">
62 Moderate equalAccess aria_complementary_labelled:
62 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Element with "complementary" role does not have a label
Mode: light
<aside class="grid page-margin">
Example 2 View on Page
Element with "complementary" role does not have a label
Mode: light
<aside class="grid page-margin">
Example 3 View on Page
Element with "complementary" role does not have a label
Mode: light
<aside class="grid page-margin">
Example 4 View on Page
Element with "complementary" role does not have a label
Mode: light
<aside class="grid page-margin">
Example 5 View on Page
Element with "complementary" role does not have a label
Mode: light
<aside class="grid page-margin">
61 Moderate equalAccess element_id_unique:
60 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The <input> element has the id "" that is empty
Mode: light
<input mm-step="1" step="1" mm-stock-max="NaN" mm-min="1" data-submit="" id="" name="quantity" pattern="[0-9]*" aria-label="quantity" data-id="" min="1" value="1" class="js-qty__num QuantityInput" type="text">
Example 2 View on Page
The <input> element has the id "" that is empty
Mode: light
<input mm-step="1" step="1" mm-stock-max="NaN" mm-min="1" data-submit="" id="" name="quantity" pattern="[0-9]*" aria-label="quantity" data-id="" min="1" value="1" class="js-qty__num QuantityInput" type="text">
Example 3 View on Page
The <input> element has the id "" that is empty
Mode: light
<input mm-step="1" step="1" mm-stock-max="NaN" mm-min="1" data-submit="" id="" name="quantity" pattern="[0-9]*" aria-label="quantity" data-id="" min="1" value="1" class="js-qty__num QuantityInput" type="text">
Example 4 View on Page
The <input> element has the id "" that is empty
Mode: light
<input mm-step="1" step="1" mm-stock-max="NaN" mm-min="1" data-submit="" id="" name="quantity" pattern="[0-9]*" aria-label="quantity" data-id="" min="1" value="1" class="js-qty__num QuantityInput" type="text">
Example 5 View on Page
The <input> element has the id "" that is empty
Mode: light
<input mm-step="1" step="1" mm-max="10" max="10" mm-stock-max="NaN" mm-min="1" data-submit="" id="" name="quantity" pattern="[0-9]*" aria-label="quantity" data-id="" min="1" value="1" class="js-qty__num QuantityInput" type="text">
60 Moderate equalAccess label_ref_valid:
60 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The value "Quantity" of the 'for' attribute is not the 'id' of a valid element
Mode: light
<label class="quantity-selector uppercase" for="Quantity">
Example 2 View on Page
The value "Quantity" of the 'for' attribute is not the 'id' of a valid element
Mode: light
<label class="quantity-selector uppercase" for="Quantity">
Example 3 View on Page
The value "Quantity" of the 'for' attribute is not the 'id' of a valid element
Mode: light
<label class="quantity-selector uppercase" for="Quantity">
Example 4 View on Page
The value "Quantity" of the 'for' attribute is not the 'id' of a valid element
Mode: light
<label class="quantity-selector uppercase" for="Quantity">
Example 5 View on Page
The value "Quantity" of the 'for' attribute is not the 'id' of a valid element
Mode: light
<label class="quantity-selector uppercase" for="Quantity">
18 Moderate equalAccess svg_graphics_labelled:
18 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The SVG element has no accessible name
Mode: light
<svg fill="currentColor" viewBox="0 0 72 72" class="bsub-widget__image">
Example 2 View on Page
The SVG element has no accessible name
Mode: light
<svg fill="currentColor" viewBox="0 0 72 72" class="bsub-widget__image">
Example 3 View on Page
The SVG element has no accessible name
Mode: light
<svg fill="currentColor" viewBox="0 0 72 72" class="bsub-widget__image">
Example 4 View on Page
The SVG element has no accessible name
Mode: light
<svg fill="currentColor" viewBox="0 0 72 72" class="bsub-widget__image">
Example 5 View on Page
The SVG element has no accessible name
Mode: light
<svg fill="currentColor" viewBox="0 0 72 72" class="bsub-widget__image">
8 Moderate equalAccess text_quoted_correctly:
8 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
If the following text is a quotation, mark it as a <q> or <blockquote> element: " x 11.5"
Mode: light
<li>
Example 2 View on Page
If the following text is a quotation, mark it as a <q> or <blockquote> element: " x 11.5"
Mode: light
<li>
Example 3 View on Page
If the following text is a quotation, mark it as a <q> or <blockquote> element: " × 9"
Mode: light
<li>
Example 4 View on Page
If the following text is a quotation, mark it as a <q> or <blockquote> element: " × 9"
Mode: light
<li>
Example 5 View on Page
If the following text is a quotation, mark it as a <q> or <blockquote> element: " x 10"
Mode: light
<li>
7 Moderate equalAccess aria_role_valid:
7 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
The ARIA role 'combobox' is not valid for the element <input>
Mode: light
<input autocomplete="off" autocapitalize="off" autocorrect="off" aria-expanded="false" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" name="q" type="search" class="search-bar snize-input-style">
Example 2 View on Page
The ARIA role 'combobox' is not valid for the element <input>
Mode: light
<input autocomplete="off" autocapitalize="off" autocorrect="off" aria-expanded="false" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" name="q" type="search" class="search-bar snize-input-style">
Example 3 View on Page
The ARIA role 'combobox' is not valid for the element <input>
Mode: light
<input autocomplete="off" autocapitalize="off" autocorrect="off" aria-expanded="false" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" name="q" type="search" class="search-bar snize-input-style">
Example 4 View on Page
The ARIA role 'combobox' is not valid for the element <input>
Mode: light
<input autocomplete="off" autocapitalize="off" autocorrect="off" aria-expanded="false" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" name="q" type="search" class="search-bar snize-input-style">
Example 5 View on Page
The ARIA role 'combobox' is not valid for the element <input>
Mode: light
<input autocomplete="off" autocapitalize="off" autocorrect="off" aria-expanded="false" aria-autocomplete="list" aria-haspopup="listbox" role="combobox" name="q" type="search" class="search-bar snize-input-style">
1 Moderate equalAccess list_markup_review:
1 pages affected

Rule Information

Engine: equalAccess

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Verify this is a list and if so, modify to use proper HTML elements for the list
Mode: light
<h2>

🔧 Most Common Issues (AccessLint)

10 rules
936 Moderate accesslint aria/presentation-role-conflict:
68 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<div class="PwzrButtonBase-root-245 PwzrButton-root-216 PwzrButton-text-218 rio-swatch-border-double-6dbe1fc7-7ce5-4247-a091-42ce68a03206" tabindex="0" role="none" aria-disabled="false" data-option-va...
XPath: div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(1) > div > div > div > div:nth-of-type(2) > div:nth-of-type(1) > div > div > div > div:nth-of-type(2)
Example 2 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<div class="PwzrButtonBase-root-277 PwzrButton-root-248 PwzrButton-text-250 rio-swatch-border-double-84e06764-fb17-42f1-97dd-9351caec8319" tabindex="0" role="none" aria-disabled="false" data-option-va...
XPath: div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(1) > div > div > div > div:nth-of-type(2) > div:nth-of-type(2) > div > div > div > div:nth-of-type(2)
Example 3 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<div class="PwzrButtonBase-root-309 PwzrButton-root-280 PwzrButton-text-282 rio-swatch-border-double-814ccbeb-8525-4ffc-b175-01d7e3471faf" tabindex="0" role="none" aria-disabled="false" data-option-va...
XPath: div:nth-of-type(1) > div:nth-of-type(2) > div > div:nth-of-type(1) > div > div > div > div:nth-of-type(2) > div:nth-of-type(3) > div > div > div > div:nth-of-type(2)
Example 4 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<div class="PwzrButtonBase-root-341 PwzrButton-root-312 PwzrButton-text-314 rio-swatch-border-double-e0eda547-62bc-475b-82bc-843ef55d76e3" tabindex="0" role="none" aria-disabled="false" data-option-va...
XPath: div:nth-of-type(4) > div > div > div > div:nth-of-type(2)
Example 5 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<div class="PwzrButtonBase-root-373 PwzrButton-root-344 PwzrButton-text-346 rio-swatch-border-double-138e60f0-e016-40d6-8887-2dc55ded6b16" tabindex="0" role="none" aria-disabled="false" data-option-va...
XPath: div:nth-of-type(5) > div > div > div > div:nth-of-type(2)
382 Moderate accesslint text-alternatives/img-alt:
75 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Image element missing alt attribute.
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645">
XPath: a[href="/account"] > img
Example 2 View on Page
Image element missing alt attribute.
Mode: light
<img srcset="https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/180x/ 180w,https://i.shgcdn.com/a986db53-eec7-47a9-8774-b99477c663c4/-/resize/360x/ 360w,https://i.shgcdn.com/a986db53-e...
XPath: #s-858eb633-1ae4-4a92-9cd5-7a7ba2035422 > div:nth-of-type(1) > div > img
Example 3 View on Page
Image element missing alt attribute.
Mode: light
<img srcset="https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/180x/ 180w,https://i.shgcdn.com/85968a7b-bbcb-4e4f-8d02-94f6dff32565/-/resize/360x/ 360w,https://i.shgcdn.com/85968a7b-b...
XPath: #s-0772ec8f-b3d3-4309-9e90-bb81dc183a02 > div:nth-of-type(1) > div > img
Example 4 View on Page
Image element missing alt attribute.
Mode: light
<img src="//www.preserve.eco/cdn/shop/t/21/assets/account.svg?v=152161910560963363051726753645">
XPath: a[href="/account"] > img
Example 5 View on Page
Image element missing alt attribute.
Mode: light
<img src="https://cdn.shopify.com/s/files/1/2372/0029/files/bcorp-icon.PNG?6054642618249289208">
XPath: div:nth-of-type(2) > div:nth-of-type(1) > img
141 Moderate accesslint navigable/heading-order:
75 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Heading level 5 skipped from level 1. Use h2 instead.
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: div:nth-of-type(1) > h5
Example 2 View on Page
Heading level 3 skipped from level 1. Use h2 instead.
Mode: light
<h3 class="home__subtitle">Related</h3>
XPath: div > h3
Example 3 View on Page
Heading level 5 skipped from level 3. Use h4 instead.
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: div:nth-of-type(1) > div:nth-of-type(1) > h5
Example 4 View on Page
Heading level 5 skipped from level 1. Use h2 instead.
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: div:nth-of-type(1) > h5
Example 5 View on Page
Heading level 5 skipped from level 1. Use h2 instead.
Mode: light
<h5 class="uppercase">Main menu </h5>
XPath: div:nth-of-type(1) > h5
137 Moderate accesslint labels-and-names/form-label:
75 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Form element has no accessible label.
Mode: light
<input class="search-bar" type="search" name="q">
XPath: form > input[name="q"]
Example 2 View on Page
Form element has no accessible label.
Mode: light
<input class="search-bar" type="search" name="q">
XPath: form > input[name="q"]
Example 3 View on Page
Form element has no accessible label.
Mode: light
<div class="slick-track" style="opacity: 1; width: 4422px; transform: translate3d(-737px, 0px, 0px);" role="listbox"><div class="product__photo product__photo--additional slick-slide slick-cloned" dat...
XPath: #ProductPhoto-product > div > div
Example 4 View on Page
Form element has no accessible label.
Mode: light
<input class="search-bar" type="search" name="q">
XPath: form > input[name="q"]
Example 5 View on Page
Form element has no accessible label.
Mode: light
<input class="search-bar" type="search" name="q">
XPath: form > input[name="q"]
87 Moderate accesslint landmarks/region:
75 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Content is not contained within a landmark region.
Mode: light
<div class="hidden shg-lightbox"><span class="shg-lightbox-close">×</span><div class="shg-lightbox-nav shg-nav-left hidden"></div><div class="shg-lightbox-content"> <div class="shg-lightbox-image-co...
XPath: #shave-5-systems > div:nth-of-type(4)
Example 2 View on Page
Content is not contained within a landmark region.
Mode: light
<div id="AjaxifyModal" class="ajaxcart ajaxcart--modal"><button type="button" class="ajaxcart__close" title="Close Cart">Close Cart</button> <div id="AjaxifyCart" class="ajaxcart__content"></div...
XPath: #AjaxifyModal
Example 3 View on Page
Content is not contained within a landmark region.
Mode: light
<div id="AjaxifyModal" class="ajaxcart ajaxcart--modal"><button type="button" class="ajaxcart__close" title="Close Cart">Close Cart</button> <div id="AjaxifyCart" class="ajaxcart__content"></div...
XPath: #AjaxifyModal
Example 4 View on Page
Content is not contained within a landmark region.
Mode: light
<div id="AjaxifyModal" class="ajaxcart ajaxcart--modal"><button type="button" class="ajaxcart__close" title="Close Cart">Close Cart</button> <div id="AjaxifyCart" class="ajaxcart__content"></div...
XPath: #AjaxifyModal
Example 5 View on Page
Content is not contained within a landmark region.
Mode: light
<div id="AjaxifyModal" class="ajaxcart ajaxcart--modal"><button type="button" class="ajaxcart__close" title="Close Cart">Close Cart</button> <div id="AjaxifyCart" class="ajaxcart__content"></div...
XPath: #AjaxifyModal
75 Moderate accesslint readable/html-has-lang:
75 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
<html> element missing lang attribute.
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-n7-active wf-oswald-n4-active wf-opensans-i4-active wf-op...
XPath: html
Example 2 View on Page
<html> element missing lang attribute.
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-n7-active wf-oswald-n4-active wf-opensans-i4-active wf-op...
XPath: html
Example 3 View on Page
<html> element missing lang attribute.
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n7-active wf-opensans-n4-active wf-oswald-n4-active wf-opensans-i4-active wf-op...
XPath: html
Example 4 View on Page
<html> element missing lang attribute.
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-n7-active wf-opensans-i4-active wf-opensans-i7-active wf-...
XPath: html
Example 5 View on Page
<html> element missing lang attribute.
Mode: light
<html class="supports-js supports-no-touch supports-csstransforms supports-csstransforms3d supports-fontface wf-opensans-n4-active wf-opensans-i4-active wf-opensans-n7-active wf-opensans-i7-active wf-...
XPath: html
75 Moderate accesslint labels-and-names/button-name:
75 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Button has no discernible text.
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: form > button
Example 2 View on Page
Button has no discernible text.
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: form > button
Example 3 View on Page
Button has no discernible text.
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: form > button
Example 4 View on Page
Button has no discernible text.
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: form > button
Example 5 View on Page
Button has no discernible text.
Mode: light
<button type="submit" class="btn search-btn"></button>
XPath: form > button
62 Moderate accesslint labels-and-names/aria-input-field-name:
62 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
ARIA input field has no accessible name.
Mode: light
<div class="slick-track" style="opacity: 1; width: 4422px; transform: translate3d(-737px, 0px, 0px);" role="listbox"><div class="product__photo product__photo--additional slick-slide slick-cloned" dat...
XPath: #ProductPhoto-product > div > div
Example 2 View on Page
ARIA input field has no accessible name.
Mode: light
<div class="slick-track" style="opacity: 1; width: 4422px; transform: translate3d(-737px, 0px, 0px);" role="listbox"><div class="product__photo product__photo--additional slick-slide slick-cloned" dat...
XPath: #ProductPhoto-product > div > div
Example 3 View on Page
ARIA input field has no accessible name.
Mode: light
<div class="slick-track" style="opacity: 1; width: 3685px; transform: translate3d(-737px, 0px, 0px);" role="listbox"><div class="product__photo product__photo--additional slick-slide slick-cloned" dat...
XPath: #ProductPhoto-product > div > div
Example 4 View on Page
ARIA input field has no accessible name.
Mode: light
<div class="slick-track" style="opacity: 1; width: 5159px; transform: translate3d(-737px, 0px, 0px);" role="listbox"><div class="product__photo product__photo--additional slick-slide slick-cloned" dat...
XPath: #ProductPhoto-product > div > div
Example 5 View on Page
ARIA input field has no accessible name.
Mode: light
<div class="slick-track" style="opacity: 1; width: 19899px; transform: translate3d(-737px, 0px, 0px);" role="listbox"><div class="product__photo product__photo--additional slick-slide slick-cloned" da...
XPath: #ProductPhoto-product > div > div
6 Moderate accesslint distinguishable/color-contrast:
4 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Insufficient color contrast ratio of 4.37:1 (required 4.5:1).
Mode: light
<span style="color: rgb(0, 125, 204);">Our summer sale is here! <strong>30% off</strong> almost everything. Now through 8/9. Enter <strong>SUMMER30</strong> at checkout.</span>
XPath: p:nth-of-type(1) > span
Example 2 View on Page
Insufficient color contrast ratio of 4.37:1 (required 4.5:1).
Mode: light
<strong>30% off</strong>
XPath: span > strong:nth-of-type(1)
Example 3 View on Page
Insufficient color contrast ratio of 4.37:1 (required 4.5:1).
Mode: light
<strong>SUMMER30</strong>
XPath: span > strong:nth-of-type(2)
Example 4 View on Page
Insufficient color contrast ratio of 4.28:1 (required 4.5:1).
Mode: light
<a href="https://www.preserveproducts.com/explore/preserve-compostables" style="box-sizing: border-box; color: #0280c6;">here</a>
XPath: p:nth-of-type(2) > a[href="https://www.preserveproducts.com/explore/preserve-compostables"]
Example 5 View on Page
Insufficient color contrast ratio of 1.96:1 (required 4.5:1).
Mode: light
<span id="AddToCartText-product">Out of Stock</span>
XPath: #AddToCartText-product

🔧 Most Common Issues (QualWeb)

9 rules
75 Moderate qualweb QW-ACT-R2:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The `lang` attribute doesn't exist or is empty ('').
Mode: light
Example 2 View on Page
The `lang` attribute doesn't exist or is empty ('').
Mode: light
Example 3 View on Page
The `lang` attribute doesn't exist or is empty ('').
Mode: light
Example 4 View on Page
The `lang` attribute doesn't exist or is empty ('').
Mode: light
Example 5 View on Page
The `lang` attribute doesn't exist or is empty ('').
Mode: light
75 Moderate qualweb QW-ACT-R11:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 2 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 3 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 4 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 5 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
75 Moderate qualweb QW-ACT-R12:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 2 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 3 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 4 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
Example 5 View on Page
The test target doesn't have an accessible name, or it's empty ('').
Mode: light
75 Moderate qualweb QW-ACT-R28:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The test target has unlisted required states or properties.
Mode: light
Example 2 View on Page
The test target has unlisted required states or properties.
Mode: light
Example 3 View on Page
The test target has unlisted required states or properties.
Mode: light
Example 4 View on Page
The test target has unlisted required states or properties.
Mode: light
Example 5 View on Page
The test target has unlisted required states or properties.
Mode: light
75 Moderate qualweb QW-ACT-R16:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The test target accessible name doesn't exist or it's empty ('').
Mode: light
Example 2 View on Page
The test target accessible name doesn't exist or it's empty ('').
Mode: light
Example 3 View on Page
The test target accessible name doesn't exist or it's empty ('').
Mode: light
Example 4 View on Page
The test target accessible name doesn't exist or it's empty ('').
Mode: light
Example 5 View on Page
The test target accessible name doesn't exist or it's empty ('').
Mode: light
75 Moderate qualweb QW-ACT-R17:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The test target doesn't have an accessible name.
Mode: light
Example 2 View on Page
The test target doesn't have an accessible name.
Mode: light
Example 3 View on Page
The test target doesn't have an accessible name.
Mode: light
Example 4 View on Page
The test target doesn't have an accessible name.
Mode: light
Example 5 View on Page
The test target doesn't have an accessible name.
Mode: light
75 Moderate qualweb QW-ACT-R37:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 2 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 3 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 4 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 5 View on Page
Element has contrast ratio lower than minimum.
Mode: light
75 Moderate qualweb QW-ACT-R76:
75 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 2 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 3 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 4 View on Page
Element has contrast ratio lower than minimum.
Mode: light
Example 5 View on Page
Element has contrast ratio lower than minimum.
Mode: light
68 Moderate qualweb QW-ACT-R48:
68 pages affected

Rule Information

Engine: qualweb

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
The test target is in the accessibility tree.
Mode: light
Example 2 View on Page
The test target is in the accessibility tree.
Mode: light
Example 3 View on Page
The test target is in the accessibility tree.
Mode: light
Example 4 View on Page
The test target is in the accessibility tree.
Mode: light
Example 5 View on Page
The test target is in the accessibility tree.
Mode: light