[Skip navigation links]
Login

Stylesheet @media aural Screen reader compatibility

Last updated: May 20, 2018

Expected Result: causes problems in some screen readers

Actual Result: causes problems in 10 screen reader / browser combinations

For expected failures, the results show which AT combos the failures affect. Results are recorded from the user's viewpoint, so describe the user impact of authoring errors.

There has been conflicting information in various CSS specifications on the 'speech' and 'aural' media types.

Code used for this test:


        <style>
            div.aural-query-fail
            {
                display: block;
                color: black;
                background-color: red;
            }

            div.aural-query-pass
            {
                display: none;
                color: black;
                background-color: green;
            }

            /* change display state using aural media type */
            @media aural
            {
            div.aural-query-fail { display: none; }
            div.aural-query-pass { display: block; }
            }
        </style>

        <div class='aural-query-fail'>
            Aural Media Query - Fail
        </div>
        <div class='aural-query-pass'>
            Aural Media Query - Pass
        </div>        
    

Change History

Last updated: May 20, 2018

Screen readerBrowserModeNotesWhat the user hears
Fail NVDA 2017.3FF49 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail NVDA 2017.3IE11 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail NVDA 2017.3Chrome 66 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail JAWS 17.0.2619FF49 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail JAWS 17.0.2619IE11 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail WindowEyes 8.4IE11 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail VoiceOver OSX 10.13Safari 11.1 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail VoiceOver iOS 11.3Safari iOS 11.3TouchDoes not match 'aural' media type. Aural Media Query - Fail.
Fail Dolphin SR 16.06IE11 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.
Fail SaToGo 3.4.96.0IE11 ReadingDoes not match 'aural' media type. Aural Media Query - Fail.

Test notes

All tests were carried out with screen reader factory settings. JAWS in particular has a wide variety of settings controlling exactly what gets spoken.

Screen readers allow users to interact in different modes, and can produce very different results in each mode. The modes used in these tests are:

In the «What the user hears» column: