@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.)
hq.recaptime.dev/wiki/Phorge
phorge
phabricator
1@title Assistive Technologies
2@group developer
3
4Information about making Phorge accessible to assistive technologies.
5
6Overview
7========
8
9Assistive technologies help people with disabilities use the web. For example,
10screen readers can assist people with limited or no eyesight by reading the
11contents of pages aloud.
12
13Phorge has some support for assistive technologies, and we'd like to have
14more support. This document describes how to use the currently available
15features to improve the accessibility of Phorge.
16
17
18Aural-Only Elements
19===================
20
21The most common issue assistive technologies encounter is buttons, links, or
22other elements which only convey information visually (usually through an icon
23or image).
24
25These elements can be made more accessible by providing an aural-only label.
26This label will not be displayed by visual browsers, but will be read by screen
27readers.
28
29To add an aural-only label to an element, use `javelin_tag()` with the
30`aural` attribute:
31
32 javelin_tag(
33 'span',
34 array(
35 'aural' => true,
36 ),
37 pht('Aural Label Here'));
38
39This label should be placed inside the button or link that you are labeling.
40
41You can also use `aural` on a container to provide an entirely different
42replacement element, but should be cautious about doing this.
43
44NOTE: You must use `javelin_tag()`, not `phutil_tag()`, to get support for
45this attribute.
46
47
48Visual-Only Elements
49====================
50
51Occasionally, a visual element should be hidden from screen readers. This should
52be rare, but some textual elements convey very little information or are
53otherwise disruptive for aural users.
54
55This technique can also be used to offer a visual alternative of an element
56and a different aural alternative element. However, this should be rare: it is
57usually better to adapt a single element to work well for both visual and aural
58users.
59
60You can mark an element as visual-only by using `javelin_tag()` with the
61`aural` attribute:
62
63 javelin_tag(
64 'span',
65 array(
66 'aural' => false,
67 ),
68 $ascii_art);
69
70
71Previewing Aural Pages
72======================
73
74To verify aural markup, you can add `?__aural__=1` to any page URI. This will
75make Phorge render the page with styles that reveal aural-only elements and
76mute visual-only elements.