Did you know?

According to a survey, 70% of visually impaired people who use a screen reader use it on a mobile device with a view to Internet accessibility.

If you design a mobile app that will have more accessibility such as voice recognition and custom view controls, you will be able to reach a larger audience.

Web Content Accessibility Guidelines provide comprehensive best practices for developing and maintaining accessible websites and applications for desktop and mobile users. The latest WCAG guidelines, known as WCAG 2.1, set modern standards for barrier-free mobile technology with the aim of exceeding current legal requirements and achieving improved accessibility for users of mobile devices.

BarrierBreak believes that making any website or application accessible on mobile devices is equally important as making them accessible on desktops. We provide a very cost effective mobile accessibility testing service and follow a considerate approach towards ensuring accessibility of your mobile applications.

What is Mobile Accessibility?

Accessibility is the design of mobile apps for people with disabilities. The Web Accessibility Initiative of the World Wide Web Consortium (W3C) has developed a series of best mobile practices to eliminate all kinds of barriers for disabled users.

According to the W3C Web Accessibility Initiative, mobile accessibility refers to making applications accessible to people with disabilities when using mobile devices. Various guidelines from operating system giants such as iOS and Android as well as the World Wide Web Commission (W3C) integrate accessibility into the design of mobile apps. Mobile site and native app testing methods are also available through Creative Commons funds, which can be used in conjunction with WCAG to ensure that websites and apps are accessible for people with disabilities when using mobile and tablet devices.

The Merit of Mobile Accessibility

One of the best things about advancing mobile applications and smartphones is enabling people with disabilities to access the mobile world. The transition to accessible mobile technologies is essential to continue our progress towards a fairer society that does not exclude people with disabilities and handicaps from the benefits of digital tools and services. When we talk about accessibility in the mobile environment, it means that websites and apps for handheld devices can be used by people with disabilities.

As the mobile accessibility expert Paul J. Adam wrote in Part 2 of the Mobile Applications and Litigation series, it is easy and frequent to develop mobile websites and applications that work well but have features that prevent disabled users from viewing, using and navigating the mobile app or website.

This shows why it is so important to implement accessibility in the development of mobile apps. To ensure that your application is accessible, your design and development team must avoid common application development practices that prevent users with disabilities from accessing and using your app or encoding your mobile website or application. Designing and developing barrier-free mobile apps is an indispensable part of any company’s mobile app development, given that it is best practice to have bonus features.

The Conundrum

When creating or purchasing mobile apps, many institutions overlook the importance of mobile accessibility. One reason many organizations are slow to adopt new standards to help disabled users of mobile devices is that their websites and apps are not yet compatible with the digital accessibility of their mobile experience. The slow progression in mobile accessibility is due to the fact that many developers and product teams do not realize how much of the former is applicable to people with disabilities.

Web Content Accessibility Guidelines (WCAGs) apply to mobile websites and native apps, but they were developed before mobile phones were as ubiquitous as they are today. WCAGs do not cover all aspects of mobile accessibility, and conformance with WCAG2 or WCAG 2.1 will not provide users with disabilities with an accessible experience.

Conclusion

Our team of accessibility testers offer solutions that follow the principles of accessibility testing and promote the importance of mobile accessibility testing to achieve barrier-free products. It is crucial for your business to enhance its Web presence, including mobile apps and strong social media profiles but we will use mobile accessibility to talk about your business’s access to reliable mobile services and how you can deliver for your customers.

When companies bring applications to market, they should consider mobile accessibility testing as an important factor in a world where the population is aging, and older adults are at greater risk of disability.

Get in touch with BarrierBreak, to know why accessibility testing is important and how we can support you with mobile accessibility testing.

The post Importance of Mobile Accessibility appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Recently, we were contacted by a company that was looking to create accessibility overlays for their website. We have been meaning to do a blog post about what accessibility overlays are, so we decided to take this opportunity to dive into the topic a little deeper.

We are seeing a digital transformation due to the pandemic and organizations are recognizing the need to provide an inclusive user experience to their customers. In addition, ADA-related lawsuits have increased by 23% in 2020. Though this has focused much-needed attention on digital accessibility, many organizations are also seeking quick fixes such as accessibility overlays to avoid accessibility lawsuits.

What are Accessibility Overlays?

