Public accessibility assessment

Accessibility issues detected on blackopalbeauty.com

Evolize inspected 5 public pages on blackopalbeauty.com and detected 59 automatically identifiable accessibility findings.

59Findings detected
10WCAG criteria affected
5Pages inspected
8 Sep 2026Assessment date

Highest detected severity: Critical · 41 high-priority findings · 100% inspected-page coverage

Most widespread issueLinks lack accessible textDetected on 5 inspected pages
Most affected page/cart34 findings detected
Most represented WCAG criterionWCAG 2.4.4 — Link Purpose (In Context)25 detected findings

Is blackopalbeauty.com your website?

Keep this assessment current and get notified when new accessibility issues are detected.

https://

Not your website? Scan your own site →

01 · Accessibility summary

Evolize inspected 5 public pages on blackopalbeauty.com and detected 59 accessibility findings. The most widespread issue was "Links lack accessible text", detected on 5 inspected pages. The most affected inspected page was "/cart", where 34 findings were detected. The assessment identified findings mapped to 10 WCAG success criterions. The sections below prioritize the broadest issues and provide technical evidence for each detected finding.

02 · Start here

These findings combine the highest severity and broadest reach detected during this assessment.

  1. Critical

    Links lack accessible text

    WCAG 2.4.4 (A) · 1 inspected page · 1 instance
    Why this matters

    Links expose no accessible name, so screen-reader users cannot determine their destination.

    Recommended action

    This link exposes no accessible text. Add visible text that identifies its destination, or remove the link if it serves no purpose. For an icon-only link, provide an aria-label describing where it goes. The link points to https://www.instagram.com/blackopalbeauty/.

    View technical evidence →
  2. Critical

    Links lack accessible text

    WCAG 2.4.4 (A) · 1 inspected page · 1 instance
    Why this matters

    Links expose no accessible name, so screen-reader users cannot determine their destination.

    Recommended action

    This link exposes no accessible text. Add visible text that identifies its destination, or remove the link if it serves no purpose. For an icon-only link, provide an aria-label describing where it goes. The link points to https://www.instagram.com/blackopalbeauty/.

    View technical evidence →
  3. Critical

    Links lack accessible text

    WCAG 2.4.4 (A) · 1 inspected page · 1 instance
    Why this matters

    Links expose no accessible name, so screen-reader users cannot determine their destination.

    Recommended action

    This link exposes no accessible text. Add visible text that identifies its destination, or remove the link if it serves no purpose. For an icon-only link, provide an aria-label describing where it goes. The link points to https://www.facebook.com/blackopalbeauty/.

    View technical evidence →
  4. Critical

    Links lack accessible text

    WCAG 2.4.4 (A) · 1 inspected page · 1 instance
    Why this matters

    Links expose no accessible name, so screen-reader users cannot determine their destination.

    Recommended action

    This link exposes no accessible text. Add visible text that identifies its destination, or remove the link if it serves no purpose. For an icon-only link, provide an aria-label describing where it goes. The link points to https://www.youtube.com/channel/UCI8CgPqYSlMhisPyzP3svew.

    View technical evidence →
  5. Critical

    Links lack accessible text

    WCAG 2.4.4 (A) · 1 inspected page · 1 instance
    Why this matters

    Links expose no accessible name, so screen-reader users cannot determine their destination.

    Recommended action

    This link exposes no accessible text. Add visible text that identifies its destination, or remove the link if it serves no purpose. For an icon-only link, provide an aria-label describing where it goes. The link points to https://www.tiktok.com/@blackopalbeauty?lang=en.

    View technical evidence →

03 · WCAG criteria affected

CriterionNameLevelFindingsPagesReach
2.4.4Link Purpose (In Context)A2555 / 5
1.4.3Contrast (Minimum)AA1055 / 5
4.1.2Name, Role, ValueA755 / 5
2.1.1KeyboardA555 / 5
2.4.3Focus OrderA555 / 5
1.3.1Info and RelationshipsA455 / 5
1.1.1Non-text ContentA255 / 5
1.2.2Captions (Prerecorded)A122 / 5
2.2.2Pause, Stop, HideA122 / 5
3.3.2Labels or InstructionsA155 / 5

Absence of a criterion here does not indicate conformance with it — only that no automatically detectable issue was found for it.

Continuous monitoring

A scan shows today's exposure. Monitoring shows what changes next.

