matjek icon indicating copy to clipboard operation
matjek copied to clipboard

Accessibility errors found in your template

Open wapyce-bot opened this issue 6 years ago • 0 comments

The user @carlsonsantana validate your site template "https://shawnteoh.github.io/matjek" and found these accessibility errors:

  • Page https://shawnteoh.github.io/matjek/:
    • Issue e5edf0d3-bdd7-4829-ae6c-52ef77d1e6e3:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 1.95:1. Recommendation: change background to #00574f.
      • Selector: html > body > footer > div:nth-child(1) > div > div > p > a
      • Context: <a href="http://materializecss.com">Materialize.css</a>
    • Issue 3d19696a-5095-42a8-b932-f1c39abfacf1:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 3.37:1. Recommendation: change background to #007e72.
      • Selector: html > body > footer > div:nth-child(1) > div > div > p
      • Context: <p class="grey-text text-lighten-4">Material theme based on <a href...</p>
    • Issue 1cb7b637-71ba-4a11-a9e5-c99ece9dc02b:
      • Type: Error
      • Code: WCAG2AA.Principle2.Guideline2_4.2_4_1.G1,G123,G124.NoSuchID
      • Message: This link points to a named anchor "!" within the document, but no anchor exists with that name.
      • Selector: html > body > main > div > div:nth-child(2) > div > div:nth-child(4) > ul > li:nth-child(3) > a
      • Context: <a href="#!"><i class="m...</a>
    • Issue 8e77c2c7-85c6-48ec-8216-6fb53ef30ae4:
      • Type: Error
      • Code: WCAG2AA.Principle2.Guideline2_4.2_4_1.G1,G123,G124.NoSuchID
      • Message: This link points to a named anchor "!" within the document, but no anchor exists with that name.
      • Selector: html > body > main > div > div:nth-child(2) > div > div:nth-child(4) > ul > li:nth-child(2) > a
      • Context: <a href="#!">1</a>
    • Issue b95eefc9-b05e-411d-bc52-ee261fb8066e:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 3.67:1. Recommendation: change background to #008579.
      • Selector: html > body > main > div > div:nth-child(2) > div > div:nth-child(4) > ul > li:nth-child(2) > a
      • Context: <a href="#!">1</a>
    • Issue 61bb5d0d-2717-4659-83d3-a37123e2ac67:
      • Type: Error
      • Code: WCAG2AA.Principle2.Guideline2_4.2_4_1.G1,G123,G124.NoSuchID
      • Message: This link points to a named anchor "!" within the document, but no anchor exists with that name.
      • Selector: html > body > main > div > div:nth-child(2) > div > div:nth-child(4) > ul > li:nth-child(1) > a
      • Context: <a href="#!"><i class="m...</a>
    • Issue 9ad02609-4578-4ff6-b52a-66aebe1a16dd:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 1.88:1. Recommendation: change text colour to #b16300.
      • Selector: html > body > main > div > div:nth-child(2) > div > div:nth-child(3) > div > div:nth-child(2) > a
      • Context: <a href="/matjek/2017/03/23/welcome-to-jekyll">Read More</a>
    • Issue 0b05fdab-1bd2-4fe1-a893-e676bcaa01dd:
      • Type: Error
      • Code: WCAG2AA.Principle4.Guideline4_1.4_1_1.F77
      • Message: Duplicate id attribute value "post-content" found on the web page.
      • Selector: #post-content
      • Context: <p id="post-content">You’ll find this post in your <...</p>
    • Issue f726931c-e351-419c-b2da-d4f2a26724af:
      • Type: Error
      • Code: WCAG2AA.Principle4.Guideline4_1.4_1_1.F77
      • Message: Duplicate id attribute value "post-date" found on the web page.
      • Selector: #post-date
      • Context: <p id="post-date"><i class="material-i...</p>
    • Issue 008fa481-504e-445c-8e44-2b0725cc9335:
      • Type: Error
      • Code: WCAG2AA.Principle4.Guideline4_1.4_1_1.F77
      • Message: Duplicate id attribute value "post-title" found on the web page.
      • Selector: #post-title
      • Context: <span id="post-title" class="card-title">Welcome to Jekyll!</span>
    • Issue 3964b696-61ad-459b-bbcc-7130799d7cf4:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 1.88:1. Recommendation: change text colour to #b16300.
      • Selector: html > body > main > div > div:nth-child(2) > div > div:nth-child(2) > div > div:nth-child(2) > a
      • Context: <a href="/matjek/2017/03/24/syntax-test">Read More</a>
    • Issue a7d698aa-82e3-44d0-ad7b-fd95a0c50100:
      • Type: Error
      • Code: WCAG2AA.Principle4.Guideline4_1.4_1_1.F77
      • Message: Duplicate id attribute value "post-content" found on the web page.
      • Selector: #post-content
      • Context: <p id="post-content">Jekyll uses Rouge by default fo...</p>
    • Issue 5d4fe169-5a0c-43ba-add4-6fe619714320:
      • Type: Error
      • Code: WCAG2AA.Principle4.Guideline4_1.4_1_1.F77
      • Message: Duplicate id attribute value "post-date" found on the web page.
      • Selector: #post-date
      • Context: <p id="post-date"><i class="material-i...</p>
    • Issue babfb7c5-8615-44dc-a6bc-64600baaf923:
      • Type: Error
      • Code: WCAG2AA.Principle4.Guideline4_1.4_1_1.F77
      • Message: Duplicate id attribute value "post-title" found on the web page.
      • Selector: #post-title
      • Context: <span id="post-title" class="card-title">Syntax Highlighting Test</span>
    • Issue 70dacc6f-8afa-4989-97eb-ac611e54fd65:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 1.88:1. Recommendation: change text colour to #b16300.
      • Selector: html > body > main > div > div:nth-child(2) > div > div:nth-child(1) > div > div:nth-child(2) > a
      • Context: <a href="/matjek/2017/03/25/another-post">Read More</a>
    • Issue e38d7123-af27-4e74-925f-df904499a2c5:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_3.1_3_1.H42.2
      • Message: Heading tag found with no content. Text that is not intended as a heading should not be marked up with heading tags.
      • Selector: #page-info > h3
      • Context: <h3></h3>
    • Issue 88091f70-6f44-4b46-8a0d-d7a652fd320b:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 1:1. Recommendation: change text colour to #767676.
      • Selector: #slide-out > li:nth-child(1) > div > span:nth-child(4)
      • Context: <span class="white-text email">[email protected]</span>
    • Issue 7faae8bd-40aa-445c-a4bc-4e64113b771f:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail
      • Message: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of 1:1. Recommendation: change text colour to #767676.
      • Selector: #slide-out > li:nth-child(1) > div > span:nth-child(3)
      • Context: <span class="white-text name">John Doe</span>
    • Issue b9daa4cc-9174-411b-aa2e-660b7401b055:
      • Type: Error
      • Code: WCAG2AA.Principle1.Guideline1_1.1_1_1.H30.2
      • Message: Img element is the only content of the link, but is missing alt text. The alt text should describe the purpose of the link.
      • Selector: #slide-out > li:nth-child(1) > div > a
      • Context: <a href="https://github.com/ShawnTeoh" target="_blank"><img class="circle z-depth-2" s...</a>
    • Issue 44dee7c4-499a-40d8-a56b-0c308e3e94d7:
      • Type: Error
      • Code: WCAG2AA.Principle3.Guideline3_1.3_1_1.H57.2
      • Message: The html element should have a lang or xml:lang attribute which describes the language of the document.
      • Selector: html
      • Context: <html><head><meta http-equiv="Co...</html>

You can check these accessibility errors using pa11y. You can view the full validation results in our website.

wapyce-bot avatar Oct 27 '18 13:10 wapyce-bot