## V 3.2.0 accessibility: A big thanks

Do not post support requests, bug reports or feature requests. Discuss phpBB here. Non-phpBB related discussion goes in General Discussion!
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### V 3.2.0 accessibility: A big thanks

A few years back, I tried without success to persuade the development team that it was important to include far more support for assistive technology, i.e. screen readers. As a blind user, I set about modding my own board massively to provide the kind of support I envisaged. The result was that I was unwilling to repeat the effort for every upgrade, and so never upgraded from 3.0.9.

Circumstances have forced me to upgrade some time this year, and I looked at V 3.2.0 with some trepidation. Lo and behold, most of my suggestions from years back have been incorporated! The work seems to have been done pretty carefully and with considerable thought. Well done to whoever did it!

Having said that, my own mods go far further and I will be implementing them over the coming months.

I have nevertheless noticed a number of things that you probably only notice if you are a screen reader user yourself. Some examples:
• In the UCP, for instance, the navigation menu down the side (class = "navigation) has been assigned the role "navigation", which flags it as a landmark in the screen reader. This is good, but the primary navigation element in the UCP is actually the tab bar (class = "tabs"), and this should also be given the "navigation" role.
• Where there are two navigation roles (or search roles or whatever) on a page, and the screen reader has no other label to distinguish them, an ARIA label should be used to distinguish the two navigation areas. The same applies to the multiple search boxes on pages. This is because if I navigate using the landmarks in a screen reader, I hear that there are, for instance 2 search landmarks. I cannot decide from the list of landmarks which search area I need to go to unless one says "search entire board" and the other says "search this forum".
• On a topic page, there is also a search box to "search this topic" (which also has a "search" role assigned. However, all the search box does is to highlight the search term in the text. This is of no use to a blind user. That entire search box should be marked "aria-hidden".
Those are just three examples of ways in which usability could be further improved for blind users. I would be more than happy to provide more input if one of the developers familiar with this area were to PM me.

But my comment in the title applies. Well done on a good job.
It's only words...
Wordwizard.com
A_Jelly_Doughnut
Former Team Member
Posts: 34457
Joined: Sat Jan 18, 2003 1:26 am
Location: Where the Rivers Run
Contact:

### Re: V 3.2.0 accessibility: A big thanks

philwhite wrote:
Thu Jan 19, 2017 12:14 am
Well done to whoever did it!
Much of this work was done by Hanakin and Senky.
A Donut's Blog
"Bach's Prelude (Cello Suite No. 1) is driving Indiana country roads in Autumn" - Ann Kish
nicofuma
3.2 Release Manager
Posts: 546
Joined: Sun Apr 13, 2014 1:47 am
Location: Grenoble - France

### Re: V 3.2.0 accessibility: A big thanks

By the way, if you want to contribute your modifications directly in the core they are all welcome
Member of phpBB Development-Team
No Support via PM
warmweer
Jr. Extension Validator
Posts: 5325
Joined: Fri Jul 04, 2003 6:34 am
Location: Van Allen Bel ... gium

### Re: V 3.2.0 accessibility: A big thanks

philwhite wrote:
Thu Jan 19, 2017 12:14 am
...
I have nevertheless noticed a number of things that you probably only notice if you are a screen reader user yourself. Some examples:
...
I would like to thank philwhite for his post. You pointed out some things I probably would never have thought of.
I have a friend who is hearing-impaired and that made me realise how many things the unimpaired take for granted. Your post not only points out couple of oversights (no blame on the phpBB-team, it's impossible to think of everything), but also identifies the location of the problem and a way of solving it.

It's a refreshing read (as compared to some phpBB-bashing posts which solve nothing.
On the other hand, it is not open source, which means you cannot change it or publish it in a modified form.
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### Re: V 3.2.0 accessibility: A big thanks

Over the next weeks, I shall be adapting much of the work I did for 3.0.9, and I shall undoubtedly come across several areas which could benefit from further attention. I shall collate them all and either post them in Area51 or, preferably, PM them to one of the two developers mentioned above if I may do so.

This process could take several weeks, but I am more than happy to contribute again.
It's only words...
Wordwizard.com
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### Re: V 3.2.0 accessibility: A big thanks

nicofuma wrote:
Thu Jan 19, 2017 8:03 am
By the way, if you want to contribute your modifications directly in the core they are all welcome
Sorry, I forgot to respond to this.
Beyond what has already been done by the team and a number of additions that would probably be entirely uncontentious, my own modifications add a considerable degree of functionality that would not be acceptable for the default theme.

I will separate out the things that can be done in the default theme without any great difficulty for submission.

As for the rest, I may think about offering it as a style, but I am a strictly amateur programmer, and the Javascript used is very untidy, although it does the job. The biggest problem with the approach I have adopted is that the HTML will not validate, and I can think of no way of getting it to do so. But that is my problem.
It's only words...
Wordwizard.com
nicofuma
3.2 Release Manager
Posts: 546
Joined: Sun Apr 13, 2014 1:47 am
Location: Grenoble - France

### Re: V 3.2.0 accessibility: A big thanks

You can still upload it somewhere and give me a link (together with a link to your forum if it's public so I can see what it does^^), it can be a great help and source of inspiration if you don't have the time or motivation to contribute them directly to the core.
Member of phpBB Development-Team
No Support via PM
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### Re: V 3.2.0 accessibility: A big thanks

Edited to include two new items!

Thanks. Motivation is not the problem, but time and skill are!

The board is at http://www.wordwizard.com/phpbb3/index.php

Go to a topic with plenty of replies, such as this one and toggle the accessibility button in the header bar on and off. The topic page has the most visible difference. It reduces all the profile information, the editing options and most of the links to a couple of buttons, so the screen reader doesn't wade through all the ancillary information that sighted users ignore. But all the information is there on demand from the two buttons "Show short profile" and "Show post menu" in each post.

Other changes and functions off the top of my head:
1. All links, buttons and so on are always highlighted on focus, irrespective of whether accessibility mode is on or off. Just tab through the page to see. This helps sighted keyboard-only users to know where they are.
3. Screenreader-only text has been added in a number of places, such as the text "Sort by " in front of each column header link in the member list, or announcing forum categories as such in the forum list.
4. Some screen reader announcements to the effect that there is a special accessibility mode available.
5. A screen reader announcement if Javascript is unavailable (in which case no accessibility button appears).
6. Links on user names have been removed on the board listings in accessibility mode, as these turn the listing into a tab-fest for keyboard users and are a pain in the arse for screen reader users.
7. In accessibility mode, the post edit menu appears after the post in the DOM model, not before it (I don't know whether I want to quote/edit/flag up a post until after I have read it. Important issue here. Screen readers read a page in the order it appears in the DOM model, so declaring a right float before a left float, for instance will mean that the right float is still read before the left float. I'm sure this happened somewhere, but I can't remember where.
Points 1 and 3 above are candidates for the core.

As I said, the board is running V 3.0.9 at present, and the HTML does not validate, due to laziness on my part, lack of skill, and a couple of problems that may be intractable.

As I say, that would have to be a separate style, but some aspects could be incorporated in the core without any impact on the appearance and function of Prosilver.

As I say, I will try to separate out what I think could be incorporated in the core over the next few weeks (provided that my customers stop sending me inane jobs on short deadlines!).

While I am here, I posted on the styles forum and have received no reply. I remember there being a lot of talk before V 3.1 that style-specific language variables would be supported. Was this done, and if so, where does the relevant PHP file go? On my modded board, I just did the quick and dirty option of incorporating the accessibility language strings in with the common strings. I can do what I want on my own board, but not if I want to tidy everything up and possibly release an accessibility style.
It's only words...
Wordwizard.com
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### Re: V 3.2.0 accessibility: A big thanks

Okay, so it's coming along nicely now. I have incorporated much of the basic material that could go into the core, but I need to have a good listen to every page now.

These two screenshots give you a good idea of what a difference the addition of further landmarks and ARIA labels makes. They were taken with the NVDA screenreader, which is not particularly sophisticated, but is free and is in widespread use. They show the landmarks for the UCP in the current prosilver style and in a modified prosilver style:

Prosilver as is

When the list of landmarks is read to me, I can immediately hear which one I want to go to. Makes a big difference.

Sorry about the size of the pics. It's the screen magnification I use (coupled with another 4x screen magnifier and a screen reader!).
It's only words...
Wordwizard.com
Ger
Recognised Extension Developer
Posts: 1961
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

### Re: V 3.2.0 accessibility: A big thanks

Just want to drop in and express my respect to your work.

Can I also ask about your opinion regarding more complex stuff? I'm working on a science board, currently running on IPB but converting to phpBB. We have BBcodes to write LaTeX, mostly to facilitate writing formulas.

This enables them to write stuff like:

Code: Select all

$$K(s)=\frac{U(s)}{\phi_{error}(s) }=K_c(1+\frac{1}{\tau_{k}s})=K_{c}(\frac{1+\tau_{k}s}{\tau_{k}s})=K_c+\frac{K_i}{s}$$
Which than translates to:

(basically an image with the md5 hash of the formula as the filename)
I am rewriting the class that translates the given LaTeX-formula to an image. What do you think the best approach would be to make such formulas accessible for assistive technology?
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.

Like my work? Buy me a coffee to keep it coming.

-Don't PM me for support-
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### Re: V 3.2.0 accessibility: A big thanks

Not being a scientist, I have no idea how a blind person would want to hear a formula such as that. Essentially, you would have to translate the formula into natural language and then put that natural language string inside a tag pair immediately after the image.

Code: Select all

<span class="sr-only>Formula in spoken form</span>
This only works with the default V3.2 stylesheets that include the tag "sr-only". Otherwise you have to define it in your custom CSS. phpBB does it like this (in utilities.css), but there are other ways as well:

Code: Select all

.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}

This makes the text invisible on screen, but allows screen readers to "see" it.

You are on your own with the translation of the formula to natural language, I'm afraid. You will have to talk to some blind scientists and mathematicians. There are a few papers online as well, and it is possible that someone has a library somewhere. Seems like a mammoth task to me.
It's only words...
Wordwizard.com
Ger
Recognised Extension Developer
Posts: 1961
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

### Re: V 3.2.0 accessibility: A big thanks

philwhite wrote:
Mon Jan 23, 2017 11:56 am
Seems like a mammoth task to me.
Wow, indeed. I hoped screenreaders could translate LaTeX into something useful. I found this
They write there that formulas on This wikipedia page can be read by a screen reader. On Wikipedia it's represented with the original formula as alt-text.

If you can confirm this for me, I can try to implement this for our board as well, making it accessible for you.
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.

Like my work? Buy me a coffee to keep it coming.

-Don't PM me for support-
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### Re: V 3.2.0 accessibility: A big thanks

For a random example from the Wiki page, the alt text contains

Code: Select all

alt="\left(x+{\frac {b}{2a}}\right)^{2}={\frac {b^{2}-4ac}{4a^{2}}}."
Without making any special settings on the screenreader, this is read as
left x+ frac b 2a right 2 frac b 2 4ac 4a 2
which is not a great deal of use.

If you switch your screen reader to read all charactersit will read all the brackets and symbols and so on as you arrow through the text. The equation is still only comprehensible if you understand LaTEX syntax. I don't.

I don't think there are any screenreaders out there that actually interpret LaTEX.

You really need to install the free NVDA screen reader and listen for yourself. It's what I use when developing applications or designing web sites, as it represents the lowest common denominator. The premium screen readers such as JAWS are far more sophisticated, but unaffordable to ordinary folks. If your solution works with NVDA, it will work on any screen reader.
It's only words...
Wordwizard.com
Ger
Recognised Extension Developer
Posts: 1961
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

### Re: V 3.2.0 accessibility: A big thanks

My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.

Like my work? Buy me a coffee to keep it coming.

-Don't PM me for support-
philwhite
Registered User
Posts: 122
Joined: Wed Aug 22, 2007 12:47 am
Contact:

### Re: V 3.2.0 accessibility: A big thanks

nicofuma wrote:
Fri Jan 20, 2017 8:32 pm
You can still upload it somewhere and give me a link (together with a link to your forum if it's public so I can see what it does^^), it can be a great help and source of inspiration if you don't have the time or motivation to contribute them directly to the core.
I have now sent you a PM detailing some initial proposals.
It's only words...
Wordwizard.com