Accessibility improvements to site #242
Conversation
✅ Deploy Preview for conda-dot-org ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify project configuration. |
| --ifm-h2-font-size: 1.5rem; | ||
| --ifm-h3-font-size: 1.25rem; | ||
| --ifm-h4-font-size: 1rem; | ||
| --ifm-h5-font-size: 0.875rem; | ||
| --ifm-h6-font-size: 0.85rem; |
There was a problem hiding this comment.
These are the same as the default ones so they seemed redundant.
| .color-table { | ||
| width: 90%; | ||
| max-width: 600px; | ||
| margin-top: 20px; | ||
| overflow: hidden; |
There was a problem hiding this comment.
Added so we could have a nice table in the style guide.
|
Do we need underlines in eeevery link? Looking at conda-forge.org, the buttons and navigation bars do not have them, and afaicr they were also compliant with WCAG. See their custom CSS rules. |
That depends. We do not need default underlines in the navbar as long as there are at least underlines on hover. Currently, there are none, so we rely solely on colour. So if you prefer no default underlines we can remove them. We can remove the underlines with buttons, but I will need to see if the current colour vs hover colour are distinct enough (hue and luminosity) or tweak those. For example, the conda-forge.org ones do have a significant change in hue + luminosity on hover (white vs grey) Adding a general underline is the quickest way to add non-colour-only affordances for accessibility purposes and move towards conformance with WCAG. |
Yes, I'd prefer that. The way we do it in conda-forge.org looks nicer to me.
If we can commit the resources needed to do so, yes, I'd prefer tweaking components where necessary and only use underlines for regular text hyperlinks or where otherwise no alternative can be found with a reasonable amount of effort. I keep mentioning conda-forge.org as a reference, but if you see that that site is not compliant in some way, let me know and I'll adjust it accordingly! Thank you so much! |
|
OK I addressed all the review comments @jaimergp . This aligns now more with what we have on the conda-forge site.
Current This PR ✨ |
|
Awesome! Looks great. I was reviewing the site now and found a couple of potential improvements:
Thanks! |
This has a
I did not even realise, I removed some redundant animations so maybe I removed it then. Checking |
|
@jaimergp I fixed the above items. Note that the sidebar items are in an active state (the text changes to green, but it is too subtle, so we should consider making the font bolder or something. I also double-checked the contrast for the highlighted (green card), and this statement still holds
So I had to change the whole text to have better contrast throughout. Overall this should be ready to merge unless you want to change the active state. |
|
Thank you @trallard, looks fantastic! |
Description
I thought it was as good time as any to give this site a bit of care 🧽 and make it a bit more accessible:
hoveraffordances, too.learn/orcommunity/, I have added it to the corresponding_sidebar.jsonfile.