Hop on the accessibility WAVE

Accessibility is becoming more and more of a buzzword in the IT world. Why? We want to make our products more accessible not only to gain more users but also because it just feels good to invite everyone to use what we create – despite their disabilities.

As a QA specialist, my role is to make sure that the provided solution matches customer needs. But not only that – we should go beyond this, to propose and support solutions that are accessible to all, including those impaired in some way,

Fortunately enough, there are tools to help us test our products for the accessibility, to see what we already did right and what could we possibly improve.

The WAVE comes in

Today, I would like to share with you one of my personal favorite tools for quick accessibility testing of web pages and web applications – WAVE. This browser extension will not do all the work for you, but it will give you solid ground for accessibility assessment. It is fairly easy to use, but it requires some knowledge of web page architecture and accessibility requirements. As the creators themselves say:

“The WAVE Chrome and Firefox extensions allow you to evaluate web content for accessibility issues directly within Chrome and Firefox browsers. Because the extension runs entirely within your web browser, no information is sent to the WAVE server. This ensures 100% private and secure accessibility reporting. The extension can check intranet, password-protected, dynamically generated, or sensitive web pages. Also, because the WAVE extension evaluates the rendered version of your page, locally displayed styles and dynamically-generated content from scripts or AJAX can be evaluated.”

With that out of the way, if you want to try for yourself:

The Chrome extension can be downloaded here.

The Firefox extension can be downloaded here.

After installation, the WAVE extension plugin will be shown on the browser bar. It will be grey when turned off (default state).

1

Now that we have the WAVE in our toolbox, it’s time to get to work! For our demonstration, I chose one of the most popular news sites in Poland – onet.pl. According to the Gemius / PBI survey in April this year (2019), Onet’s main page was visited by 11.12 million Internet users and each spent an average of 61 minutes and 9 seconds.  This seems like a web page we would expect to have a high level of accessibility from.

It’s also worth mentioning that we’ve also worked with Onet in the past – particularly in the area of Machine Learning and image recognition – so we know the website and the company behind it take great care to ensure a high-quality release.

Setup

All we need to do is to open a new tab in our browser – I chose Firefox Quantum, version 67.0.4. I also disabled all other plug-ins I have, because I do not want them to potentially influence the result. Then I went to the onet.pl page and clicked the WAVE icon on the browser menu bar to switch it on. WAVE quickly worked through the page and showed its results in the panel on the left side of the browser, while element markers were also shown on the page itself.

2

 

Reading and interpreting the information

 

WAVE panel

The first thing WAVE shows us is the Summary tab. It contains a list of all the issues found on the page: errors, alerts features, structural elements, HTML5, ARIA and contrast errors – it also shows the number of issues in each category.

To go through the detailed list and see exactly what problems WAVE found, we go to the second tab – Details – as marked by the flag. This is where the fun starts!

3

Firstly, we can filter issues related to either of the given standards. Just to give you some quick information: “WCAG stands for Web Content Accessibility Guidelines and helps to keep the internet accessible to everyone no matter what their needs are or what modifications they may require[1].” Article 508 is the US law for assuring the accessibility of software and web-based Internet information and applications.

  1. WCAG 2.0 AA – For Level AA conformance, the web page satisfies all the Level A and Level AA Success Criteria, or a Level AA conforming alternate version is provided.
  2. WCAG 2.0 A – For Level A conformance (the minimum level of conformance), the web page satisfies all the Level A Success Criteria, or a conforming alternate version is provided.
  3. Article 508
  4. Full – All of the above (default)

When choosing the filter in WAVE, we take into consideration if the web page (application) is to be used in the US (if so, we would turn to article 508) or, rather, it has to conform to the international standards of WCAG. In our example, I choose the full filter to see all issues for the purpose of this demonstration.

When we have our filter chosen, we can browse the list of issues. These are categorized the same way as the summary tab, which we already say. Here, we can check and uncheck boxes to see or hide issue markers on the page – this is very useful when you want to quickly see only one issue category or all occurrences of a specific issue type.

Next to each issue type, a blue information icon is shown. This is one of the reasons I love using WAVE – easy information access. When you click the icon details, information about the type of the issue will be shown in the Documentation tab, containing explanations as to:

  • What it means
  • Why it matters
  • How to fix it
  • The algorithm… in English
  • Which exact part of which standard this violates (linked to the standard text, so you can easily find it and read more)

In short, it’s all the info you could need – no matter if you are an experienced or not-so-technical person. WAVE will help you understand exactly what is going on and why is it worth fixing. This isn’t even mentioning that it is a quick way to learn about standards and web pages. Killing several birds with one stone always feels good 😉