Accessibility overlays and tools are automated software solutions that claim to detect and solve accessibility problems on the web. Accessibility Overlay tools typically apply JavaScript codes to make improvements to the front-end code of the website and quickly fix accessibility issues. There are various types of accessibility overlays with tool-based options such as toolbars, plugins, JavaScript and hardware models.

What do Accessibility Overlays offer?

If you want to make your digital solutions accessible online, accessibility overlays and widgets are one of the possibilities you’ll encounter along the way. Their goal is to make the websites accessible without having to change the source code underlying, ensuring accessibility in a fraction of the time and cost.

In the market for a quick fix, accessibility providers promise that accessibility overlays can make the necessary repairs to your website, help you resolve WCAG conformance issues in seconds, and do so at a fraction of the cost of other accessibility solutions.

Disadvantages of Accessibility Overlays

• 70-80% of the problems are not detected by the overlay. Overlays do not address accessibility problems in the source code, which means that people with disabilities are unable to navigate a website and access information at the same level.
• Issues such as unlabeled buttons and fields are not addressed, as are keyboard navigation, images, alt-text and other common accessibility issues.
• The problem is that while overlays can make websites more responsive to include accessibility tools, they can also make pages too rigid to be adaptable and override user preferences.
• There are also legal risks when an overlay creates a barrier for people with a disability in their experience with the site.
• Some users find overlays disruptive to their own access tools and they have manipulated their browsers to block overlays.

“Personally, I wouldn’t put an overlay on BarrierBreak’s website, so why would I advise customers to use overlays. If your organization focuses on inclusion, then Overlays are not the answer. Invest in Accessibility by building accessible products and solutions not by using a quick fix that can break at any time.”  Shilpi Kapoor, CEO at BarrierBreak

Why do we not advocate or recommend Accessibility Overlays?

• As per the WebAIM Survey of Web Accessibility Practitioners on accessibility overlays – 67% of respondents rate these tools as not at all or not very effective. Respondents with disabilities were even less favorable with 72% rating them not at all or not very effective, and only 2.4% rating them as very effective.
• Most providers that offer accessibility overlay widgets are solutions that combine aspects of overlay widgets to create their end product. Apart from the obvious problem of non-compliance with ADA regulations and the resulting lawsuits, accessibility overlays fall apart in many ways.
• Even the National Federation of the Blind has revoked accessiBe’s sponsorship saying that National Convention Sponsorship Statement Regarding accessiBe wherein they state “the Board believes that accessiBe currently engages in behavior that is harmful to the advancement of blind people in society. In particular, it is the opinion of the Board that accessiBe peremptorily and scornfully dismisses the concerns blind people have about its products and its approach to accessibility.”

There is no shortcut to an accessible design! Providers whose sole purpose is to ensure the accessibility of the website and to avoid lawsuits for overlays do not have a good track record in bringing lawsuits.

Get in touch for a 30 min tête-à-tête focused discussion on accessibility and personalized advice to forward your organization’s accessibility journey.

The post Why should you stay away from Accessibility Overlays? appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Did you know that all public sector bodies in the United Kingdom must comply with updates to UK digital accessibility regulations – The Public Sector Bodies (Websites and Mobile Applications) (No.2) by September 23, 2020?  

The accessibility regulations which came into force on the 23rd September 2018 aims to help make sure online public services are accessible to all users, including people with disability.  

The Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 mean public sector organisations have an obligation to make websites and mobile applications accessible. Public sector bodies include central government, local government organisations, some charities and other non-government organisations in the United Kingdom.   

Public sector bodies must adhere to EN 301 549 and comply with the accessibility requirement as follows: 

1. Public sector websites published on or after 23rd September 2018, should meet the accessible regulations by 23rd September 2019. 
2. Any other website of a public sector body published after 23rd September 2018, should meet the accessible regulations by 23rd September 2020. 
3. A mobile application of a public sector body should meet the accessible regulations by 23rd June 2021. 

How do you make sure that your services comply Accessibility Regulations 2018? 

