Article list

ID:
article-list
Automated score:
89.6
URL:
https://sem1.dev.stackenterprise.co/articles
View JSON file

14 violations: Light: 4Dark: 3HC Light: 4HC Dark: 3

Ensure elements with an ARIA role that require child roles contain them. Certain ARIA roles must contain particular children. Help URL

HTML

<ol class="s-topbar--content" role="menubar">

Target

ol

Summary

Fix any of the following:

  • Element has children which are not allowed: li[tabindex]

Ensure elements with an ARIA role that require child roles contain them. Certain ARIA roles must contain particular children. Help URL

HTML

<ol class="s-topbar--content" role="menubar">

Target

ol

Summary

Fix any of the following:

  • Element has children which are not allowed: li[tabindex]

Ensure elements with an ARIA role that require child roles contain them. Certain ARIA roles must contain particular children. Help URL

HTML

<ol class="s-topbar--content" role="menubar">

Target

ol

Summary

Fix any of the following:

  • Element has children which are not allowed: li[tabindex]

Ensure elements with an ARIA role that require child roles contain them. Certain ARIA roles must contain particular children. Help URL

HTML

<ol class="s-topbar--content" role="menubar">

Target

ol

Summary

Fix any of the following:

  • Element has children which are not allowed: li[tabindex]

Ensures the contrast between foreground and background colors meets APCA custom level conformance minimums thresholds. Elements must meet APCA conformance minimums thresholds. Help URL

HTML

<div class="flex--item pl6">
                Articles
            </div>

Target

