sergiotarxz
/
Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Accessibility: Improve the "Alt text" description. 

Moves the word "Describe" within the link.

Amends [44900].
See #41612.


git-svn-id: https://develop.svn.wordpress.org/trunk@45038 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrea Fercia 2019-03-27 18:46:12 +00:00
parent 440a383946
commit e2aa3c5efe
2 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/wp-includes/media-template.php
View File

@ -164,7 +164,7 @@ function wp_print_media_templates() {
$alt_text_description = sprintf(
/* translators: 1: link start tag, 2: accessibility text, 3: link end tag */
__( 'Describe %1$sthe purpose of the image%2$s%3$s. Leave empty if the image is purely decorative.' ),
__( '%1$sDescribe the purpose of the image%2$s%3$s. Leave empty if the image is purely decorative.' ),
'<a href="' . esc_url( 'https://www.w3.org/WAI/tutorials/images/decision-tree' ) . '" target="_blank" rel="noopener noreferrer">',
sprintf(
'<span class="screen-reader-text"> %s</span>',

8
tests/qunit/index.html
View File

@ -1153,7 +1153,7 @@
<span class="name">Alternative Text</span>
<input type="text" value="{{ data.alt }}" aria-describedby="alt-text-description" {{ maybeReadOnly }} />
</label>
<p class="description" id="alt-text-description">Describe <a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">Describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<# } #>
<label class="setting" data-setting="title">
<span class="name">Title</span>
@ -1318,7 +1318,7 @@
<span class="name">Alt Text</span>
<input type="text" value="{{ data.alt }}" aria-describedby="alt-text-description" {{ maybeReadOnly }} />
</label>
<p class="description" id="alt-text-description">Describe <a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">Describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<# } #>
<label class="setting" data-setting="title">
<span class="name">Title</span>
@ -1610,7 +1610,7 @@
<span>Alternative Text</span>
<input type="text" data-setting="alt" aria-describedby="alt-text-description" />
</label>
<p class="description" id="alt-text-description">Describe <a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">Describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<label class="setting caption">
<span>Caption</span>
@ -1665,7 +1665,7 @@
<span>Alternative Text</span>
<input type="text" data-setting="alt" value="{{ data.model.alt }}" aria-describedby="alt-text-description" />
</label>
<p class="description" id="alt-text-description">Describe <a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener noreferrer">Describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p>
<label class="setting caption">
<span>Caption</span>