Evolize continuously reassesses public website pages, detects newly introduced or recurring accessibility findings, and tracks remediation over time.

04 · All detected findings

High

IDs used in ARIA and labels must be unique

WCAG 4.1.2 (A)23 instances5 inspected pages

IDs used in ARIA and labels must be unique

Why it matters

IDs used in ARIA and labels must be unique

Recommended correction

Review the affected element and correct the reported accessibility issue.

View 23 affected elements
Component · Ref DUSYGA
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element.logo-center > .title.clearfix[role="banner"] > .x-menu[data-js-class="XMenu"][data-x-menu--align="center"] > .x-menu--level-1--container > .x-menu--level-1--link[data-link-id="skincare"][data-x-menu--depth="2"] > .x-menu--level-2--container
Accessible nameShop all Oil Control Even Tone Shaving
Markup
<div class="x-menu--level-2--container" id="x-menu--sub-skincare">
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref 8HRIXZ
Affected pagehttps://blackopalbeauty.com/pages/register
Element.promoSlide > .splide__track
Accessible nameFree Shipping With a $35+ Purchase Free Shipping With a $35+ Purchase Free Shipping With a $35+ Purchase Free Shipping With a $35+ Purchase Free Shipping With a $35+ Purchase
Markup
<div class="splide__track" id="splide01-track" style="padding-left: 0px; padding-right: 0px;">
Affected pages/ /account/login /pages/contact-us /pages/register
Component · Ref OP41KM
Affected pagehttps://blackopalbeauty.com/pages/register
Element#create_customer > div:nth-child(5)
Accessible nameEmail
Markup
<div id="email">
				<label for="email" class="label font--accent">Email</label>
				<input type="email" value="" name="customer[email]" id="email" class="text" size="30" required="">
			</div>
High

Hidden elements can still receive keyboard focus

WCAG 2.4.3 (A)50 instances5 inspected pages

An element is not visible but remains in the tab order, so a sighted keyboard user loses track of focus when it lands there.

Why it matters

An element is not visible but remains in the tab order, so a sighted keyboard user loses track of focus when it lands there.

Recommended correction

Keep this element out of the tab order while its containing region is hidden — remove it from focus (for example tabindex="-1"), or apply the inert attribute to the hidden container where supported. Restore normal focusability when the region becomes visible.

View 50 affected elements
Component · Ref 9O05AF
Affected pagehttps://blackopalbeauty.com/pages/register
Elementul#y-menu--sub-shop > li:nth-of-type(3) > ul > li:nth-of-type(1) > a
Accessible nameBack
Markup
<a href="/collections/all-products">
                        <svg class="fw--icon fw--icon--chevron-left">
  <use xlink:href="#fw--icon--chevron-left"></use>
</svg>
 Back
                      </a>
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref OSS3W0
Affected pagehttps://blackopalbeauty.com/pages/register
Elementul#y-menu--sub-shop > li:nth-of-type(3) > a
Accessible nameShop All
Markup
<a href="/collections/all-products">Shop All</a>
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref QTUVBQ
Affected pagehttps://blackopalbeauty.com/pages/contact-us
Elementdiv#sticky_gift_icon > a
Accessible name0
Markup
<a href="javascript:void(0)">
    <span style="background-size: 30px;background-repeat: no-repeat;background-position: center; background-color:#ffffff">
        <svg class="showGifts" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
            <g>
                <g>
                    <path d="M32,271.692v192c0,17.664,14.368,32,32,32h160v-224H32z"></path>
                </g>
            </g>
            <g>
                <g>
      …
Affected pages/ /account/login /cart /pages/contact-us /pages/register
High

Interactive controls are not keyboard-accessible

WCAG 2.1.1 (A)54 instances5 inspected pages

A control that responds to clicks (a clickable element or an ARIA widget) cannot receive keyboard focus, so keyboard and switch users cannot operate it.

Why it matters

A control that responds to clicks (a clickable element or an ARIA widget) cannot receive keyboard focus, so keyboard and switch users cannot operate it.

Recommended correction

Use a native <button>/<a>, or add tabindex="0" plus keyboard event handlers (Enter/Space) to custom controls.

View 54 affected elements
Component · Ref 7417EH
Affected pagehttps://blackopalbeauty.com/
Elementdiv#x-menu--sub-shop > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1)
Accessible nameBest Sellers
Markup
<div class="imageTextInNav" onclick="location.href='/collections/feature-makeup';" style="cursor:pointer !important;">
                        <div class="image">
                          <img class="image-in-groupped-row-nav" src="//blackopalbeauty.com/cdn/shop/files/FoundationsHeader_3.png?v=1736540971&amp;width=500">
                        </div>
                        <p class="infoINBlock">Best Sellers</p>
                      </div>
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref 8CF6M1
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Elementdiv#shopify-section-homepage_hero_banner_QkViab > div > div > img:nth-of-type(2)
Markup
<img width="1700" onclick="window.location.href='/products/blk-opl-lip-oil';" class="image-cover-hero-b mobile" height="650" alt="home page hero banner image" src="//blackopalbeauty.com/cdn/shop/files/2_5_1.png?v=1781862922" loading="eager">
Affected pages/ /cart
Component · Ref 5WL64S
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Elementdiv#shopify-section-homepage_hero_banner_QkViab > div > div > img:nth-of-type(1)
Markup
<img width="1700" onclick="window.location.href='/products/blk-opl-lip-oil';" class="image-cover-hero-b desktop" height="650" alt="home page hero banner image" src="//blackopalbeauty.com/cdn/shop/files/1_5_1.png?v=1781862924" loading="eager">
Affected pages/ /cart
Component · Ref IMZC60
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Elementli#splide02-clone04
Accessible namefoundations
Markup
<li class="splide__slide splide__slide--clone" onclick="location.href='/collections/foundations-primers'" id="splide02-clone04" style="width: calc(16.6667%);" aria-hidden="true">
                      <div class="splide-blocks-collections">
                        <div class="img-block-insplider-coll">
                          <img loading="eager" src="//blackopalbeauty.com/cdn/shop/files/24_BLK_OPL_True_Color_Skin_Perfecting_Stick_Foundation_SPF_15_Java_Dream_1000x_1.png?v=1725015199" alt="collection image" class="blockImageInColSliderSplide">
                        </div>
                 …
Affected pages/ /cart
High

Page has no main landmark

WCAG 1.3.1 (A)5 instances5 inspected pages

No <main> or role=main region is present, so screen reader users cannot jump to primary content.

Why it matters

No <main> or role=main region is present, so screen reader users cannot jump to primary content.

Recommended correction

Wrap the primary content in a single <main> element or role=main region.

