How do I make my website accessible?
Tutorial Hosting
Making your WordPress website accessible is not only a good design practice, but it also ensures that everyone has equal access to your web content and applications. This means that any visitor, regardless of disability or impairment, should be able to access and use your site.
This is important when you consider the fact that one in four adults in the United States has a disability of some kind. In other words, if you’re not building with accessibility in mind, up to a quarter of your website’s visitors may struggle to access your content.
Fortunately, there is a set of guidelines you can use to review your web design and functionality. The W3C standards outline several levels of accessibility. Of course, you’ll also want to take laws and regulations into account, since accessibility is a legal matter as well.
In this video, we’ll take a look at what accessibility means online. We’ll also dive into some of WordPress’s new additions that make accessible design easier. There’s a lot to cover, so let’s get started! #1. Make Sure Your Site Is Keyboard-Friendly Put simply: for a website to be accessible,
It must work without the use of a mouse. This is because many assistive technologies for people with physical disabilities rely on keyboard-only navigation. As such, it must be possible to use all of your site’s major features via a keyboard and nothing else. This includes accessing all pages, links, content, and so on.
The most common way of navigating using a keyboard is with the Tab key. This will jump between areas on a page that can have “keyboard focus,” which includes links, buttons, and forms. Therefore, your goal should be to ensure that all web content and navigation can be accessed using Tab.
This is easy to test — simply use your own site without a mouse. If you find that you can’t access certain elements or that navigating is difficult, you can pinpoint those issues and address them. To help you out with this, WebAIM provides a handy guide for keyboard accessibility design,
See the link in the description box below for more info. #2. Make Sure All Content Is Easily Accessible For The Vision Impaired While this is usually not a problem, it can be an issue when a page contains dynamic content.
In short, content is dynamic if it can change without the page it’s on reloading. This can become a problem if the site doesn’t inform assistive tools of the change, then the user will miss the new content. One way you can do this is by using ARIA landmarks.
These are tags you add to content in order to clearly define it on the page. With ARIA, you can tag dynamic content as a “live region,” which enables screen readers and similar devices to understand the content as it changes. ARIA is also useful for making navigation more straightforward as it lets users skip
Directly to specific content. This way, they won’t have to tab through every menu item just to get to what they want. The Make WordPress Accessible handbook contains a section on ARIA landmarks that’s linked in the description box below. It’s also worth noting that all WordPress themes with the accessibility-ready tag will
Have ARIA landmarks added by default. #3. Add Alt Text to All Images When adding images to WordPress, you’ve probably noticed this field. Here, you can enter the alternative text for an image. This text acts as a replacement for the image if it fails to load.
However, alt text (sometimes called alt attributes, alt descriptions, or alt tags) is also accessed by screen readers to “read” the picture for the blind. You can, therefore, use this field to describe an image, giving context to users who would otherwise miss it.
As if that weren’t enough, alt text can also help you improve your site’s SEO, giving search engines more information to crawl. Just make sure to write descriptive summaries of each image, and try to include your keywords whenever it makes sense. #4. Choose Your Colors Carefully We often talk about color blindness as if
It’s a, no pun intended, black-and-white issue. However, it’s more of a spectrum since different people perceive colors in unique ways. As such, you need to make sure the colors you select on your site contrast well to ensure that everyone can distinguish between various elements on the page.
The most pressing issue is making sure text stands out against the background. Ideally, you should set a dark color against a light one, making sure that they don’t bleed into each other. Let’s say you want to use a blue color scheme.
You’d want to avoid creating a palette where the shades are too similar in hue and saturation, like this: This is very difficult to read. Instead, a clearer color contrast works much better.You’ll also want to avoid clashing colors that could cause eye strain.
There are plenty of online tools you can use to find and test color combinations. WebAIM has one, and there’s also Contrast Checker, which gives you an effectiveness score in real-time. #5. Use Headers to Structure Your Content Correctly Another key task to make sure your site’s
Accessible – is structuring your content by using headers carefully. Doing this will make your content much easier to understand and digest. Additionally, clear headers also help screen readers interpret your pages. This makes it much easier to provide in-page navigation.
It’s also simple to do, since you only need to ensure you use the correct heading levels in your content. For instance, you should only use one H1 per page – usually as the page title. This can be followed by subheadings starting with H2, which can then be nested further
With H3, followed by H4. These should always be used in order so you should avoid using an H4 directly after an H2 (and so on). #6. Don’t Use Tables for Anything Except Tabular Data When it comes to displaying data, tables are handy.
They make it much easier for all users, including those using assistive technology, to parse a large amount of data. To get the maximum benefit, however, you’ll want to keep your tables as simple as you can. In addition, it’s best to avoid using tables for anything but tabular data.
For example, you should never use a table for layouts, lists, or anything else. This can be confusing to screen readers and similar devices. If you do need to create more complex tables, you can follow this guide from W3 that is listed in the description box below.
It shows you how to code a table while maintaining accessibility standards. #7. Enable Resizable Text That Doesn’t Break Your Site Most devices and browsers will enable users to resize text, which can be helpful for those with visual impairments. However, if you don’t build your site to support this feature, resizing text could
Break your design or make it difficult to interact with your site. A good practice is to avoid absolute units, such as specifying text size using pixels. Instead, use relative sizes, which enable the text to scale depending on other content and screen size.
You should also never turn off user scalability as this will make it difficult for users to resize the text at all. To make sure your site meets these criteria, test your font sizes thoroughly by increasing the zoom level in your own browser.
If you notice that content becomes difficult to read or navigate, you can check out this guide by WebAIM linked below, that discusses font size. #8. Avoid Automatic Media and Navigation Automatically-playing media files have been a bane of internet users since the days of MySpace.
As annoying as it can be to have music or videos start when a page loads, this is an even bigger issue in terms of accessibility. For example, figuring out how to turn off the media can be difficult when using a screen
Reader, while other users could simply be confused or even frightened by the sudden noise. You should, therefore, avoid including elements that start without the user first prompting them. It’s also best to avoid automatic navigation, such as carousels and sliders.
This can be incredibly frustrating if the viewer needs more time to absorb all the information before moving on to the next slide or section. #9. Create Content With Accessibility in Mind Finally, we come to the core of your site: its content.
While designing your site for accessibility is hugely important, you should bear the same considerations in mind when creating content. This means paying attention to relatively minor things, such as always fully writing out acronyms, to more important points, like making sure you give all your links unique, descriptive names and anchor text.
Web Content Accessibility Matters Making sure your site is welcoming to as many people as possible should be a top priority. There’s no reason to exclude anybody, especially since it’s relatively easy to avoid doing so. Not only will your users thank you, but you’ll also likely see benefits in the form of increased
Traffic and conversions. Thank you for joining us, for more helpful tips on how to build and grow your website, visit our YouTube channel. We’ll be waiting for you!
Making your WordPress website accessible is not only good design practice, but it also ensures that everyone has equal access to your web content and applications. This means that every visitor, regardless of their disability or impairment, can access and use your website. This is important considering that one in four adults in the United States has some kind of disability. In other words, if you don't build with accessibility in mind, up to a quarter of your site's visitors may have difficulty accessing your content. Fortunately, there are a number of guidelines you can use to check your web design and functionality. The W3C standards describe several levels of accessibility. Of course, you should also take laws and regulations into account, because accessibility is also a legal matter. In this video we take a look at what web accessibility means. We'll also look at some of WordPress' new additions that make accessible design easier. There's a lot to discuss, so let's get started! #1. Make sure your website is keyboard friendly. To put it simply: for a website to be accessible, it must function without the use of a mouse. Therefore, your goal should be to ensure that all web content and navigation can be accessed via Tab. To help you with this, WebAIM offers a practical guide to designing accessible keyboards. https://webaim.org/ #2. Make sure all content is easily accessible for the visually impaired. This isn't usually a problem, but it can be an issue if a page contains dynamic content. In short, content is dynamic when it can change without reloading the page it is on. This can become a problem if the website does not inform the help tools of the change and the user then misses the new content. One way to do this is to use ARIA landmarks. #3. Add Alt Text to All Images If you add images to WordPress, you've probably noticed this field. Here you can enter the alternative text for an image. This text serves as a replacement for the image if it cannot be loaded. However, screen readers also access alt text (sometimes called alt attributes, alt descriptions, or alt tags) to “read” the image for blind people. Therefore, you can use this field to describe an image and provide context to users who would otherwise miss it. #4. Choose your colors carefully. We often talk about color blindness as if it were a black and white problem. However, it is more of a spectrum because different people perceive colors in different ways. Therefore, you need to make sure that the colors you choose on your website have good contrast to ensure that everyone can distinguish the different elements on the page. The most pressing problem is ensuring that the text stands out from the background. Ideally, you should juxtapose a dark color with a light one, making sure they don't blend into each other. #5. Use headers to properly structure your content. Another important task to ensure your website is accessible is to structure your content through careful use of headers. This will make your content much easier to understand and digest. Additionally, clear headers also help screen readers interpret your pages. This makes providing in-page navigation much easier. This is also quite easy as you just need to make sure that you are using the correct heading levels in your content. #6. Use tables only for tabular data. When it comes to displaying data, tables come in handy. They make it much easier for all users, including those using assistive technologies, to analyze large amounts of data. However, to get the most benefit, keep your tables as simple as possible. #7. Enable scalable text that won't break your website. Most devices and browsers allow users to change text size, which can be helpful for people with visual impairments. However, if you don't design your website to support this feature, changing the text size could break your design or make your website more difficult to interact with. #8th. Avoid automatic media and navigation. Autoplay of media files has been a bane of internet users since the days of MySpace. As annoying as it can be to have music or videos start when a page loads, this is an even bigger problem when it comes to accessibility. #9. Create content with accessibility in mind. Finally, we come to the core of your website: its content. While making your website accessible is extremely important, you should keep the same considerations in mind when creating content. Web Content Accessibility Is Important Ensuring your website is welcoming to as many people as possible should be a top priority. There is no reason to exclude anyone, especially since it is relatively easy to avoid it. Not only will your users thank you, but you'll likely see benefits in the form of increased traffic and conversions. Thank you for joining us. You can find more helpful tips on building and expanding your website on our YouTube channel. We are waiting for you!
#website #accessible
https://i.ytimg.com/vi/YglJRnDS_o4/hqdefault.jpg
