Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix a11y audit: alt attribute of decorative images must be empty #2690

Merged
merged 22 commits into from
Oct 1, 2024
Merged

Fix a11y audit: alt attribute of decorative images must be empty #2690

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
03e8a3e
Fix a11y audit bug 0-2: The ALT attribute of a decorative image must …
hannahiss Aug 19, 2024
bb8bc73
Fix Parcel/Webpack/Vite images: empty alt for decorative images (like…
hannahiss Aug 21, 2024
e37016b
Empty alt attribute on User image in navbars (and remove role="img")
hannahiss Aug 22, 2024
2aa2dec
Empty alt attribute on User image in navbars (and remove role="img")
hannahiss Aug 22, 2024
fe6e912
Remove unnecessary aria-hidden (with empty alt)
hannahiss Aug 22, 2024
b02e3a7
Merge branch 'main' into main-his-a11y-0-2-alt
julien-deramond Sep 12, 2024
c4c5cef
Add mention of removing role img in the migration guide
hannahiss Sep 12, 2024
74ccc87
Merge branch 'main' into main-his-a11y-0-2-alt
hannahiss Sep 19, 2024
656d170
do not remove role="img" in this PR, since it is done in #2704
hannahiss Sep 19, 2024
28f60fd
do not remove role="img" in this PR, since it is done in #2704
hannahiss Sep 19, 2024
6240ab2
do not remove role="img" in this PR, since it is done in #2704
hannahiss Sep 19, 2024
6400534
fix migration guide:do not mention role="img"
hannahiss Sep 19, 2024
fd97677
fix migration guide: badge + alphabetical order
hannahiss Sep 19, 2024
c780e1f
remove role="img" when alt=""
hannahiss Sep 30, 2024
02736a1
Merge branch 'main' into main-his-a11y-0-2-alt
hannahiss Sep 30, 2024
427840e
remove role="img" when alt=""
hannahiss Sep 30, 2024
f25984e
Update site/layouts/shortcodes/orange-supra.html
hannahiss Oct 1, 2024
1e67e0d
migration guide proposition
hannahiss Oct 1, 2024
4b0a1b1
Merge remote-tracking branch 'origin/main-his-a11y-0-2-alt' into main…
hannahiss Oct 1, 2024
846ddd5
Merge branch 'main' into main-his-a11y-0-2-alt
hannahiss Oct 1, 2024
b91cbce
Enhance migration note
julien-deramond Oct 1, 2024
d46ef21
Merge branch 'main' into main-his-a11y-0-2-alt
julien-deramond Oct 1, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion site/content/docs/5.3/components/orange-navbar.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -202,7 +202,7 @@ An additional navbar (with text or icon items) can be added on the right of the
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{<param docs_version>}}/assets/img/navbar-contact.png" width="25" height="25" role="img" alt="User" loading="lazy">
julien-deramond marked this conversation as resolved.
Show resolved Hide resolved
julien-deramond marked this conversation as resolved.
Show resolved Hide resolved
<img src="/docs/{{<param docs_version>}}/assets/img/navbar-contact.png" width="25" height="25" alt="" loading="lazy">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down
10 changes: 5 additions & 5 deletions site/content/docs/5.3/dark-mode.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4072,7 +4072,7 @@ sitemap:
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" role="img" alt="User" loading="lazy" width="25" height="25">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" alt="" loading="lazy" width="25" height="25">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down Expand Up @@ -4160,7 +4160,7 @@ sitemap:
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" role="img" alt="User" loading="lazy" width="25" height="25">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" alt="" loading="lazy" width="25" height="25">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down Expand Up @@ -4248,7 +4248,7 @@ sitemap:
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" role="img" alt="User" loading="lazy" width="25" height="25">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" alt="" loading="lazy" width="25" height="25">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down Expand Up @@ -4336,7 +4336,7 @@ sitemap:
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" role="img" alt="User" loading="lazy" width="25" height="25">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" alt="" loading="lazy" width="25" height="25">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down Expand Up @@ -4424,7 +4424,7 @@ sitemap:
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" role="img" alt="User" loading="lazy" width="25" height="25">
<img src="/docs/{{< param docs_version >}}/assets/img/navbar-contact.png" alt="" loading="lazy" width="25" height="25">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down
2 changes: 1 addition & 1 deletion site/content/docs/5.3/getting-started/parcel.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ thumbnail: guides/parcel-dev-server-boosted.png
---

<div class="d-flex justify-content-center">
<img class="d-flex" src="/docs/{{< param docs_version >}}/assets/img/parcel.png" alt="Parcel logo" loading="lazy">
<img class="d-flex" src="/docs/{{< param docs_version >}}/assets/img/parcel.png" alt="" loading="lazy">
</div>

{{< callout >}}
Expand Down
2 changes: 1 addition & 1 deletion site/content/docs/5.3/getting-started/vite.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ thumbnail: guides/vite-dev-server-boosted.png
---

<div class="d-flex justify-content-center">
<img class="d-flex" src="/docs/{{< param docs_version >}}/assets/img/vite.svg" alt="Vite logo" width="145" loading="lazy">
<img class="d-flex" src="/docs/{{< param docs_version >}}/assets/img/vite.svg" alt="" width="145" loading="lazy">
</div>

{{< callout >}}
Expand Down
4 changes: 2 additions & 2 deletions site/content/docs/5.3/getting-started/webpack.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ thumbnail: guides/webpack-dev-server-boosted.png
---

<div class="d-flex justify-content-center">
<img class="d-flex" src="/docs/{{< param docs_version >}}/assets/img/webpack.svg" alt="Webpack logo" width="145" loading="lazy">
<img class="d-flex" src="/docs/{{< param docs_version >}}/assets/img/webpack.svg" alt="" width="145" loading="lazy">
</div>

{{< callout >}}
Expand Down Expand Up @@ -295,7 +295,7 @@ Then instantiate and use the plugin in the Webpack configuration:
const autoprefixer = require('autoprefixer')
const HtmlWebpackPlugin = require('html-webpack-plugin')
+const miniCssExtractPlugin = require('mini-css-extract-plugin')

module.exports = {
mode: 'development',
@@ -17,7 +18,8 @@ module.exports = {
Expand Down
5 changes: 4 additions & 1 deletion site/content/docs/5.3/migration.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,16 @@ toc: true

### Components

- **Orange navbar**
- Since the `role="img"` is not needed on a `<img>` tag, we have removed it from the user's avatar in the component. Please reflect this change on your websites. You should also check that you are using a correct label for this image, for example "Access to your account", depending on the context of your project.

#### Buttons
- <span class="badge text-bg-success">New</span> X social button.

### Docs

- Certain variants of the components and renderings have been omitted from the documentation to help you clearly understand what is available for use, thereby simplifying the connection between [Orange Design System]({{< param ods.web >}}) and the Boosted documentation.

Although these variants can still be found under the "See Bootstrap examples that are incompatible with Orange Design System" section, be aware that using them may violate the Orange Design System guidelines. It is advisable to avoid these variants whenever possible.

### CSS and Sass variables
Expand Down
2 changes: 1 addition & 1 deletion site/layouts/partials/home/orange-design-system.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ <h2 class="mb-3 fw-semibold lh-sm">Orange Design System for web</h2>
<div class="col-lg-6">
{{ partial "responsive-img" (dict "context" .
"imgPath" "/assets/img/boosted-guidelines.png"
"alt" "Boosted design guidelines"
"alt" ""
"classes" "d-block mt-3") }}
</div>
</section>
2 changes: 1 addition & 1 deletion site/layouts/shortcodes/orange-global-headers.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,7 @@ <h1 class="title">Title</h1>
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{ $.Site.Params.docs_version }}/assets/img/navbar-contact.png" width="25" height="25" role="img" alt="User" loading="lazy">
<img src="/docs/{{ $.Site.Params.docs_version }}/assets/img/navbar-contact.png" width="25" height="25" alt="" loading="lazy">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down
2 changes: 1 addition & 1 deletion site/layouts/shortcodes/orange-supra.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@
</li>
<li class="nav-item">
<a href="#" class="nav-link nav-icon">
<img src="/docs/{{ $.Site.Params.docs_version }}/assets/img/navbar-contact.png" role="img" alt="User" loading="lazy" aria-hidden="true">
<img src="/docs/{{ $.Site.Params.docs_version }}/assets/img/navbar-contact.png" alt="" loading="lazy">
<span class="visually-hidden">My account</span>
</a>
</li>
Expand Down
Loading