Check code for accessibility WCAG 2 about website HOT 3 CLOSED

Accessibility can be tested using two separate tools.

• Wave extension https://chrome.google.com/webstore/detail/wave-evaluation-tool/jbbplnpkjmmeebjpijfedlgcdilocofh
• Chrome lighthouse site testing which is the chorme dev tools under audit tab.

from website.

This feedback comes from Drew de Rosario and each section should be reviewed.

Best Practices

Links to cross-origin destinations are unsafe
https://developers.google.com/web/tools/lighthouse/audits/noopener
when using target=_blank we need to add rel="noopener" to the tag
ensures that new page runs in a separate process
Browser errors were logged to the console
this will fix itself when we get images running
Performance

Eliminate render blocking resources
main.css and babel.js are blocking
both are located in head.html
need to add async to tags
https://developers.google.com/web/tools/lighthouse/audits/blocking-resources
Minify JavaScript
consider minifying babel.js to reduce size
https://developers.google.com/speed/docs/insights/MinifyResources
Accessibility

Color Contrast
not enough color contrast tags - white background and red foreground also buttons
Form Elements
do not have associated labels
https://dequeuniversity.com/rules/axe/3.2/label
e.g. type="text" on all forms. buttons are self labeling
Links do not have discernible names
correcting this will help screen readers
https://dequeuniversity.com/rules/axe/3.2/link-name
e.g. use aria-label="to describe what the link is"

from website.

This issue has been replaced by issue #75

from website.