#nav-articles > .w100.ai-center.d-flex > .pl6.flex--item

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 55.41Lc (foreground color: #ffffff, background color: #f48225, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

HTML

<div class="s-pagination--item is-selected" aria-current="&quot;page&quot;">1</div>

Target

div[aria-current="\"page\""]

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 55.41Lc (foreground color: #ffffff, background color: #f48225, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

HTML

<a href="/articles?filter=All&amp;sort=Newest&amp;page=1&amp;pagesize=15" title="Show 15 items per page" class="s-pagination--item is-selected" aria-current="true">15</a>

Target

a[title="Show 15 items per page"]

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 55.41Lc (foreground color: #ffffff, background color: #f48225, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

Ensure the contrast between foreground and background colors meets WCAG 2 AAA enhanced contrast ratio thresholds. Elements must meet enhanced color contrast ratio thresholds. Help URL

HTML

<li class="fs-fine tt-uppercase ml12 mt24 mb4 fc-light">
            Teams
        </li>

Target

.fs-fine

Summary

Fix any of the following:

  • Element has insufficient color contrast of 6.79 (foreground color: #525960, background color: #f9fafa, font size: 8.3pt (11px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/create" class="s-btn s-btn__filled ws-nowrap">Create a new article</a>

Target

.s-btn__filled

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #ffffff, background color: #0077cc, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71371" class="s-link">metrics EXE exploit Buckinghamshire compressing parsing</a>

Target

a[href="/articles/71371"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/7/" class="flex--item">Test Downvoter</a>

Target

#post-summary-71371 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/7/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71369" class="s-link">Dollar parsing hour Gloves Practical Graphical RSS</a>

Target

a[href="/articles/71369"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/8/" class="flex--item">Test Question Answerer</a>

Target

#post-summary-71369 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/8/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71365" class="s-link">deposit Identity Avon withdrawal intangible solid Chad Small synthesize Electronics</a>

Target

a[href="/articles/71365"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/5/" class="flex--item">Test Question Asker</a>

Target

#post-summary-71365 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/5/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71364" class="s-link">Soft Frozen back Pizza copy Senior Account</a>

Target

a[href="/articles/71364"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/9/" class="flex--item">Test Moderator To Be</a>

Target

#post-summary-71364 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/9/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71357" class="s-link"> Branding Cotton Bronze Peso International Prairie</a>

Target

a[href="/articles/71357"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/9/" class="flex--item">Test Moderator To Be</a>

Target

#post-summary-71357 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/9/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71353" class="s-link">deposit Spurs salmon Causeway paradigm metrics Intuitive Ergonomic program</a>

Target

a[href="/articles/71353"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/8/" class="flex--item">Test Question Answerer</a>

Target

#post-summary-71353 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/8/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71352" class="s-link">ROI feed RAM infomediaries Vista Automated synthesize morph Steel</a>

Target

a[href="/articles/71352"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/8/" class="flex--item">Test Question Answerer</a>

Target

#post-summary-71352 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/8/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71315" class="s-link">Account Unbranded Metal Dynamic matrix Nevada invoice infomediaries</a>

Target

a[href="/articles/71315"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/8/" class="flex--item">Test Question Answerer</a>

Target

#post-summary-71315 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/8/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71241" class="s-link"> up AGP Sleek parsing Chair Incredible</a>

Target

a[href="/articles/71241"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/7/" class="flex--item">Test Downvoter</a>

Target

#post-summary-71241 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/7/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71213" class="s-link">Pants solutions eyeballs Buckinghamshire Mississippi Lesotho Union</a>

Target

a[href="/articles/71213"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/6/" class="flex--item">Test Upvoter</a>

Target

#post-summary-71213 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/6/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71211" class="s-link">Shoes Wyoming turquoise Jewelery Quality Intranet neural Accountability Soft</a>

Target

a[href="/articles/71211"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/5/" class="flex--item">Test Question Asker</a>

Target

#post-summary-71211 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/5/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71207" class="s-link">Chips optical grow orange Baht matrix solution</a>

Target

a[href="/articles/71207"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/6/" class="flex--item">Test Upvoter</a>

Target

#post-summary-71207 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/6/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71200" class="s-link">bluetooth invoice redundant Colorado purple Tennessee</a>

Target

a[href="/articles/71200"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/6/" class="flex--item">Test Upvoter</a>

Target

#post-summary-71200 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/6/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71199" class="s-link">Cambridgeshire compressing cultivate Salad Factors scalable azure</a>

Target

a[href="/articles/71199"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/7/" class="flex--item">Test Downvoter</a>

Target

#post-summary-71199 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/7/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/articles/71197" class="s-link">Fields Agent Consultant Chips bus circuit Digitized</a>

Target

a[href="/articles/71197"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 12.8pt (17px), font weight: normal). Expected contrast ratio of 7:1

HTML

<a href="/users/6/" class="flex--item">Test Upvoter</a>

Target

#post-summary-71197 > .s-post-summary--content > .s-post-summary--meta > .s-user-card__minimal.s-user-card[aria-live="polite"] > .s-user-card--info > .s-user-card--link.gs4.d-flex > .flex--item[href="/users/6/"]

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 7:1

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul

Ensure that lists are structured correctly. <ul> and <ol> must only directly contain <li>, <script> or <template> elements. Help URL

HTML

<ul class="s-navigation s-navigation__vertical">

Target

nav[role="navigation"] > .s-navigation.s-navigation__vertical

Summary

Fix all of the following:

  • List element has direct children that are not allowed: ul

Ensure <li> elements are used semantically. <li> elements must be contained in a <ul> or <ol>. Help URL

HTML

<li>

Target

ol > li:nth-child(3)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"

HTML

<li>
                <a href="/users/logout" class="s-topbar--item js-logout-button" title="Log out of Home Page">
                    Log out
                </a>
            </li>

Target

ol > li:nth-child(9)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"

Ensure <li> elements are used semantically. <li> elements must be contained in a <ul> or <ol>. Help URL

HTML

<li>

Target

ol > li:nth-child(3)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"

HTML

<li>
                <a href="/users/logout" class="s-topbar--item js-logout-button" title="Log out of Home Page">
                    Log out
                </a>
            </li>

Target

ol > li:nth-child(9)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"

Ensure <li> elements are used semantically. <li> elements must be contained in a <ul> or <ol>. Help URL

HTML

<li>

Target

ol > li:nth-child(3)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"

HTML

<li>
                <a href="/users/logout" class="s-topbar--item js-logout-button" title="Log out of Home Page">
                    Log out
                </a>
            </li>

Target

ol > li:nth-child(9)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"

Ensure <li> elements are used semantically. <li> elements must be contained in a <ul> or <ol>. Help URL

HTML

<li>

Target

ol > li:nth-child(3)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"

HTML

<li>
                <a href="/users/logout" class="s-topbar--item js-logout-button" title="Log out of Home Page">
                    Log out
                </a>
            </li>

Target

ol > li:nth-child(9)

Summary

Fix any of the following:

  • List item parent element has a role that is not role="list"