Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>You need two additional ways how to convey the meaning:</p> <ul> <li>another visual cue for users that can’t access the color</li> <li>semantic annotations for users that can’t access the visual design at all</li> </ul> <h2>Another visual cue</h2> <p>For repeals, strikethrough would be sufficient, as this is color-independent.</p> <p>For insertions, you should add an additional cue (see WCAG 2.0: <a href="http://www.w3.org/TR/WCAG20/#visual-audio-contrast-without-color" rel="nofollow">1.4.1 Use of Color</a>), for example a border, an underline, etc.</p> <p>See "<a href="http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G182" rel="nofollow">Ensuring that additional visual cues are available when text color differences are used to convey information</a>" for some more examples.</p> <h2>Semantic annotation</h2> <h3>with HTML</h3> <p>HTML(5) defines the elements <a href="http://www.w3.org/TR/2013/CR-html5-20130806/edits.html#edits" rel="nofollow"><code>del</code> and <code>ins</code> for "edits to the document"</a>.</p> <p>So your example markup should become:</p> <pre><code>&lt;del&gt;The Commissioners before whom an appeal under this section is brought&lt;/del&gt; &lt;ins&gt;On an appeal that is notified to the tribunal&lt;/ins&gt;, the tribunal must consider whether the registration of the pension scheme ought to have been withdrawn. </code></pre> <h3>with natural language</h3> <p>If you can’t use it, you would have to provide the start and end of both, repeals and insertions, in the text. Which would get really messy.</p> <pre><code>&lt;span&gt;START REPEAL 1&lt;/span&gt; &lt;span class="col-repealed"&gt;The Commissioners before whom an appeal under this section is brought&lt;/span&gt; &lt;span&gt;END REPEAL 1&lt;/span&gt; &lt;span&gt;START INSERTION 1&lt;/span&gt; &lt;span class="col-inserted"&gt;On an appeal that is notified to the tribunal&lt;/span&gt; &lt;span&gt;END INSERTION 1&lt;/span&gt;, the tribunal must consider whether the registration of the pension scheme ought to have been withdrawn. </code></pre> <p>Ugly, and very hard to grasp.</p> <h3>with characters</h3> <p>Similar would be the use of special characters (for example <a href="http://en.wikipedia.org/wiki/ISO_5776" rel="nofollow">ISO 5776</a>, correction/proofreading marks, …).</p> <p>For insertions, for example, <a href="http://en.wikipedia.org/wiki/Bracket#Quine_corners_.E2.8C.9E.E2.8C.9F.2C_.E2.8C.9C.E2.8C.9D.2C_and_half_brackets_.E2.B8.A4.E2.B8.A5.2C_.E2.B8.A2.E2.B8.A3" rel="nofollow">half brackets</a> for English, i.e., <code>⌊</code> and <code>⌋</code>:</p> <blockquote> <p>Half brackets are used in English to mark added text, such as in translations: </p> <blockquote> <p>"Bill saw ⸤her⸥".</p> </blockquote> </blockquote> <p>And for repeals, for example, the <a href="http://en.wikipedia.org/wiki/Dele" rel="nofollow">deleatur</a>, i.e. <code>₰</code> (has no clear start and end, though):</p> <blockquote> <p>A dele or deleatur […] is a proofreading symbol used to mark something for deletion.</p> </blockquote> <p>But I <em>guess</em> (though I don’t know) that most screen readers wouldn’t read them.</p> <p>(Of course these could be used as visual cues instead, inserted via CSS.)</p> <h3>special markup language</h3> <p><a href="http://criticmarkup.com/" rel="nofollow">http://criticmarkup.com/</a> is a project to provide a simple plain text markup language to "track changes to documents". Depending on your visitors, you could use this (or a similar) markup language to convey the edits.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload