diff --git a/docs/meta/accessibility.md b/docs/meta/accessibility.md new file mode 100644 index 00000000..884e0886 --- /dev/null +++ b/docs/meta/accessibility.md @@ -0,0 +1,32 @@ +--- +title: Accessibility +description: A guide for contributors on creating accessible content. +--- + +At Privacy Guides, we strive to make our website as accessible as possible so we can reach as many people as we can. + +## Guidelines + +Try to follow the [WCAG guidelines](https://www.wcag.com) as closely as possible when contributing to the site. + +You can use this [color contrast checker](https://webaim.org/resources/contrastchecker/) to verify colors meet the guidelines. + +Make sure to use html/markdown elements instead of images/emojis when possible, for example for checkboxes you should use + +`- [x]` which will render as + +- [x] Check + +Don't use + +:white_check_mark: Check + +This will be easier for things like screenreaders to interpret. + +## Company Logos + +Sometimes a company logo will not show up well in either light mode or dark mode. In these cases, try to find a version of the logo that looks good in both light and dark modes or see if they have a light mode version and a dark mode of their logo. + +Try to stick to official logos instead of making your own, although in cases where there is no althernative logos from unofficial sources are acceptable. + +It never hurts to contact the developers and ask if you can't find the proper logos. \ No newline at end of file diff --git a/mkdocs.yml b/mkdocs.yml index b28359f1..ff0785f8 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -463,6 +463,7 @@ nav: - "meta/brand.md" - "meta/translations.md" - !ENV [NAV_TECHNICAL_GUIDES, "Technical Guides"]: + - "meta/accessibility.md" - "meta/uploading-images.md" - "meta/git-recommendations.md" - "meta/commit-messages.md"