A Note on Language
In this toolkit, we will sometimes use the word woman/women and feminine pronouns for simplicity and to recognize the significant impact technology-facilitated violence has on women and girls. We recognize that TFGBV also impacts trans, non-binary, and Two-Spirit people. We hope that all people impacted by TFGBV will find these documents useful.
When creating or upgrading your organization’s website, there are two main considerations:
- Digital Accessibility
- Safety and Privacy
Visiting a website can leave a digital trail and, for survivors, can create safety and privacy risks. While it may not be possible to eliminate risks completely, there are ways to increase survivors’ awareness and provide options. Read more about how to in our companion resource, Designing Websites to Increase Survivor Safety and Privacy.
In terms of website design, considering digital accessibility can reduce barriers and ensure survivors with disabilities get the support and resources they need to live free from violence.
Website Accessibility Considerations
Below are digital accessibility tips to consider when designing your program’s website using an inclusive approach.
Make Sure Text is Easy to Read
- Use colours that contrast well. This means the colour of your text should stand out against the colour of its background.
- Avoid using colours that are too similar for your text and background.
- Avoid using colours that are known to be difficult for vision-impaired or colourblind individuals, such as red and green.
Do Not Rely on Colour Alone
- If you are using colour to highlight something important, also use an icon or text.
- Make sure that your information is still clear even when viewed in grayscale.
Make Buttons and Links Obvious
- Buttons should look like buttons. They should have a 3D effect or a shadow to make them stand out.
- Links should be underlined or have a different colour from the rest of the text.
- Avoid using colour alone to distinguish links. They should still be obvious when viewed in grayscale.
Keep Navigation Simple
- Try to keep your menus and website structure simple and predictable.
- Avoid having too many menu items. A good rule of thumb is to have seven or fewer items on each level of your menu.
- Make sure that your menu is accessible with both a mouse and a keyboard.
Label Forms Clearly
- Each field in your form should have a label that clearly describes what information should be entered.
- If a field requires a specific format (like a phone number or a date), mention that in the label.
- Use error messages to help users correct mistakes in the form.
Give Feedback When Something Happens
- If a user clicks a button or submits a form, show a message that confirms their action.
- If a page is loading, use a loading spinner or a similar indicator.
Describe Images and Media
- For vision-impaired or blind individuals who cannot see images or videos, provide a text description.
- This description, also known as “alt text” or alternative text, should describe the image in a way that conveys the same information as the image.
- If the image is purely decorative and does not convey any information, you can use an empty alt attribute (alt="" in HTML).
Control Auto-Playing Content
- If you have videos or music that play automatically, provide a way to pause or stop them.
- Avoid using auto-playing content as much as possible, as it can be distracting or annoying for some users.
Do Not Overwhelm with Too Much Content
- A cluttered page can be confusing.
- Try to keep your content clear and concise.
- Use headings and subheadings to organize your content.
Do the Basics Well:
- Many accessibility practices are just good design practices.
- Clear, logical designs, navigation, and architecture benefit everyone.
- Test your website with a variety of real users to find any potential issues.
Helpful Resources to Make Websites More Accessible
- WAVE Web Accessibility Evaluation Tools – WAVE is a suite of evaluation tools that helps authors make their web content more accessible to individuals with disabilities.
- Deque’s axe DevTools browser extension – This extension for Google Chrome is a powerful testing tool driven by the world’s most trusted accessibility testing engine, axe-core, developed by Deque.
- The Web Accessibility Initiative (WAI) – This is an international community of organizations and individuals that work to make the web accessible to people with disabilities.
- Web Accessibility Initiative's Tips – WAI’s tips for getting started with Web Accessibility
Technology-Facilitated Gender-Based Violence (TFGBV) is part of a continuum of violence that can be both online and in-person. If you or someone you know is experiencing TFGBV, you are not alone. You can use www.sheltersafe.ca to find a shelter/transition house near you to discuss options and create a safety plan. You don’t need to stay in a shelter to access free, confidential services and support.
We gratefully acknowledge the Neil Squire Society for the creation of this information sheet.