View 5 affected elements
Component · Ref KASDFU
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Elementhtml > body
Accessible namePress Alt+1 for screen-reader mode, Alt+0 to cancelAccessibility Screen-Reader Guide, Feedback, and Issue Reporting | New window 0 var sm_translations_labels = {"gift_already_in_cart":"Gift GIFT_NAME already in cart","remove_from_cart":"Remove from cart?","add_to_cart":"Add to cart","add_product_to_cart_and_get_gift":"Add PRODUCT_NAME to cart and get free gift","pick_free_gift_for_product":"You can pick free gift for PRODUCT_NAME","buy_for_more_and_get_gift":"If you spend ORDER_MINIMUM (TO_SPEND more), you will get free gift","pick_free_gift_for_order":"You spend more then ORDER_MINIMUM, pick your free gift","active_until":"active until UNTIL_DATE","gift_cart_property_label":"Free gift: 100% off"}; var sm_desing_settings = {"selectedGiftIcon":"1","giftIconColor":{"hue":0,"saturation":0.0125000000000000006938893903907228377647697925567626953125,"brightness":0.0343750000000000444089209850062616169452667236328125,"alpha":1},"giftIconTextValue":"Free Gift","selectedGiftBoxPosition":"1","backgroundColorOfGiftBox":{"hue":1,"saturation":0,"brightness":1},"hideGiftBox":0}; var sm_products_gifts = []; var sm_orders_gifts = [{"id":204,"order_minimum":"1.00","startDate":"2020-05-06","endDate":"2020-05-11","automaticallyAddToCart":"1","gifts":[{"id_gift":"4532847968291","url":"color-splurge-risque-matte-lipstick-1","original_url":"color-splurge-risque-matte-lipstick"}]}]; var sm_money_format="$@@amount&&"; if (window.location.pathname == '/collections/all') { window.location.replace('/collections/all-products'); } var sm_is_cart_page = false; #gift_container, #gift_container .giftContainerContent, #smProductDetailGiftWrapper { all: unset; } #gift_container .giftContainerContent *, #smProductDetailGiftWrapper * { all: unset; } #sticky_gift_icon.stickyGartRight { right: 20px; bottom: 20px; } #sticky_gift_icon { position: fixed; bottom: 200px; right: 15px; z-index: 9999; } #sticky_gift_icon a { text-decoration: none; font-size: 20px; color: #34495e; } #sticky_gift_icon span { display: block; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; background-color: rgba(255,255,255,.9); -webkit-box-shadow: 1px 1px 5px grey; -moz-box-shadow: 1px 1px 5px grey; box-shadow: 1px 1px 5px grey; padding: 10px; width: 40px; height: 40px; margin: 0 auto; line-height: 40px !important; text-align: center; position: relative; box-sizing: content-box !important; z-index: 1; } #sticky_gift_icon mark { -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; border: 2px solid #FFF; width: 20px; height: 20px; background-color: #FF6B6B; position: absolute; top: -5px; left: -10px; font-size: 10px; line-height: 20px; font-family: Roboto,sans-serif; color: #FFF; font-weight: 700; box-sizing: content-box !important; } #sticky_gift_icon svg.showGifts { height: 30px; width: 30px; margin-top: 3px; } #sticky_gift_icon svg.hideGifts { height: 25px; width: 25px; margin-top: 8px; display: none; } #gift_container { color:black; position: fixed; z-index: 9999999; bottom: 95px; right: 20px; max-height: 80%; overflow-y: scroll; overflow-x: hidden; -webkit-box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px, rgb(0, 0, 0) 0px 5px 0px 0px inset !important; -moz-box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px, rgb(0, 0, 0) 0px 5px 0px 0px inset !important; box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px, rgb(0, 0, 0) 0px 5px 0px 0px inset !important; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; font-size: 13px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; } #gift_container .giftContainerContent { float: right; background: white; width: 320px; position: relative; padding: 10px 10px 0px 10px; display:none; } #gift_container .giftContainerContent .giftWrapper { color: black; padding: 5px; margin: 0px 0px 10px; background:rgb(255, 255, 255) none repeat scroll 0% 0%; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 15px 0px, rgba(0, 0, 0, 0.1) 0px 1px 2px 0px; -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 15px 0px, rgba(0, 0, 0, 0.1) 0px 1px 2px 0px; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 15px 0px, rgba(0, 0, 0, 0.1) 0px 1px 2px 0px; position: relative; display: block; } #gift_container .giftContainerContent .orderGiftsTitle, #gift_container .giftContainerContent .productsToOfferGiftsTitle { text-align: center; padding: 5px; margin: 0 auto; font-weight: bold; display: block; border-bottom: 1px solid gray; width: 95%; } #gift_container .giftContainerContent ul { display: inline; } #gift_container .giftContainerContent li{ padding: 10px 20px; display: block; } #gift_container .giftContainerContent li img{ width: 22%; float: left; display: block; } #gift_container .giftContainerContent .smItems{ width: 70%; display: block; float: left; margin-left: 5%; } #gift_container .giftContainerContent .giftWrapper a { display: inline; cursor: pointer; text-decoration: underline; } #gift_container .giftContainerContent .smAddGiftToCart { padding: 4px 10px; margin-top: 4px; background:rgba(168, 168, 168, 0.46) none repeat scroll 0% 0%; border-radius: 2px; position: relative; display: block; font-weight: bold; cursor: pointer; } #gift_container .giftContainerContent .giftAlreadyInCart { padding: 5px 20px; display: block; text-align: center; } #gift_container .giftContainerContent .giftAlreadyInCart a { font-weight: bold; } #gift_container .giftContainerContent .removeFromCart { display: block; margin-top: 10px; cursor: pointer; text-decoration: underline; } #gift_container .giftContainerContent .item-variants select { display: block; color: #444; padding: .3em 1.0em .3em .3em; width: 100%; max-width: 100%; box-sizing: border-box; margin-top: 2px; border: 1px solid #aaa; -moz-border-radius: .2em; -webkit-border-radius: .2em; border-radius: .2em; -moz-appearance: none; -webkit-appearance: none; appearance: none; background-color: #fff; background-image: url('data:image/svg+xml;charset=US-ASCII,<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="292.362px" height="292.362px" viewBox="0 0 292.362 292.362" style="enable-background:new 0 0 292.362 292.362;" xml:space="preserve"><g> <path d="M286.935,69.377c-3.614-3.617-7.898-5.424-12.848-5.424H18.274c-4.952,0-9.233,1.807-12.85,5.424 C1.807,72.998,0,77.279,0,82.228c0,4.948,1.807,9.229,5.424,12.847l127.907,127.907c3.621,3.617,7.902,5.428,12.85,5.428 s9.233-1.811,12.847-5.428L286.935,95.074c3.613-3.617,5.427-7.898,5.427-12.847C292.362,77.279,290.548,72.998,286.935,69.377z"/></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g…[truncated by Evolize: exceeded D1 value limit]
Markup
<body data-id="" class="page-blk-opl-makeup-and-skincare-for-melanin-rich-skin template-index klaviyo-prevent-body-scrolling"><span role="alert" data-acsb-sr-alert="true" data-acsb-sr-only="true" class="acsb-sr-alert acsb-sr-only" data-acsb-force-visible="true" style="position: absolute; width: 200px; height: 1px; margin-top: -1px; z-index: -1; border: 0px; top: 0px; left: 0px; overflow: hidden; outline: 0px;">Press Alt+1 for screen-reader mode, Alt+0 to cancel</span><access-widget-ui data-acsb="" class="notranslate"></access-widget-ui><a href="https://accessibe.com/blog/knowledgebase/screen-r…
Affected pages/ /account/login /cart /pages/contact-us /pages/register
High

Modal dialog does not trap keyboard focus

WCAG 2.4.3 (A)8 instances5 inspected pages

An open modal leaves the content behind it keyboard-focusable, so keyboard and screen reader users can tab out of the dialog into hidden page content.

Why it matters

An open modal leaves the content behind it keyboard-focusable, so keyboard and screen reader users can tab out of the dialog into hidden page content.

Recommended correction

While a modal is open, confine focus to the dialog and mark the rest of the page inert (or aria-hidden). Restore focus on close.

View 8 affected elements
Component · Ref 5CH9H8
Affected pagehttps://blackopalbeauty.com/pages/contact-us
Elementhtml > body > div:nth-of-type(23) > div > div:nth-of-type(2)
Accessible namePOPUP Form
Roledialog
Markup
<div role="dialog" aria-modal="true" aria-label="POPUP Form" class="needsclick  kl-private-reset-css-Xuajs1" data-kl-scroll-locking-modal="true" style="display: flex; z-index: 90000; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; justify-content: center; align-items: center; overflow: clip auto; background-color: rgba(20, 20, 20, 0.6); animation-timing-function: ease; animation-play-state: running; animation-iteration-count: 1; animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 0.35s; animation-name: klaviyo-fadein;"><div class="needsclick  kl-private-res…
Affected pages/ /account/login /cart /pages/contact-us
Component · Ref 1IHC2V
Affected pagehttps://blackopalbeauty.com/account/login
Elementdiv#rebuy-cart
Accessible nameYour Cart
Roledialog
Markup
<div id="rebuy-cart" role="dialog" aria-modal="true" aria-labelledby="SmartCart_title" aria-hidden="true" class="rebuy-cart currency-USD"><div class="rebuy-cart__flyout"><div class="rebuy-cart__flyout-header"><div><h2 id="SmartCart_title" class="rebuy-cart__flyout-title">
                Your Cart
            </h2></div> <button type="button" aria-label="Close Cart" class="rebuy-cart__flyout-close"><i aria-hidden="true" class="fal fa-times"></i></button></div> <div class="rebuy-cart__flyout-body"><!----> <div class="rebuy-cart__progress-bar-container above"><div><div class="rebuy-cart__progres…
Affected pages/ /account/login /pages/contact-us /pages/register
High

Form fields use placeholder text as the only label

WCAG 1.3.1 (A)5 instances5 inspected pages

Fields rely on placeholder text instead of a real label. The placeholder disappears once the user types, and it is not exposed as a programmatic label.

Why it matters

Fields rely on placeholder text instead of a real label. The placeholder disappears once the user types, and it is not exposed as a programmatic label.

Recommended correction

Add a persistent <label> associated with each field. Keep the placeholder for example text only, not as the label.

View 5 affected elements
Component · Ref Z4BUAA
Affected pagehttps://blackopalbeauty.com/pages/register
Elementbody > div:nth-of-type(12) > div:nth-of-type(2) > div > div:nth-of-type(1) > input
Markup
<input class="search--textbox font--lowercase-accent" name="q" type="text" value="" placeholder="Start typing to search store" autocomplete="off">
Affected pages/ /account/login /cart /pages/contact-us /pages/register
High

Images lack text alternatives

WCAG 1.1.1 (A)7 instances5 inspected pages

Informative images have no alternative text, so their meaning is unavailable to people using assistive technology.

Why it matters

Informative images have no alternative text, so their meaning is unavailable to people using assistive technology.

Recommended correction

Add a concise alt attribute describing each informative image. Mark purely decorative images with alt="" so assistive technology skips them.

View 7 affected elements
Component · Ref 9USJA3
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element.footer-logo-block > img
Markup
<img src="//blackopalbeauty.com/cdn/shop/files/BLKOPL_LOGO.png?v=1725046201">
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref 4AVZ7D
Affected pagehttps://blackopalbeauty.com/
Elementimg[border="0"]
Markup
<img src="https://arttrk.com/pixel/?ad_log=referer&amp;action=content&amp;pixid=a4e8529c-7509-41c8-b943-50ef1b5e442e" width="1" height="1" border="0">
Affected pages/ /cart
High

ARIA hidden element must not be focusable or contain focusable elements

WCAG 4.1.2 (A)4 instances4 inspected pages

ARIA hidden element must not be focusable or contain focusable elements

Why it matters

ARIA hidden element must not be focusable or contain focusable elements

Recommended correction

Review the affected element and correct the reported accessibility issue.

View 4 affected elements
Component · Ref FX302V
Affected pagehttps://blackopalbeauty.com/pages/register
Element#rebuy-cart
Accessible nameYour Cart
Roledialog
Markup
<div id="rebuy-cart" role="dialog" aria-modal="true" aria-labelledby="SmartCart_title" aria-hidden="true" class="rebuy-cart currency-USD">
Affected pages/ /account/login /pages/contact-us /pages/register
Medium

ARIA attributes have invalid values

WCAG 4.1.2 (A)30 instances5 inspected pages

ARIA attributes reference ids that do not exist or hold invalid values, breaking the accessibility tree.

Why it matters

ARIA attributes reference ids that do not exist or hold invalid values, breaking the accessibility tree.

Recommended correction

Correct ARIA attribute values and ensure referenced ids exist in the DOM.

View 30 affected elements
Component · Ref B82XJA
Affected pagehttps://blackopalbeauty.com/pages/contact-us
Elementli[data-y-menu--depth="3"] > a[aria-controls="y-menu--sub-shop"][data-submenu="true"][href$="all-products"]
Accessible nameSHOP + -
Markup
<a href="/collections/all-products" data-submenu="true" aria-haspopup="true" aria-expanded="false" aria-controls="y-menu--sub-shop">
            SHOP
         <span class="plusOpenMenu absoluteRight">+</span>
            <span class="minusCloseMenu absoluteRight">-</span>
          </a>
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref A80MKW
Affected pagehttps://blackopalbeauty.com/account/login
Element.y-menu--level-1--link[data-y-menu--depth="2"][data-link-id="blk-tlk"] > a[aria-controls="y-menu--sub-blk-tlk"][href$="about-new"][data-submenu="true"]
Accessible nameBLK/TLK + -
Markup
<a href="/pages/about-new" data-submenu="true" aria-haspopup="true" aria-expanded="false" aria-controls="y-menu--sub-blk-tlk">
            BLK/TLK
         <span class="plusOpenMenu absoluteRight">+</span>
            <span class="minusCloseMenu absoluteRight">-</span>
          </a>
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref AC2QPY
Affected pagehttps://blackopalbeauty.com/
Element.logo-center > .title.clearfix[role="banner"] > .x-menu[data-js-class="XMenu"][data-x-menu--align="center"] > .x-menu--level-1--container > .x-menu--level-1--link[data-link-id="blk-tlk"][data-x-menu--depth="2"] > a[aria-controls="x-menu--sub-blk-tlk"][href$="about-new"][aria-haspopup="true"]
Accessible nameBLK/TLK
Markup
<a href="/pages/about-new" aria-haspopup="true" aria-expanded="false" aria-controls="x-menu--sub-blk-tlk">
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Medium

Text has insufficient colour contrast

WCAG 1.4.3 (AA)32 instances5 inspected pages

Text and background colours do not meet the minimum contrast ratio, reducing legibility.

Why it matters

Text and background colours do not meet the minimum contrast ratio, reducing legibility.

Recommended correction

Increase the contrast ratio to at least 4.5:1 for normal text and 3:1 for large text.

View 32 affected elements
Component · Ref BSUU7T
Affected pagehttps://blackopalbeauty.com/account/login
Element.cart-count
Accessible name0
Markup
<div class=" cart-count hidden">0</div>
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Component · Ref ZG1H2S
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element.img-video-pos-change > .even-block-left.evenSide > .text-info-holder-in-blocks > .textTitlePropInBlock > p:nth-child(1) > strong
Accessible nameReal Skin
Markup
<strong>Real Skin</strong>
Affected pages/ /cart
Component · Ref BVSDUT
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element#shopify-section-even_blocks_homepage_Nxiymt > .image-video-text-block-parent > .image-video-text-block-holder > .image-video-text-block-el > .even-block-left.evenSide > .text-info-holder-in-blocks > .textTitlePropInBlock > p:nth-child(1) > strong
Accessible nameBLACK-OWNED
Markup
<strong>BLACK-OWNED</strong>
Affected pages/ /cart
Component · Ref Y9T2EU
Affected pagehttps://blackopalbeauty.com/pages/contact-us
Element.is-visible.is-active.splide__slide > .text
Accessible nameFree Shipping With a $35+ Purchase
Markup
<span class="text">Free Shipping With a $35+ Purchase</span>
Affected pages/ /account/login /pages/contact-us /pages/register
Component · Ref 62MQDD
Affected pagehttps://blackopalbeauty.com/
Element#splide02-slide05 > .splide-blocks-collections > .colInfoInsplider
Accessible namepowders
Markup
<h4 class="colInfoInsplider">powders</h4>
Affected pages/ /cart
Component · Ref LLUGR4
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element#rich-text-01KVDEQ0A7VCPHXQV98BCGCPFQ > p > .ql-font-poppins
Accessible nameSave on your first order. Easy beauty, real results
Markup
<span style="font-size: 16px; color: rgb(55, 63, 71); font-family: Futura, Arial, 'Helvetica Neue', Helvetica, sans-serif; font-weight: 500; font-style: normal;" class="ql-font-poppins">S<span style="font-size: 14px;">ave on your first order. Easy beauty, real results</span></span>
Component · Ref M09QCX
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element.go3084683874
Accessible nameContinue
Markup
<button type="button" tabindex="0" data-action-id="01KVDEQ07XM543FNH1NH8CNNS7" class="needsclick go3084683874 go4033861592 klaviyo-form-button kl-private-reset-css-Xuajs1">Continue</button>
Component · Ref BU3WUE
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element.ql-font-poppins > span
Accessible nameave on your first order. Easy beauty, real results
Markup
<span style="font-size: 14px;">ave on your first order. Easy beauty, real results</span>
Component · Ref T3F5Z5
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element#email_01KVDEQ0AESKXPTNPW6M4XBJZS
Accessible nameEmail
Markup
<input id="email_01KVDEQ0AESKXPTNPW6M4XBJZS" type="email" autocomplete="email" name="email" tabindex="0" placeholder="Email" aria-label="Email" aria-required="true" aria-invalid="false" options="[object Object]" class="needsclick go3003813273 kl-private-reset-css-Xuajs1">
Component · Ref VGJCE9
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Element#splide01-slide01 > .text
Accessible nameFree Shipping With a $35+ Purchase
Markup
<span class="text">Free Shipping With a $35+ Purchase</span>
Medium

Content sits outside any landmark region

WCAG 1.3.1 (A)5 instances5 inspected pages

Meaningful content is not contained in a landmark (header/nav/main/footer/aside), so assistive-technology users cannot reach it via landmark navigation.

Why it matters

Meaningful content is not contained in a landmark (header/nav/main/footer/aside), so assistive-technology users cannot reach it via landmark navigation.

Recommended correction

Wrap primary content in <main> and other regions in appropriate landmark elements.

View 5 affected elements
Component · Ref N59GX6
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Elementli#splide01-clone01
Accessible nameFree Shipping With a $35+ Purchase
Markup
<li class="splide__slide splide__slide--clone is-active" id="splide01-clone01" style="width: calc(100%);" aria-hidden="true">
                    
        <span class="text">Free Shipping With a $35+ Purchase</span>
      
            </li>
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Medium

