Valentin Antonucci / Pexels

Valentin Antonucci / Pexels

10 Ways to Make Your Site More Accessible

May 21 is Global Accessibility Awareness Day. Is your site reader-friendly for all of your visitors?

May 21, 2020

Cheri Lucas Rowlands

Today, Global Accessibility Awareness Day, raises awareness around digital access and inclusion and improving the web experience for everyone. This year, WebAIM analyzed one million homepages for accessibility issues and found that 98% of websites had at least one WCAG (Web Content Accessibility Guidelines) failure on their homepage, such as low-contrast text, missing image alt text, and empty links. These types of accessibility barriers make it difficult or impossible for some visitors — people who are blind, deaf and hard of hearing, and disabled, for example — to use your site.

We encourage you to audit your site to ensure it’s accessible for all readers; the WAVE Web Accessibility Evaluation Tool can identify various errors on your site in seconds. Here are some web accessibility tips to get you started, and be sure to explore the guidelines and resources on the W3C Web Accessibility Initiative (WAI) website for deeper learning.

Use an accessibility-ready theme

You can choose from among a variety of designs for your site, but some themes have features that add complexity, making it harder for disabled people or visitors using screen readers to access your content.

When choosing a theme, consider an accessibility-ready design, like Balasana, a free minimal theme for your business website; or Mayland, a free visual theme that’s great for photographers and storytellers. These themes have been checked by the Theme Review Team and pass basic accessibility requirements.

Examples of six accessibility-ready designs from the WordPress.com Theme Showcase

Display your site title and tagline

Many themes allow you to upload a custom header image, which is a visual way to brand your site, display the title of your blog, or promote the name of your business. But some themes may not support alternative text, or the written copy that appears in place of an image on a page if the image fails to load on your visitor’s screen.

Instead of conveying your site title and tagline within a header image, display your site title and tagline text. Go to Manage → Settings, and at the top under Site profile, fill out your Site title and Site tagline. Then, head to Design → Customize, go to Site Identity, and check the box next to Display Site Title and Tagline.

The module in My Sites where you insert your Site Title and Site Tagline

Structure your pages and posts with appropriate headings

Add headings with the Heading Block to organize pages and posts and make it easier for readers to follow your content, which is especially important for longer pages and posts. Click on the “i” icon in the top toolbar of the block editor to view any errors and incorrect heading sizes.

A popup box that appears in the block editor with information on headings and the structure of your post or page

Select fonts and colors for legibility

Fonts and colors are essential components on your site, adding personality and style and strengthening your visual identity online. Avoid font styles and sizes and color palettes that make your site difficult to read, and pay attention to contrast, or the difference between the darkness of your text and the lightness of your background.

The block editor will display an error message in Color settings when it detects poor color contrast in the specific block you’re working on.

An error message that is displayed in the sidebar of the block editor when low color contrast is detected

Clearly describe your links

When linking to another page or post on the web, make your linked text descriptive. For example, “click here” is not as effective as “learn how to apply to my writing workshop.”

A short paragraph with correctly linked text

Include captions with your images

When adding an image with the Image Block, add a description of the image in the caption underneath it. While captions are optional, they improve the experience for all readers by providing more context.

A photo of a vintage typewriter with a caption

Add alt text to your images

Alt text is essential for people who are blind or use screen readers (they can hear alt text read aloud), or people who have disabled images for speed or bandwidth reasons. Alt text is also important for your site’s SEO — it helps search engines understand what your site content is about.

When adding an image with the Image Block, go to the block’s settings on the right and add the alt text in the box under Image settings.

An example of image alt text written in the Alt Text field in the Image Block's settings

Learn more about W3C’s image accessibility guidelines.

Create easily clickable CTA areas

With the Buttons Block, you can add call-to-action buttons to your pages and posts quickly. For those of you who design and embed your own buttons with Image Widgets, make buttons, icons, and other CTA elements with wide-enough areas that are easy to click or tap from different devices.

You can apply this tip to text links as well. Tapping a linked hashtag or asterisk within a sentence, for example — especially on a small screen — may be difficult for some people.

Include captions or transcripts for multimedia content

If your site includes video content, consider adding captions or including transcripts (documenting speech, sounds, as well as actions seen on-screen). Podcast transcripts are also incredibly helpful; here’s a transcript of a recent Distributed episode with neuroscientist Adam Gazzaley.

It’s best if video and audio content does not auto-play, but if that’s not possible, options to pause or adjust the volume should be obvious on the page.

Never stop learning and improving

This list is just an introduction to a few best practices and guidelines! If you’re interested in learning more, explore the resources on the W3C Web Accessibility Initiative (WAI) website. You can also explore ways to get involved in improving the accessibility of WordPress.

Learn more about Global Accessibility Awareness Day and participate in online events, webinars, and podcasts.

Missing out on the latest WordPress.com developments? Enter your email below to receive future announcements direct to your inbox. An email confirmation will be sent before you will start receiving notifications—please check your spam folder if you don't receive this.

Join 1.6M other subscribers

49 Comments

Comments are closed.

  1. ltsdo May 21st at 12:17 pm

    Informative post 👍

    Liked by 14 people

  2. Articlesofachurchgirl May 21st at 12:37 pm

    This is really very helpful. Thank you sharing.

    Liked by 18 people

  3. JenT May 21st at 1:02 pm

    Using accessibility guidelines as a baseline for creating websites benefits everyone. Thank you for sharing some really good tips in this post.

    Liked by 16 people

  4. alannarte May 21st at 1:49 pm

    Very good information! Thank you!!

    Liked by 15 people

  5. Shola May 21st at 2:22 pm

    Thank you sharing this insightful advice. Please what theme can I use for personal freelance web design business?

    Thank you.
    Shola

    Liked by 11 people

  6. Avatar Tea May 21st at 2:29 pm

    This is very helpful. My blog is about providing low cost budget Marketing tips for Entrepreneurs yet I don’t get traffic to my page.

    I feel this should help.

    Liked by 10 people

  7. Shikha May 21st at 2:54 pm

    Just one doubt. Is Astra theme also accessibility ready?

    Liked by 10 people

  8. Ella john May 21st at 3:32 pm

    Very good info thanks👍

    Liked by 9 people

  9. Alixha_sam May 21st at 3:38 pm

    Its way too informative ! Hope that i will gain followers through it

    Liked by 10 people

  10. Dragthepen May 21st at 4:21 pm

    Great information. Very useful.👍

    Liked by 9 people

  11. Monika Gil May 21st at 4:32 pm

    That’s so useful!
    Thanks x

    Liked by 10 people

  12. prerna choudhary May 21st at 5:06 pm

    Great insights 💯

    Liked by 10 people

  13. sakshi 's poetry May 21st at 5:49 pm

    Very helpful post for new user👍
    Thanks for sharing 💐😊

    Liked by 9 people

  14. Shamwest May 21st at 5:57 pm

    I had never thought of this before. It would be useful to have this more obvious when people first come to WordPress.

    Liked by 9 people

  15. Campbell de Burgh May 21st at 6:15 pm

    A very interesting post. I have been working on and off for several days now getting the theme we have chosen – Natural – to be Accessibility compliant. We have generally succeeded in practically everything except a very minor contrast issue on the contact form where the Wave check identifies the word “(required)” attached to the field “required” toggle as below the Accessibility contrast level. In edit mode it is red but on the site it comes out as light grey and this is unacceptable. I have tried several times to get the WordPress Happiness engineers to resolve this with a CSS addition but because we are on the Personal plan they require that we upgrade to the next level before they will help. We are not prepared to upgrade just for this and we do not need any of the facilities that an upgrade offers other than a bit of help to meet accessibility standards. This seems to be at odds with the message you give in this blog. Grateful if you can assist.

    Campbell de Burgh http://www.briantspuddle.info

    Sent from Mail for Windows 10

    Liked by 6 people

  16. ShankySalty May 21st at 7:17 pm

    Very informative post👍

    Liked by 5 people

  17. KetCage May 22nd at 3:32 am

    Very informative! Thank you!

    Liked by 8 people

  18. purposefultruth May 22nd at 5:05 am

    This is really very helpful. Thank you sharing.
    I’d love to chat more about this. I need guidance and a few pointers on how to apply this information.

    Liked by 9 people

  19. flyingadobo May 22nd at 7:05 am

    Thanks for sharing! Very informative!

    Liked by 8 people

  20. 365cstores May 22nd at 8:08 am

    Thanks for sharing such an informative article.

    Liked by 9 people

  21. Purpose Dimension Media May 22nd at 11:36 am

    Very helpful…..thank you.

    Liked by 8 people

  22. ebukaalex065 May 22nd at 12:00 pm

    Great insight

    Liked by 8 people

  23. Chetu Partnerships May 22nd at 3:32 pm

    Really Informative post.

    Liked by 9 people

  24. Whitnee’ May 22nd at 9:14 pm

    Thank you for sharing this. I have learned so much by your post!

    Liked by 7 people

  25. disabilitydiyblog May 23rd at 2:02 am

    Thank you for your information! There is quite a bit of learning to be had.

    Liked by 9 people

  26. tubi May 23rd at 6:46 am

    Thanks for your informative article.

    Liked by 7 people

  27. mallysa May 23rd at 7:15 am

    This is really helpful.Thank you.

    Liked by 6 people

  28. Greg May 23rd at 2:47 pm

    Like many of the bloggers, I’m grateful for these tips. I’m still very new to all this and I will attempt to implement these tips, but if I’m struggling, is there somewhere or someone I can reach out to for questions? I want to do my best and allow anyone to enjoy my site. Thanks.

    Liked by 6 people

  29. lorijesi May 23rd at 3:02 pm

    Thanks it is very inspiring

    Liked by 7 people

  30. Razdeep May 23rd at 3:43 pm

    Nice one… It’s really good.

    Liked by 5 people

  31. Melanie Ann George May 23rd at 4:51 pm

    This is very helpful 🙂

    Liked by 5 people

  32. Asokan Manic May 24th at 5:21 am

    Thanks Cheri for such wonderful coverage and presentation

    Liked by 4 people

  33. swapnil upadhyay May 24th at 8:24 am

    Thanks, very interesting.

    Liked by 6 people

  34. Anaya May 24th at 12:34 pm

    very nicely explained

    Liked by 6 people

  35. Rahul K News May 24th at 6:13 pm

    Very useful information for me i really thanks to you

    Liked by 8 people

  36. koula1342 May 25th at 6:27 pm

    I try to post something on my blog and I can’t do it — can you help me.

    Liked by 7 people

  37. NwekeFavourUche May 26th at 7:38 am

    Thanks alot, it was really helpful especially the first point you made.

    Liked by 8 people

  38. Christophorouss Group May 26th at 10:42 am

    Thank you Cheri for this tip. I found it helpful.

    Liked by 6 people

  39. Sandra May 26th at 2:19 pm

    This is really informative and helpful. The last piece of advice was perfect and very true to the nature of blogging.
    Thank you!

    Liked by 7 people

  40. rogerpj01 May 27th at 5:27 am

    Very helpful tips

    Liked by 7 people

  41. victoriarose002 May 27th at 1:43 pm

    Thankyou 🙂

    Liked by 8 people

  42. dheedhi May 28th at 8:34 am

    Thank you. This was very helpful.💯

    Liked by 6 people

  43. collinsgold May 28th at 11:01 am

    The post is very good for beginners
    Thanks
    Collinsgold

    Liked by 5 people

Create your new blog or website for free

Get Started