E-mail List Archives
Thread: Testing via disabling CSS file
Number of posts in this thread: 3 (In chronological order)
From: megha patangi
Date: Wed, Jul 05 2023 11:04PM
Subject: Testing via disabling CSS file
No previous message | Next message →
Hello all,
I have a question with respect to the testing technique by disabling CSS.
I wanted to know the following:
1. How beneficial is to test a webpage by disabling CSS?
2. What are the main requirements which can be checked and confirmed
by this method?
3. Is there real time scenarios also, where end users interact with
web after disabling CSS, or this is just a testing technique?
4. If the entire DOM structure is not effected after disabling CSS,
but the visual pattern of text, links, buttons etc are gone, for
example: links are no longer underlined, but still work as link, no
borders around buttons but still they receive tab stop and rendered by
label, are such scenarios fall as failure of WCAG?
Regards,
Megha
From: Steve Green
Date: Thu, Jul 06 2023 12:50AM
Subject: Re: Testing via disabling CSS file
← Previous message | Next message →
WCAG 2.1 does not require websites to work without CSS. However, if you use the W3C Website Accessibility Conformance Evaluation Methodology (WCAG-EM) 1.0 or the Report Tool, one of the requirements is to specify the relied-on technologies. If you want to claim that CSS is not a relied-on technology, you will need to test with it turned off.
https://www.w3.org/TR/WCAG-EM/
https://www.w3.org/WAI/eval/report-tool/evaluation/define-scope
If you do this, you potentially need to test all the success criteria with CSS turned off. If the website wasn't specifically designed with work without CSS all sorts of things could go wrong. Anything hidden using "display:none" or the "clip" technique or positioned off-screen will become visible, which may or may not be a problem. CSS content will not be displayed.
Links will be underlined, and both links and buttons will receive focus and have focus indicators, so you don't need to worry about that. "Proper" buttons will have a border, but <div role="button" tabindex="0"> buttons won't - you will just see the text. They will receive focus and have focus indicators. But there's lots more that can go wrong.
There are still a small number of people who use text browsers that don't support CSS. Only a month or so ago a Lynx text browser user complained on the WAI forum about her inability to use a Google survey. She said that other user agents do not meet her needs. See https://lists.w3.org/Archives/Public/w3c-wai-ig/2023AprJun/0016.html
There are a number of reasons you might want to test with CSS turned off, such as:
1. Legislation or a commercial contract might require it. For instance, the GDS Service Standard says that all UK central government websites must work without CSS, JavaScript or images.
2. You want to support the widest possible variety of user agents and user preferences.
3. You are a masochist and like to build websites using progressive enhancement because it's good engineering practice, not because you actually need to.
4. You want to see if there's any hidden content you don't know about. I find there are often components such as dialogs, widgets or error messages that are only displayed under certain circumstances, and you may not know about them if you don't have a full functional specification.
5. You are testing for conformance with WCAG 1.0 for some reason.
Steve Green
Managing Director
Test Partners Ltd
From: glen walker
Date: Thu, Jul 06 2023 7:54AM
Subject: Re: Testing via disabling CSS file
← Previous message | No next message
6. You can see the reading order (WCAG 1.3.2). If CSS is used to move
things around so that visually the order makes sense but the actual DOM
order does not make sense, removing the CSS should make that obvious. But
you can also test 1.3.2 by using a screen reader and navigate with the down
arrow key (or a "read all" key).
I never turn off CSS when testing. The only time I turn it off is for
personal use if I'm on a site that is trying to block content because I
have an ad blocker. Turning off CSS sometimes allows the content to be
displayed. I also use "reading mode" (built in to the browser) to get
around blocking content.