Added role="definition” to symbols

Author: ericwbailey

partials/section.text-level.hbs

@@ -140,21 +140,21 @@ drwxr-xr-x 9 eric staff   306 Mar 24 13:36 .git/
     <div id="subsection__symbols" role="region" aria-labelledby="subtitle__symbols"><!-- Start of #subsection__symbols -->
         <h3 id="subtitle__symbols">Symbols</h3>
         <ul>
-            <li><span aria-label="Plus">+</span></li>
-            <li><span aria-label="Minus">−</span></li>
-            <li><span aria-label="Plus or minus">±</span></li>
-            <li><span aria-label="Divided by">÷</span></li>
-            <li><span aria-label="Multiplied by">×</span></li>
-            <li><span aria-label="Less than">&lt;</span></li>
-            <li><span aria-label="Less than or equal to">≤</span></li>
-            <li><span aria-label="Greater than">&gt;</span></li>
-            <li><span aria-label="Greater than or equal to">≥</span></li>
-            <li><span aria-label="Equals">=</span></li>
-            <li><span aria-label="Approximately equals">≈</span></li>
-            <li><span aria-label="Not equals">≠</span></li>
+            <li><span role="definition" aria-label="Plus">+</span></li>
+            <li><span role="definition" aria-label="Minus">−</span></li>
+            <li><span role="definition" aria-label="Plus or minus">±</span></li>
+            <li><span role="definition" aria-label="Divided by">÷</span></li>
+            <li><span role="definition" aria-label="Multiplied by">×</span></li>
+            <li><span role="definition" aria-label="Less than">&lt;</span></li>
+            <li><span role="definition" aria-label="Less than or equal to">≤</span></li>
+            <li><span role="definition" aria-label="Greater than">&gt;</span></li>
+            <li><span role="definition" aria-label="Greater than or equal to">≥</span></li>
+            <li><span role="definition" aria-label="Equals">=</span></li>
+            <li><span role="definition" aria-label="Approximately equals">≈</span></li>
+            <li><span role="definition" aria-label="Not equals">≠</span></li>
         </ul>
         <p>
-            <small>Note: Certain screen readers will not <a rel="external noopener" href="http://www.deque.com/blog/dont-screen-readers-read-whats-screen-part-1-punctuation-typographic-symbols/">read certain symbols out loud</a>. Use <code>aria-label</code> to ensure the symbol is read.</small>
+            <small>Note: Certain screen readers will not <a rel="external noopener" href="http://www.deque.com/blog/dont-screen-readers-read-whats-screen-part-1-punctuation-typographic-symbols/">read certain symbols out loud</a>. Use <code>role="definition"</code> in conjunction with <code>aria-label</code> to ensure the symbol is read.</small>
         </p>
     </div><!-- End of #subsection__symbols -->
     <div id="subsection__emoji" role="region" aria-labelledby="subtitle__emoji"><!-- Start of #subsection__emoji -->