1. Understanding Accessibility Requirement: The accessibility regulations require public sector bodies to make websites and mobile applications more accessible by making it ‘perceivable, operable, understandable and robust’. The regulations also require the entity to include and update an accessibility statement on the website.
2. Check your websites and mobile applications for accessibility: Analyse your website and mobile applications with your team to check whether they meet the international WCAG 2.1 AA accessibility standard. If your organisation does not have the required skill set to audit whether the website or mobile app is WCAG 2.1 AA compliant, you can consult a third party to do a detailed audit instead. 
3. Planning & Fixing Accessibility Problems: Once you have analysed the accessibility problems, chart out your priorities and a roadmap to meet the accessibility standards. You can always get in touch with an accessibility consultant to help you test your website or mobile applications for accessibility and also prioritise how to fix the problems. The deadline for meeting this requirement has been mentioned above.  
4. Publishing an Accessibility Statement: The new regulations then require you to publish an accessibility statement that explains how accessible your website or mobile app is in plain English and accessible format that can be understood by everyone. The statement should describe whether the website or the mobile applications is fully accessible, partially accessible or not accessible in detail. 

If you are looking to understand the new regulations in detail or need any assistance towards accessibility solutions for your website or mobile applications, get in touch with our accessibility experts.  

The post 23rd September, 2020 – Finally, Public Sector Bodies need to comply with UK Digital Accessibility Regulations appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

It was a long train journey from Ontario to Alberta where I met Amelia. She was accessing a website on her laptop using high contrast mode. I observed her for a certain period of time. Then out of curiosity tend to ask her why she is using the high contrast mode. In response to my question she said that her eye is sensitive to the colors used on the site due to which she finds it difficult to read the text. On further conversation with her I found that she was having Protanomaly, a type of color-blindness that has reduced sensitivity to red light. I was unaware of the term protanomaly, so I tried to research on it and found that there are so many users who cannot read the text on website easily due to the low contrast ratio.

Every user sees the web page differently. So, now let’s see how various color-blind users see a web page. So here are simulated views with different types of color-blindness:
Normal view:

Simulated view :

• Color blindness that has reduced sensitivity to red light /Protanomaly
• Color blindness that has reduced sensitivity to Green /Deuteronomy

• Color blindness that has reduced sensitivity to Blue /Tritanomaly

After going through the different simulated view you must be feeling that it’s a big task to choose the right colors that would work for widest range of users ?

The next question that comes to mind is what colors should one use? Use colors that contrast well.

So what is the contrast that work for widest range of users?

Web Content Accessibility (WCAG) 2.0 provides parameters  and contrast ratio to determine whether the two colors have sufficient contrast. Lets see what it says.

What WCAG 2.0 says about Color Contrast?

1.4.3 Contrast (Minimum): The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: (Level AA)

• Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;
• Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
• Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement.

So now that we have understood what are the color contrast requirements as per WCAG how can we ensure that the colors we have used meet the specified contrast requirements.

There are tools available that help in checking the contrast between foreground and background. Here are few tools.

Tools Used to check Color Contrast:

So here are some tools that I found handy to check the color contrast ratio:

• Colour Contrast Analyser – by The Paciello Group : It is a desktop application that works on MAC too.
• WebAIM: Color Contrast Checker  : It allows you enter the background and foreground color to check the contrast requirements. It also provides lightness slider to adjust the shades of color to meet the contrast.
• ColorZilla – It’s is a Firefox extension that helps in checking contrast of various colors on website.

These are some of the tools there are many more tools available to check the contrast ratios.

How can we meet Color Contrast?

