Fix external images flaws in Web/CSS #2627
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Note, there are still some flaws in these 10 pages but they're at least not external images. |
sideshowbarker
approved these changes
Feb 24, 2021
ericwbailey
reviewed
Feb 25, 2021
| @@ -42,7 +42,7 @@ <h3 id="Result">Result</h3> | |||
|
|
|||
| <p>A progress bar using this style might look something like this:</p> | |||
|
|
|||
| <p><img alt="" src="https://mdn.mozillademos.org/files/12041/Screen%20Shot%202015-12-04%20at%2020.14.48.png"></p> | |||
| <p><img alt="" src="screen_shot_2015-12-04_at_20.14.48.png"></p> | |||
There was a problem hiding this comment.
Can we provide an alt description for this?
| @@ -41,7 +41,7 @@ <h3 id="Result">Result</h3> | |||
|
|
|||
| <p>A progress bar using this style might look something like this:</p> | |||
|
|
|||
| <p><img alt="The thumb of the <input type=right> styled in green" src="https://mdn.mozillademos.org/files/12027/Screen%20Shot%202015-12-04%20at%2013.30.08.png"></p> | |||
| <p><img alt="The thumb of the <input type=right> styled in green" src="screen_shot_2015-12-04_at_13.30.08.png"></p> | |||
There was a problem hiding this comment.
I weirdly don't have the ability to make a suggestion here. Can we update the closing > in the alt description, and add a period to the end?
| @@ -13,7 +13,7 @@ | |||
|
|
|||
| <p class="summary">Breadcrumb navigation helps the user to understand their location in the website by providing a breadcrumb trail back to the start page.</p> | |||
|
|
|||
| <p><img alt="Links displayed inline with separators" src="https://mdn.mozillademos.org/files/16228/breadcrumb-navigation.png" style="height: 108px; width: 1268px;"></p> | |||
| <p><img alt="Links displayed inline with separators" src="breadcrumb-navigation.png"></p> | |||
There was a problem hiding this comment.
Can we add a period to the end of this alt description?
| @@ -15,7 +15,7 @@ | |||
|
|
|||
| <p class="summary">The <em>Media Object</em> is a pattern we see all over the web. <a href="http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/">Named by Nicole Sullivan</a> it refers to a two-column box with an image on one side and descriptive text on the other, e.g. a facebook post or tweet.</p> | |||
|
|
|||
| <p><img alt="" src="https://mdn.mozillademos.org/files/16112/media-object.png"></p> | |||
| <p><img alt="" src="media-object.png"></p> | |||
There was a problem hiding this comment.
Can we add an alt description?
| @@ -13,7 +13,7 @@ | |||
|
|
|||
| <p class="summary">This cookbook pattern demonstrates the navigation pattern used to display pagination, where the user can move between pages of content such as search results.</p> | |||
|
|
|||
| <p><img alt="Links to sets of pages in a paged listing" src="https://mdn.mozillademos.org/files/16279/pagination.png" style="height: 192px; width: 950px;"></p> | |||
| <p><img alt="Links to sets of pages in a paged listing" src="pagination.png"></p> | |||
There was a problem hiding this comment.
Can we add a period to the end of this alt description?
| @@ -73,7 +73,7 @@ <h3 id="Setting_a_bitmap-based_mask_border">Setting a bitmap-based mask border</ | |||
|
|
|||
| <p>In this example, we will mask an element's border with a diamond pattern. The source for the mask is a ".png" file of 90 by 90 pixels, with three diamonds going vertically and horizontally:</p> | |||
|
|
|||
| <p><img alt="" src="https://mdn.mozillademos.org/files/15836/mask-border-diamonds.png" style="height: 90px; width: 90px;"></p> | |||
| <p><img alt="" src="mask-border-diamonds.png"></p> | |||
There was a problem hiding this comment.
Can we provide an alt description for this?
| @@ -19,7 +19,7 @@ | |||
|
|
|||
| <h2 id="Syntax">Syntax</h2> | |||
|
|
|||
| <p><img alt="" src="https://mdn.mozillademos.org/files/12215/position_type.png" style="float: left; height: 230px; width: 362px;">The <code><position></code> data type is specified with one or two keywords, with optional offsets.</p> | |||
| <p><img alt="" src="position_type.png" style="float: left;">The <code><position></code> data type is specified with one or two keywords, with optional offsets.</p> | |||
There was a problem hiding this comment.
Can we provide an alt description for this?
|
Shoot, didn't see this was merged already. Ignore me! |
|
@ericwbailey Alternatively, create a follow-up PR :) |
|
@ericwbailey Sorry to hear that you missed the fact that it got merged. That's annoying. I actually only ran the fixable flaws on these pages. So the |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.