Download a free workbook to help you design your site with confidence.
入力したメールアドレスが無効です。
ご登録ありがとうございます。
By entering your email, you indicate that you have read and understood our Privacy Policy and agree to receive marketing from Squarespace.
An accessible website ensures that every person who visits your website can access the information you want to share with them. Accessibility is one of many important considerations for anyone building a website—not just large organizations. Practices that improve accessibility can also help your search engine optimization (SEO), which can result in your site ranking higher in search results, and reaching a larger audience.
Accessibility best practices are always evolving. Laws, regulations, and accessibility standards can vary depending on your location. For example, a site that complies with the Americans with Disabilities Act (ADA), may not meet the accessibility standards of another country.
But you don’t need to be an expert or know how to code to make accessibility improvements to your website. Here are five simple things you can do to make viewing your web design and content easier for everyone.
Note: This guide is available as a resource to help you get started, but shouldn't be construed or relied upon as legal advice. Squarespace can't provide advice about making your site compliant with any specific accessibility laws, regulations, or standards.
1. Choose your colors carefully
Color is an important part of any brand’s visual identity. But if you want to communicate clearly to all of your website visitors, it’s better to use more than color to get your point across.
Before you finalize the color choices on your website, ask yourself:
Am I using color to convey information? Using color to emphasize a word won’t always come across for visitors who have low-vision or color deficiencies. And assistive technologies can’t convey your intent based on color alone. If you’re using color to communicate a message (like red to mean “Warning”), make sure that your intention also comes through in text or images with alt text that assistive technologies can pick up.
Is there enough contrast between the text and the background? Colors that are similar (like red and orange) are hard to tell apart and can make it impossible for those with low-vision or color deficiencies to see your content. To have a more accessible experience, choose contrasting colors for your website design, like black on a cream background.
2. Add alt text to images
Alt text is a description of an image that can be picked up by assistive technologies. Alt text is useful, not just for people with visual disabilities, but also:
People with some cognitive disabilities who may better understand spoken language than visuals
People using voice assistants (when they're not looking at the web page)
Users who may not see an image due to internet connection issues
Users who prefer not to download images due to time or cost consideration
Adding alt text to your images ensures that all visitors can get the most important information out of your website.
To know when to add alt text and write helpful descriptions, ask yourself:
Is this image decorative or conveying information? Decorative images don’t need alt text, since they’re unlikely to help a user understand the information on the page better.
What does someone need to know about the image? Not every part of an image is necessary to help someone understand its purpose. For example, the color of the background in a headshot isn’t necessary, but the name of the person in the photo might be.
Other guidelines to keep in mind:
Try to keep alt text to 250 characters or less. If an image requires a longer and more detailed description, include a caption for the full description.
Don’t include “an image of” or “a picture of” in your description. Assistive technologies will identify images for users, so you don’t have to.
3. Caption your videos and limit auto-play
Like alt text gives important context for still images and GIFs, captions and transcripts do the same for video and audio content. You can use a third-party video platform to add closed captions to videos, and then upload your video to a Squarespace video block or videos collection on your website.
Transcripts allow visitors to get all of a video’s information even if they aren’t able to view or listen to it. You can add a transcript to your website through a downloadable file, as a text block on the page, or on a separate page that you link out to below the video player.
Having too many moving images (i.e., zooming, flashing, or rapidly changing) on a page can have a negative effect on people with motion sensitivities or sensitivity to flashing lights. To protect these users:
Include an option to pause videos whenever possible.
Avoid adding background videos on a page.
Avoid GIFs and videos that flash three or more times in a one second period.
4. Make your content clear
The way you organize content on your website makes it easier for people using assistive technologies to navigate. For most websites, this means keeping your page layouts simple and consistent and giving clear and distinct names to each page on your website.
If you’re hyperlinking any text, give your links appropriate labels. Assistive technologies generally point out when text is linked, so you don’t need to include the word ‘link’ in your content. When pointing users to a contact page, for example, it’s more helpful to write “Reach out on our Contact page” than to write “To contact us, click the link here”.
How you structure your content is important for any page on your website, including the blog pages. Give your pages an easy-to-follow structure by using headers (e.g., H1, H2, H3) instead of relying on bold or italic text to separate different sections of your page. Use only one H1 per page, since a H1 indicates the title or headline, and use heading levels in order, rather than skipping from a H2 to a H4, for example.
5. Work with a designer who understands accessibility
If you choose to work with a web designer, ask about their familiarity with website accessibility standards. A designer with experience on the topic can save you time and potentially make accessibility improvements you wouldn’t be able to take care of yourself.
When in doubt, you can also get help or advice from a professional accessibility specialist. Consulting companies run by experts can support you by testing the accessibility of your website, offering training, or suggesting changes to your site.
Making your website more accessible doesn’t require coding experience or outside tools. You can take the steps above using the tools already included on Squarespace. Keep in mind that you're responsible for ensuring your site complies with applicable laws, including local accessibility requirements. These updates will go a long way toward creating a more inclusive, informative experience for every person who visits your site.