A11y updates

[GingerKiwi]

components/footer /index.coffee

Line 37 [] Change

<a href="https://opencollective.com/torontojs" aria-label="OpenCollective">

to

<a href="https://opencollective.com/torontojs" aria-label="Open Collective">

Reason: Elements with visible text labels do not have matching accessible names

Main Page

[] 1. Change:

<img src="https://torontojs.com/guild_logo.a39081a5.png">

to:

<img src="https://torontojs.com/guild_logo.a39081a5.png" alt="logo for Guild.host">

• Reason: alt text missing

[] 2. Change

<a href="/torontojs" role="link" class="css-175oi2r">

to

<a href="/torontojs" role="link" aria-label="link to TorontoJS on guild.host" class="css-175oi2r">

• Reason: link does not have a discernible name.

[] 3. Navbar: Change background colour to darker

• #991b1b and #7f1d1d passes WCAG AA for small text.

• @madcampos is working on the new branding guide and likely has a brand colour that works.

• Footer would be more accessible in a darker background colour. Maybe the almost black of the brand colours?

• Reason: current colour does not have sufficient contrast.

---

Note: I haven't run manual testing with NVDA and JAWS yet. These are just some minor updates that make a major A11y impact

[kieran]

did the first 2 - will wait for @madcampos' branding to change any colours

[madcampos]

@GingerKiwi @kieran the Navbar color issue refers to the gray footer right?

[GingerKiwi]

The Navbar issues refers to both the header and the footer navs.