Editorial: move img def to image (#2076)

Author: scottaohara

index.html

@@ -3861,21 +3861,15 @@ <h2>Definition of Roles</h2>
 			<rdef>image</rdef>
 			<div class="role-description">
 				<p>A container for a collection of [=elements=] that form an image. See synonym <rref>img</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 an element with a <a>role</a> of <code>img</code> to be <a>perceivable</a>, authors MUST provide the element with an <a class="informative">accessible name</a>. This can be done using the <pref>aria-label</pref> or <pref>aria-labelledby</pref> attribute.</p>
 				<div class="note" id="role-image-note-image">
 					Note regarding the ARIA 1.3 <code>image</code> role.
-					<p>The <code>image</code> was added to ARIA in version 1.3 as a
+					<p>The <code>image</code> role 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 [=elements=] 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 an element with a <a>role</a> of <code>img</code> to be <a>perceivable</a>, authors MUST provide the element with an <a class="informative">accessible name</a>. This can be done using the <pref>aria-label</pref> or <pref>aria-labelledby</pref> attribute.</p>
-			</div>
 			<table class="role-features">
 				<caption>Characteristics:</caption>
 				<thead>
@@ -3904,7 +3898,6 @@ <h2>Definition of Roles</h2>
 					<tr>
 						<th class="role-related-head" scope="row">Related Concepts:</th>
 						<td class="role-related"><code>&lt;[^img^]&gt;</code> in HTML</td>
-
 					</tr>
 					<tr>
 						<th class="role-scope-head" scope="row">Required Accessibility Parent Roles:</th>
@@ -3949,6 +3942,12 @@ <h2>Definition of Roles</h2>
 				</tbody>
 			</table>
 		</div>
+		<div class="role" id="img">
+			<rdef>img</rdef>
+			<div class="role-description">
+				<p>A container for a collection of [=elements=] that form an image. See synonym <rref>image</rref>.</p>
+			</div>
+		</div>
 		<div class="role" id="input">
 			<rdef>input</rdef>
 			<div class="role-description">