Add role=image as synonym for role=img (#1370)

scottaohara · cookiecrook · web-flow · commit d75a248ba713 · 2021-05-05T20:08:43.000-07:00
Co-authored-by: James Craig &lt;cookiecrook@users.noreply.github.com&gt;
diff --git a/index.html b/index.html
@@ -4083,10 +4083,23 @@ <h2>Definition of Roles</h2>
 				</tbody>
 			</table>
 		</div>
+		<div class="role" id="image">
+			<rdef>image</rdef>
+			<div class="role-description">
+				<p>A container for a collection of <a>elements</a> that form an image. See synonym <rref>img</rref>.</p>
+				<div class="note" id="role-image-note-image">
+					<h5>Note regarding the ARIA 1.3 <code>image</code> role.</h5>
+					<p>The <code>image</code> was added to ARIA in version 1.3 as a
+					synonym of the ARIA 1.0 <rref>img</rref> role. The <code>image</code>
+					role improves syntactic consistency with the names of other roles,
+					which are complete words or concatenations of complete words.</p>
+				</div>
+			</div>
+		</div>
 		<div class="role" id="img">
 			<rdef>img</rdef>
 			<div class="role-description">
-				<p>A container for a collection of <a>elements</a> that form an image.</p>
+				<p>A container for a collection of <a>elements</a> that form an image. See synonym <rref>image</rref>.</p>
 				<p>An <code>img</code> can contain captions and descriptive text, as well as multiple image files that when viewed together give the impression of a single image. An <code>img</code> represents a single graphic within a document, whether or not it is formed by a collection of drawing <a>objects</a>. In order for elements with a <a>role</a> of <code>img</code> to be <a>perceivable</a>, authors MUST provide a label using the <pref>aria-label</pref> or <pref>aria-labelledby</pref> attribute.</p>
 			</div>
 			<table class="role-features">