Navigation regions are not distinguishable

WCAG 1.3.1 (A)5 instances5 inspected pages

The page has multiple navigation landmarks but they lack accessible names, so screen reader users cannot tell them apart.

Why it matters

The page has multiple navigation landmarks but they lack accessible names, so screen reader users cannot tell them apart.

Recommended correction

Give each navigation region a distinct aria-label (e.g. "Primary", "Footer") when more than one is present.

View 5 affected elements
Component · Ref OCMEFF
Affected pagehttps://blackopalbeauty.com/pages/register
Elementhtml > body > div:nth-of-type(11) > div:nth-of-type(3) > div:nth-of-type(2) > nav
Accessible nameSHOP + - Back SHOP Shop All Back Shop All Foundations Concealers Powders Eyes Lips & Cheeks Last Call TRENDING SKINCARE + - Back SKINCARE Shop all Oil Control Even Tone Shaving Gift Cards Returns & Exchanges BLK/TLK + - Back BLK/TLK Our Story STORE LOCATOR REWARDS
Markup
<nav class="y-menu" data-js-class="FrameworkYMenu" data-js-loaded="true">
  <ul class="y-menu--level-1--container">

    
    
    

      <li class="y-menu--level-1--link font--accent" data-y-menu--depth="3" data-y-menu--open="false" data-link-id="shop">

        
          <a href="/collections/all-products" data-submenu="true" aria-haspopup="true" aria-expanded="false" aria-controls="y-menu--sub-shop">
            SHOP
         <span class="plusOpenMenu absoluteRight">+</span>
            <span class="minusCloseMenu absoluteRight">-</span>
          </a>
        

          
          
    …
Affected pages/ /account/login /cart /pages/contact-us /pages/register
Low

Video may be missing captions

WCAG 1.2.2 (A)40 instances2 inspected pages

A video element has no captions or subtitles track. Whether captions are needed depends on the audio content and requires manual review.

Why it matters

A video element has no captions or subtitles track. Whether captions are needed depends on the audio content and requires manual review.

Recommended correction

Provide a synchronized captions track (<track kind="captions">) for video with meaningful audio.

View 40 affected elements
Component · Ref JZQA6H
Affected pagehttps://blackopalbeauty.com/?viewcart=true
Elementvideo#video-18128456602643903-insta-feed
Markup
<video class=" " muted="" loop="" playsinline="" id="video-18128456602643903-insta-feed" preload="none" src="https://scontent.cdninstagram.com/o1/v/t2/f2/m86/AQPdQSJnp3gNA3PmEma9APbmXKg4PCBuwbjfWU5NLSsZF4CDzG-5wIxyPkAd8yuOMRot9YrncgdSTKFqXwcBGxgLuiXq1UkHO20xiCw.mp4?_nc_cat=104&amp;_nc_sid=5e9851&amp;_nc_ht=scontent.cdninstagram.com&amp;_nc_ohc=Djy-LT_whOgQ7kNvwGrdhKA&amp;efg=eyJ2ZW5jb2RlX3RhZyI6Inhwdl9wcm9ncmVzc2l2ZS5JTlNUQUdSQU0uQ0xJUFMuQzMuNzIwLmRhc2hfYmFzZWxpbmVfMV92MSIsInhwdl9hc3NldF9pZCI6MjEwOTExNjI1MzM2ODgzNCwiYXNzZXRfYWdlX2RheXMiOjM4LCJ2aV91c2VjYXNlX2lkIjoxMDA5OSwiZHVyYXRpb25fcyI6MjMsIn…
Affected pages/ /cart

05 · Most affected inspected pages

06 · About this assessment

Evolize inspects publicly accessible website pages using automated browser-based testing and deterministic accessibility rules. Automated testing can identify many reproducible technical issues but cannot determine complete WCAG or legal compliance.

  • Publicly accessible surfaces only — no credentials, private systems, or source-code access.
  • Findings apply to the pages and states successfully inspected; automated analysis may not detect every issue.
  • Results reflect the site at the scan date and may have changed since.

Evolize provides digital risk intelligence and does not provide legal advice, certify compliance, or guarantee that litigation will not occur. Methodology · Security · Example assessment

07 · Continuous monitoring

This public report captures one assessment. Evolize monitoring rescans the website, detects new and recurring findings, tracks changes over time and verifies corrections.

Is information in this report inaccurate or outdated? Request a correction or removal.