From f0b0147985cff24d3841bf928412942d59ff1823 Mon Sep 17 00:00:00 2001
From: Andrea Fercia <afercia@git.wordpress.org>
Date: Fri, 5 May 2017 23:28:41 +0000
Subject: [PATCH] Accessibility: Improve the suggested image size text in the
 media views.

Adds `pixels` as unit, avoiding abbreviation for a clearer pronunciation by screen
readers. Also, adds the word `by` instead of the special character `times`.

Props Presskopp, stormrockwell.
Fixes #38932.


git-svn-id: https://develop.svn.wordpress.org/trunk@40573 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-includes/js/media-views.js                     | 2 +-
 src/wp-includes/js/media/views/attachments/browser.js | 2 +-
 src/wp-includes/media-template.php                    | 5 ++++-
 src/wp-includes/media.php                             | 3 ++-
 4 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/wp-includes/js/media-views.js b/src/wp-includes/js/media-views.js
index be802d7642..b2fc9a5ee6 100644
--- a/src/wp-includes/js/media-views.js
+++ b/src/wp-includes/js/media-views.js
@@ -4050,7 +4050,7 @@ AttachmentsBrowser = View.extend({
 
 		if ( this.options.suggestedWidth && this.options.suggestedHeight ) {
 			this.toolbar.set( 'suggestedDimensions', new View({
-				el: $( '<div class="instructions">' + l10n.suggestedDimensions + ' ' + this.options.suggestedWidth + ' &times; ' + this.options.suggestedHeight + '</div>' )[0],
+				el: $( '<div class="instructions">' + l10n.suggestedDimensions.replace( '%1$s', this.options.suggestedWidth ).replace( '%2$s', this.options.suggestedHeight ) + '</div>' )[0],
 				priority: -40
 			}) );
 		}
diff --git a/src/wp-includes/js/media/views/attachments/browser.js b/src/wp-includes/js/media/views/attachments/browser.js
index c68dce08f2..eb077d0749 100644
--- a/src/wp-includes/js/media/views/attachments/browser.js
+++ b/src/wp-includes/js/media/views/attachments/browser.js
@@ -319,7 +319,7 @@ AttachmentsBrowser = View.extend({
 
 		if ( this.options.suggestedWidth && this.options.suggestedHeight ) {
 			this.toolbar.set( 'suggestedDimensions', new View({
-				el: $( '<div class="instructions">' + l10n.suggestedDimensions + ' ' + this.options.suggestedWidth + ' &times; ' + this.options.suggestedHeight + '</div>' )[0],
+				el: $( '<div class="instructions">' + l10n.suggestedDimensions.replace( '%1$s', this.options.suggestedWidth ).replace( '%2$s', this.options.suggestedHeight ) + '</div>' )[0],
 				priority: -40
 			}) );
 		}
diff --git a/src/wp-includes/media-template.php b/src/wp-includes/media-template.php
index 7f59935719..e2504e99b5 100644
--- a/src/wp-includes/media-template.php
+++ b/src/wp-includes/media-template.php
@@ -235,7 +235,10 @@ function wp_print_media_templates() {
 
 				<# if ( data.suggestedWidth && data.suggestedHeight ) { #>
 					<p class="suggested-dimensions">
-						<?php _e( 'Suggested image dimensions:' ); ?> {{data.suggestedWidth}} &times; {{data.suggestedHeight}}
+						<?php
+							/* translators: 1: suggested width number, 2: suggested height number. */
+							printf( __( 'Suggested image dimensions: %1$s by %2$s pixels.' ), '{{data.suggestedWidth}}', '{{data.suggestedHeight}}' );
+						?>
 					</p>
 				<# } #>
 
diff --git a/src/wp-includes/media.php b/src/wp-includes/media.php
index 6253bd5742..65cf4c7aae 100644
--- a/src/wp-includes/media.php
+++ b/src/wp-includes/media.php
@@ -3544,7 +3544,8 @@ function wp_enqueue_media( $args = array() ) {
 		'cropImage' => __( 'Crop Image' ),
 		'cropYourImage' => __( 'Crop your image' ),
 		'cropping' => __( 'Cropping&hellip;' ),
-		'suggestedDimensions' => __( 'Suggested image dimensions:' ),
+		/* translators: 1: suggested width number, 2: suggested height number. */
+		'suggestedDimensions' => __( 'Suggested image dimensions: %1$s by %2$s pixels.' ),
 		'cropError' => __( 'There has been an error cropping your image.' ),
 
 		// Edit Audio