marcus-herrmann
commented
8 years ago Grob/formlos klingt nach einem Job für ein automatisiertes Testing-Tool (hier: pa11y). Hier die Ergebnisse/Errors, wenn man die Startseite und Offer Index gegen WCAG 2.0 AA (Erklärung: http://webaccessibilityexplained.ca/wcag-simple-version/) prüft
WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.Button.Name 5 First result: This button element does not have a name available to an accessibility API. Valid names are: title attribute, element content.
Selector: html > body > div:nth-child(1) > nav > div > div > button Context:
<button class="nav-lang__button"></button>
10min
WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail 24 First result: 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 2.59:1. Recommendation: change background to #5c7b83.
Selector: html > body > div:nth-child(1) > nav > div > div > ul > li:nth-child(1) > a Context:
<a class="nav-lang__listitem--active" href="/refugees">Deutsch</a>WCAG2AA.Principle1.Guideline1_4.1_4_3.G145.Fail 1 First result: This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 3:1, but text in this element has a contrast ratio of 1.83:1. Recommendation: change background to #c68900.
Selector: html > body > div:nth-child(1) > header > div:nth-child(1) > div > h2 Context:
<h2 class="Claim__firstrow">Einfach Hilfe finden</h2>
Farben sind ja allgemein ein politisches Thema. Hier bemängelt das Tool den Kontrast weiß auf Gelb und seltsamerweise weiß auf blau, der so aber an vielen Stellen vorkommt. Das Thema sollte man eventuell im Rahmen eines Redesigns noch mal berücksichtigen
WCAG2AA.Principle3.Guideline3_2.3_2_2.H32.2 2 First result: Form does not contain a submit button (input type="submit", input type="image", or button type="submit").
Selector: #new_search_form Context:
<form accept-charset="UTF-8" action="/refugees/angebote" class="simple_form new_search_form" id="new_search_form" method="get"><div style="display:none"><inpu...</form>
10min
WCAG2AA.Principle1.Guideline1_1.1_1_1.H37 2 First result: Img element missing an alt attribute. Use the alt attribute to specify a short text alternative.
Selector: #lc_agent_profile_pic Context:
<img id="lc_agent_profile_pic" src="" class="lc-profile-pic">
Third Party Code von Freshdesk, kommen nur indirekt ran (Image wird per JS eingebunden)
WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.Textarea.Name 1 First result: This textarea element does not have a name available to an accessibility API. Valid names are: label element, title attribute.
Selector: #lc_chat_input_container Context:
<textarea id="lc_chat_input_container" tabindex="-1" placeholder="Deine Frage"></textarea>
Third Party Code von Freshdesk, kommen nur indirekt ran (Textarea wird per JS eingebunden)
WCAG2AA.Principle1.Guideline1_3.1_3_1.F68 1 First result: This form field should be labelled in some way. Use the label element (either with a "for" attribute or wrapped around the form field), or "title", "aria-label" or "aria-labelledby" attributes as appropriate.
Selector: #lc_chat_input_container Context:
<textarea id="lc_chat_input_container" tabindex="-1" placeholder="Deine Frage"></textarea>
Third Party Code von Freshdesk, kommen nur indirekt ran (Textarea wird per JS eingebunden)
WCAG2AA.Principle2.Guideline2_4.2_4_1.H64.1 1 First result: Iframe element requires a non-empty title attribute that identifies the frame.
Selector: #testCookie Context:
<iframe id="testCookie" src="http://chat.freshdesk.com:80/cookieTest?origin=http%3A%2F%2Fwww.clarat.org" style="display:none"></iframe>
Third Party Code von Freshdesk, kommen nur indirekt ran (iFrame wird per JS erzeugt)
Twiek
Wenn Du hier Chancen siehst liste diese mal bitte grob/formlos auf. Im Idealfall verbunden mit einer Aufwandsschätzung.