The documentation tab can also be used as a source of information for the accessibility testing report.

3

If we’d like to see where the issue occurs, we should click on the square icon in the Details tab and the page will be scrolled to the relative element, which itself will be marked with a red dotted line. It, of course, also works the other way around – clicking the square icon marked on the page will show a pop-up with the issue name and link that will open in the Documentation tab. Easy-peasy, right?

WAVE offers three modes for browsing the page with elements marked:

  1. Styles – the default view
  2. No styles
  3. Contrast

The style mode is mostly used to track the issues on the page, see where they occur if there are any clusters of issues etc.

Alternatively, the no styles mode will show us how the page will look stripped of styles, as this is how some sight-impaired users may use the page.

Finally, the contrast mode focuses on places where, because of the low contrast between text and background, the text itself might be harder to read. Again, we can get more information on the issue type in the Documentation tab after clicking the blue information icon.  We can also see how the page will look in black and white (for people who have trouble seeing colors), using the “desaturate page” option.

For each of the contrast errors, we can try to change the foreground and background colors to find a possible solution to increase the visibility of the respective elements.

5

 

Closing time

Deciding which issues are the most important and should be recommended as the first to fix is the most complicated part of the process. It depends on the type of the web page or application, which standards it has to apply to and why. Government pages are obligated by law to be accessible, while a page selling clothes may want to only hold up to some parts of WCAG.

In our chosen example, I’d recommend focusing on the missing document language, broken or empty links, and non-script elements. These fixes are quite easy to implement and will improve the accessibility of the site, ensuring that more people can enjoy getting the latest news.

Let me stress once again how important this is – making sure that the solution we deliver (application, web-page, desktop, mobile etc.) can be accessed and used by the variety of users is not only a question of a good business decision. This is also an ethical choice. In the modern world, limiting impaired people’s possibility to have the same access to what technology provides, as not impaired is discrimination.

The societies od developed countries are growing older. With that higher percentage of users will be dealing with some impairment that comes with age as Isabel Evens warned us on Test:Fest 2019. Keep that in mind my QA friends 🙂

[1] https://userway.org/blog/what-are-wcag-20-a-aa-and-aaa

Something new, something cool…

As I was yesterday coming back home after a meetup, tired beyond measure after a hard week at work, I idly scrolled through my Twitter feed. There I saw a tweet from one Maxime Rouiller

twitter

It turns out I needed that kind of a kick, so in order to be a better writer and to google myself… I humbly give you tonights post.

There will be no code though, just something that is not new but what I consider cool. Some may think that working is software testing is a technical kind of a job. And they would not be wrong – if you want to be a tester, you got to learn a lot of the tech stuff. But you also learn about the business of your customers, business and goals of the companies you work for. But there is more, there is something I consider the core of my job – being part of a team.

I work in an Agile environment, which I really like (there is a post about Agile coming soon). I love testing, that much you probably already know. I enjoy unraveling the technical problems and intricacies – these are like a good puzzle. Without the people I work with, this would all be a lot less pleasant experience though. I had the privilege of working with some amazing people during my short, two-year career in QA.

Developers who answered my, sometimes really stupid, questions. Who taught me a lot and were willing to build the trust of our work relationship. Business analysts who do a lot of hard work by asking a lot of questions and answering a lot of those. One of BAs, a very nice woman named Ula, is my role model when it comes to being patient. Project Managers, who showed me the meaning of keeping your temper in check and balancing between the urge to satisfy the customer with doing right by the team.

Last but not least – all of the wonderful fellow testers who accompany me on this journey. Paula and Michał, who formed a “Bug, Honor, Reopen” team with me and we went to two TestingCup competitions together. Natalia, Tomek, Kuba, Rafał, and Sławek who, by their everyday doings, show the value of hard work, share the experience and honestly care about teaching others.

images

This post is to thank You all for creating real, working teams. To thank You for your effort for these teams to be more than the sum of all people creating them.

And to whoever is reading this post – I know we sometimes have hard days at work. We get angry at each other, we are angry, tired or sad. But remember – we are all part of a team, so just try to smile because together we will create something really awesome!

The Story Of My TestBash Adventure

also published at Ministry of Testing

Not so long ago (February 2018) and not so far away (Wrocław, Poland), there was a junior tester who really wanted to attend a TestBash Netherlands. One day, while scrolling her Twitter feed, she discovered that Ministry of Testing was giving away a three-day ticket as a scholarship to TestBash Netherlands. She decided to take her chances – she sat down, wrote an email about how much she loved testing and what it would mean for her to go to TestBash and be able to share the knowledge back at work, she hit send and kept fingers crossed…

Continue reading “”

7 sins of IT meetups…

Entry 18

Last time I promised to write about the meetups and their pros and cons.

I have mentioned multiple times that meetups/gatherings/conferences are one of the things that I love so much about being a QA. The sheer possibility of meeting other professionals, to learn from them, to hear what they did right/wrong, to discuss various topics with other people, may it be QAs, BAs, DEVs, Agile-rs … That is just great.

Until now, I think I have been to around 35-40 meetups/gatherings/conferences – generally speaking “meetings in real (not virtual) world when group of people from IT gather and listens to presentations, discusses, shares and exchange experiences”. When I was sitting at the last one, I started to write down what I liked about it and what was bothering me, and it got me thinking… Continue reading “7 sins of IT meetups…”

TestWarez 2017 – part 1

Entry 16

Finally, after two months ( sorry, busy with life), I got around to wrote about the great experience that was TestWarez2017. And, believe me, I can not overstate how GREAT it was. TestWarez, as I wrote here is the oldest and the largest Polish conference for all involved in and interested in Quality Assurance and I was able to go thanks to my employeer PGS Software – thank You so much guys!

20171116_115246

Ok, so, as promised I’d like to walk you through my thoughts about the presentations and/or discussion panels I attended.

Continue reading “TestWarez 2017 – part 1”

BuggyLand

Entry 15

As I was talking to a friend about my beginnings as a tester I remembered my struggles on how to report bugs during my internship, as we were given challenges rather than simple solutions…

insects_in_brockhaus_1937

Bugs of course come in all shapes and sizes, but the right bug report is essential Continue reading “BuggyLand”

TestWarez 2017 on the horizon!

Hi! Long time no see, huh? I wrote multiple times what a great thing it is to be able to attend all sorts of meetups and conferences for QA’s – to meet new people, hear new ideas and interesting insights. Since last year I had this quiet dream I would maybe, someday, possibly be able to go to TestWarez.

TestWarez is the oldest and the biggest Polish conference dealing with subjects of quality and testing – 2017 is marking it;s 12th edition. It is organized by Stowarzyszenie Jakości Systemów Informatycznych – Polish ISTQB board. It is known from the interesting topics, possibility to meet and learn from the best and epic parties.

Continue reading “TestWarez 2017 on the horizon!”

Take a testing walk with with Nielsen & Molich (or 10 heuristics for UI design)

Entry 13

Life is what happens when you are making plans… Well, I made a lot of plans and a lot happened instead, but no complaints here, because what keeps me so busy I have no time for blogging, are good things. I organize my wedding  and… I am a captain of Bug Honor Reopen team what will represent PGS Software in TestingCup – the Polish championship for software testers ( I’m sooo proud of our team!).

I personally like heuristics – when properly used they can help you a lot, whether you just start testing a specific thing or in a specific way or you have been doing the same thing in the same way for quite some time and therefor you are looking for some ‘fresh air’. When put to good use heuristic can be like a shortcut to get where you need to be quicker and easier.

Today I’d like to tell You about using ten usability heuristics for User Interface design brought to us by Jacob Nielsen and Rolf Molich. These were listed as directions for UI designers but we testers can use them to check whether the designs prepared for a customer will not only look nice but also be functional and help him in his business or, if we test an already existing things, what improvements could we propose to make the project better and more valuable. Continue reading “Take a testing walk with with Nielsen & Molich (or 10 heuristics for UI design)”

TestFest 2017

Entry 12

Do you like to sleep longer on Saturdays? Me too! Yet, on 25th of February I was really happy to get up at the ungodly hour of 7:00 AM. It was a  day of TestFest 2017! I was looking forward to it for the last few months and was overwhelmed with joy when I got tickets. I’m not over-exaggerating in here – getting the tickets for TestFest is like trying to get tickets to ComiCon  (but they are free, so maybe it’s even harder). I managed to get them as a consolation prize for not getting chosen as a speaker (and after I saw how good the people there were, I think it was a right decision).

testfest2017

What is TestFest, you ask? It is one of the biggest (if the biggest) free testing conferences in Poland, taking place in Wrocław and organized by 6 Testing Enthusiast (big thanks to all of them as they do a great job!). 2017 was a 3rd edition of this event, with over 20 speakers and more than 400 attendees. Tickets to attend were gone in minutes and people were talking about it on social media for two months before.

IMG_20170225_132900.jpg Continue reading “TestFest 2017”