• Sufficient color contrast: For text to be readable by all user’s sufficient color contrast is required between foreground text with the background. You must be wondering how can we say a particular color has a sufficient contrast with its background?
  Let’s see what all things do we need to check to say our site has sufficient contrast.
  • For text: Every website has lot of content in it. So, lets see the how can we make the text readable for all users without having any difficulties.
     In the below image the pure orange (#F28500) “Accessible Documents” text has a contrast ratio of 2.6:1 with white (#FFFFFF) background. Thus, users with color blindness and low vision users might find it difficult to read such text. We can make the  foreground color shade darker to meet the contrast ratio of 4.5:1. So for the same discussed example, we take a darker shade of orange (#F28500) colour i.e. #B45C15. Now let’s see the contrast. The Strong orange (#B45C15) “Accessible Documents” text has  a contrast ratio of 4.7:1 with white (#FFFFFF) background that meets the requirement of 4.5:1.
  • Text on image: When text is provided on image with low contrast it strains our eyes which may lead to people ignoring the text. Thus, text on image should be avoided but if needed special care must be taken to ensure that the text is both clear and readable to users .
     The text contact us is placed in an image of varying color shades due to which the text is not readable for people with low vision and color blindness. The white (#FFFFFF) text Contact us has a contrast ratio of 1.4:1 with the background image. To make the text clearly visible we can make the background darker or provide a color overlay behind the text to meet the contrast requirements. For the example discussed above we can add an overlay as shown in the screenshot below. The white (#FFFFFF) text Contact us has a contrast ratio of 9.6:1 with the background Dark grey (#454545) overlay.
  • For key images: Key images provide vital information to the user hence it is necessary. Thus, it is important to have sufficient contrast of the key image with the background. Alternatively, we can provide the textual description that meet the contrast ratio besides the key icon. For example, consider the next image button shown below.
     The white (#FFFFFF) next icon has  a contrast ratio of 2.7:1 with green (#4DB052) background. Thus, users with color blindness and low vision users find it difficult to identify the purpose of the icon.
     The black (#000306) alternate text “Next” is provided adjacent to the key image with white (#FFFFFF) that meets the contrast.

• High contrast themes: Provide user with alternative to access  the web-page with different contrast scheme such as  ‘style switcher’ option that will allow the user to select an alternate page style that adheres to the colour contrast ratios.
  For example, the Newzhook website (https://newzhook.com/) provides its users with 2 color schemes i.e. default and high contrast to make its text clear and readable.
                           

• Font size and style: If the website design or presentation doesn’t let you change the colors, then we can increase the font size or make the text bold to meet the contrast ratio of 3:1.Along with the color, the font size and style also play an important role for designing an accessible page. These are the other techniques to meet the contrast ratio of at least 3:1.
  • Text is 14 point and bold.
     The button text “Download App Now!” has a font size less than 14 and the white (#FFFFFF) has a contrast ratio of 4.3:1 with the orange (#D94900) background.Now that the text size of “Download App Now!” is increased to 14pt and made bold it meets the contrast ratio for large text.
  • Text is at least 18 point if not bold .
     In the example below, we see that the strong orange (#CD7012) text Digital Accessibility Consulting has a contrast ratio of 3.5:1 with the white (#FFFFFF) background. Here the text is of size less than 18pt. Hence, we cannot consider as large Text.For the above-mentioned example, we can increase to text size to more than 18pt so as to meet a sufficient contrast with the background.

Color Contrast is vital to accessibility and these are some of the ways where we can meet color contrast with a difference. Do share your views if you have any other techniques to meet the contrast requirement.

The post Meeting Color Contrast with a Difference appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

This approach of building accessibility and inclusion for only one group at a times, is not really practical.

Let me share how I see it with a very real world example. Let’s take the example of an elevator which will be used by lots of different people with diverse needs. Imagine if we went with only one disability at a time, when we thought of accessibility. Let’s look at the needs one at a time:

• For the Visually Impaired people – we can put braille labels and auditory sound to announce the floors. But now how would someone who can’t hear or can’t read braille manage.
• For the Deaf and Hearing impaired people- we can have an indicator with the floor, but how does a visually impaired know the floor.
• For the Mobility Impaired people – if the indicators are so high, that a person on a wheelchair can’t reach, wouldn’t they have a problem.

Now imagine, we went about implementing these suggestions, one at a time rather than looking at them holistically. What do you think would make sense? Let’s look at it holistically right.

That is kind of like building for the web. Whether it is that you are building a website or a mobile app, you don’t know who is going to come and use your website or mobile app. Do you really want to build separate or solutions only for one group of people?

Web Content Accessibility Guideline by the W3C actually considers the needs of users with diverse needs including:

• visual
• auditory
• speech
• cognitive
• neurological
• physical

Believe me, you would rather invest in making your website accessible to all groups rather than only one group in this day and age where we have users who are using speech recognition, apps that read out, eye tracking, touch devices.

One group that is always ignored on the web is the deaf and hearing impaired. Now think of how many times have you watched a video with captions and you might not be hearing impaired.

The benefits of accessibility go way beyond the visually impaired and even in that beyond the screen reader users. There are users who use magnification, larger text size, braille, and so much more.

Get in touch with us at sales@barrierbreak.com for testing mobile sites and native apps for accessibility. Let us build and implement web accessibility for all!

The post I want to make a Mobile App Accessible to Visually Impaired! Really? appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.