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.

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

TH-79: All themes > Performance > Every <img> tag must include an "alt" attribute #23

Merged
merged 4 commits into from
Aug 15, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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 themes/aura/assets/add-to-cart.js
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@ function cartTemplate(item) {
<li class="cart-item">
<div class="item-body">
<div class="right-items">
${imageUrl && `<img src="${imageUrl}" />`}
${imageUrl && `<img src="${imageUrl}" alt="${item.productVariant.product.name}" />`}
<div class="item-details">
<p class="product-name">${item.productVariant.product.name}</p>
<div class="variants">
Expand Down
2 changes: 1 addition & 1 deletion themes/aura/sections/main-cart.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
<div class="row cart__item" id='{{ item.id }}'>
<div class="cell">
<div class='product-image'>
<img loading='lazy' src='{{ item.image }}' alt='product-name'>
<img loading='lazy' src='{{ item.image }}' alt='{{ item.name }}'>
</div>
</div>
<div class='cell'>
Expand Down
2 changes: 1 addition & 1 deletion themes/aura/sections/main-page.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<a href="/" class="first-listing">{{ 'snippets.collection-listing.home' | t }}</a>
</div>
<div class="listings__item">
<img src='{{ 'left-arrow.png' | asset_url }}'>
<img src='{{ 'left-arrow.png' | asset_url }}' alt='Left arrow' >
</div>
<div class="listings__item">
<span class="second-listing">{{ page.name }}</span>
Expand Down
1 change: 1 addition & 0 deletions themes/aura/sections/main-search.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@
<img
loading='lazy'
src='{{ 'fallback-product-img.webp' | asset_url }}'
alt='{{ item.name }}'
>
{% endif %}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/aura/sections/main-video.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
{% if section.settings.video_link %}
{% if section.settings.video_type == 'youtube' %}
<div class='youtube-video'>
<img class='youtube-thumbnail' src='' loading='lazy'>
<img class='youtube-thumbnail' src='' loading='lazy' alt='YouTube thumbnail'>
<div class='youtube-play-button'></div>
<div class="spinner video-spinner"></div>
</div>
Expand Down
7 changes: 6 additions & 1 deletion themes/aura/sections/multi-column.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,12 @@
<div class='column-block' {{ block.youcan_attributes }}>
{% if block_setting.image %}
<div class="column-image-wrapper">
<img class='column-image' src='{{ block_setting.image.src }}' loading='lazy'>
<img
class='column-image'
src='{{ block_setting.image.src }}'
loading='lazy'
alt='{{ block_setting.heading }}'
>
</div>
{% else %}
<div class="column-image-wrapper">
Expand Down
2 changes: 1 addition & 1 deletion themes/aura/sections/notice-bar.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
{%- if section.settings.notice_bar_show %}
<div class='yc-notice'>
<div class='content container '>
{%- if section.settings.notice_bar_logo.src -%} <img src='{{ section.settings.notice_bar_logo.src }}'>{%- endif -%}
{%- if section.settings.notice_bar_logo.src -%} <img src='{{ section.settings.notice_bar_logo.src }}' alt='Notice logo'>{%- endif -%}
<div class="notice-content">
{{ section.settings.notice_bar_content }}
</div>
Expand Down
2 changes: 2 additions & 0 deletions themes/aura/snippets/collection-preview.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,13 @@
<img
loading='lazy'
src='{{ category.image }}'
alt='{{ category.name }}'
>
{% else %}
<img
loading='lazy'
src='{{ 'default_product.jpeg' | asset_url }}'
alt='{{ category.name }}'
>
{% endif %}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/aura/snippets/product-card.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<img
class="main-image"
src="{% if product.images.size > 0 %}{{ product.images.first }}{% else %}{{ 'default_product.jpeg' | asset_url }}{% endif %}"
alt="product image">
alt="{{ product.name }}">
</div>
<div class="details">
<span class="product-name" id="product-name"></span>
Expand Down
2 changes: 2 additions & 0 deletions themes/aura/snippets/product-preview.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,13 @@
<img
loading='lazy'
src='{{ item.thumbnail }}'
alt='{{ item.name }}'
>
{% else %}
<img
loading='lazy'
src='{{ 'default_product.jpeg' | asset_url }}'
alt='{{ item.name }}'
>
{% endif %}
{% if block_settings.tag_text %}
Expand Down
1 change: 1 addition & 0 deletions themes/aura/snippets/product-slider.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@
<img
loading='lazy'
src='{%- if block.settings.product.thumbnail -%} {{ block.settings.product.thumbnail }} {%- else -%} {{ 'default_product.jpeg' | asset_url }} {%- endif -%}'
alt='{{ block.settings.product.name }}'
>
{% if block.settings.tag_text %}
<div
Expand Down
2 changes: 1 addition & 1 deletion themes/aura/snippets/reviews.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@
{{ 'reviews.upload_image' | t }}
</span>
</div>
<img class="uploaded-image" onclick="showExpandedImageView(this);" />
<img class="uploaded-image" onclick="showExpandedImageView(this);" alt="Uploaded image" />
<button class="add-more" type="button" onclick="event.stopPropagation(); uploadReviewImage(this.parentElement, event);">+</button>
</div>
<div class="image-big-view" onclick="hideExpandedImageView(this)" style="display: none;">
Expand Down
2 changes: 2 additions & 0 deletions themes/aura/snippets/subCategory.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,13 @@
<img
loading='lazy'
src='{{ subcategory.image }}'
alt='{{ subcategory.name }}'
>
{% else %}
<img
loading='lazy'
src='{{ 'default_product.jpeg' | asset_url }}'
alt='{{ subcategory.name }}'
>
{% endif %}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/harmony/assets/add-to-cart.js
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ function cartTemplate(item) {
<li class="cart-item">
<div class="item-body">
<div class="right-items">
${imageUrl && `<img src="${imageUrl}" />`}
${imageUrl && `<img src="${imageUrl}" alt="${item.productVariant.product.name}" />`}
<div class="item-details">
<p class="product-name">${item.productVariant.product.name}</p>
<div class="variants">
Expand Down
2 changes: 1 addition & 1 deletion themes/harmony/sections/main-cart.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
<div class="product-preview">
<div class="cell">
<div class='product-image'>
<img loading='lazy' src='{{ item.image }}' alt='product-name'>
<img loading='lazy' src='{{ item.image }}' alt='{{ item.name }}'>
</div>
</div>
</div>
Expand Down
3 changes: 2 additions & 1 deletion themes/harmony/sections/main-search.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,8 @@
{% else %}
<img
loading='lazy'
src='{{ 'fallback-product-img.webp' | asset_url }}'
src='{{ 'default_product.jpeg' | asset_url }}'
alt="{{ item.name }}"
>
{% endif %}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/harmony/sections/main-video.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
{% if section.settings.video_link %}
{% if section.settings.video_type == 'youtube' %}
<div class='youtube-video'>
<img class='youtube-thumbnail' src='' loading='lazy'>
<img class='youtube-thumbnail' src='' loading='lazy' alt="YouTube thumbnail">
<div class='youtube-play-button'></div>
<div class="spinner video-spinner"></div>
</div>
Expand Down
1 change: 1 addition & 0 deletions themes/harmony/sections/multi-column.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,7 @@
class='column-image'
src='{{ block_setting.image.src }}'
loading='lazy'
alt='{{ block_setting.heading }}'
>
</div>
{% else %}
Expand Down
2 changes: 1 addition & 1 deletion themes/harmony/sections/thankyou.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
<ul class="product-list">
{% for item in order.order_variants %}
<li class="product-item">
<img class="product-image" src="{{- item.image -}}" />
<img class="product-image" src="{{- item.image -}}" alt="{{- item.name -}}" />
<div class="product-details">
<a class="product-name" href="/products/{{- item.slug -}}" target="_blank">{{- item.name -}}</a>
<ul class="product-variations">
Expand Down
2 changes: 2 additions & 0 deletions themes/harmony/snippets/collection-preview.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,13 @@
<img
loading='lazy'
src='{{ category.image }}'
alt='{{ category.name }}'
>
{% else %}
<img
loading='lazy'
src='{{ 'default_product.jpeg' | asset_url }}'
alt='{{ category.name }}'
>
{% endif %}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/harmony/snippets/product-card.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<img
class="main-image"
src="{% if product.images.size > 0 %}{{ product.images.first }}{% else %}{{ 'default_product.jpeg' | asset_url }}{% endif %}"
alt="product image"
alt="{{ product.name }}"
>
<div class="details">
<span class="product-name" id="product-name"></span>
Expand Down
4 changes: 2 additions & 2 deletions themes/harmony/snippets/product-preview.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,9 @@
{% endif %}
</div>
{% if item.thumbnail %}
<img loading='lazy' src='{{ item.thumbnail }}'>
<img loading='lazy' src='{{ item.thumbnail }}' alt="{{ item.name }}">
{% else %}
<img loading='lazy' src='{{ 'default_product.jpeg' | asset_url }}'>
<img loading='lazy' src='{{ 'default_product.jpeg' | asset_url }}' alt="{{ item.name }}">
{% endif %}
</div>
<div class='product-details'>
Expand Down
6 changes: 5 additions & 1 deletion themes/harmony/snippets/product-slider.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,11 @@
<a href='{{ block.settings.product.url }}' class='product-block'>
<div class="product-slider">
<div class='product-thumbnail'>
<img loading='lazy' src='{%- if block.settings.product.thumbnail -%} {{ block.settings.product.thumbnail }} {%- else -%} {{ 'default_product.jpeg' | asset_url }} {%- endif -%}'>
<img
loading='lazy'
src='{%- if block.settings.product.thumbnail -%} {{ block.settings.product.thumbnail }} {%- else -%} {{ 'default_product.jpeg' | asset_url }} {%- endif -%}'
alt='{{ block.settings.product.name }}'
>
{% if block.settings.tag_text %}
<div class="tag {{ section_settings.tag_position }}" style="background: {{ section_settings.banner_background_color.hex }}; color: {{ section_settings.tag_text_color.hex }}">
{{ block.settings.tag_text }}
Expand Down
2 changes: 1 addition & 1 deletion themes/harmony/snippets/reviews.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
{{ 'reviews.upload_image' | t }}
</span>
</div>
<img class="uploaded-image" onclick="showExpandedImageView(this);" />
<img class="uploaded-image" alt="Uploaded image" onclick="showExpandedImageView(this);" />
<button class="add-more" type="button" onclick="event.stopPropagation(); uploadReviewImage(this.parentElement, event);">+</button>
</div>
<div class="image-big-view" onclick="hideExpandedImageView(this)" style="display: none;">
Expand Down
2 changes: 2 additions & 0 deletions themes/harmony/snippets/subCategory.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,13 @@
<img
loading='lazy'
src='{{ subcategory.image }}'
alt='{{ subcategory.name }}'
>
{% else %}
<img
loading='lazy'
src='{{ 'default_product.jpeg' | asset_url }}'
alt='{{ subcategory.name }}'
>
{% endif %}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/assets/add-to-cart.js
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ function cartTemplate(item) {
return `
<li class="cart-item">
<div class="item-body">
${imageUrl && `<img src="${imageUrl}" />`}
${imageUrl && `<img src="${imageUrl}" alt="${item.productVariant.product.name}" />`}
<div class="item-details">
<p class="product-name">${item.productVariant.product.name}</p>
<div class="variants">
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/sections/featured-collections.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@
{% endif %}
</div>
{% if block.settings.category.image %}
<img src='{{ block.settings.category.image }}' class="category-img">
<img src='{{ block.settings.category.image }}' class="category-img" alt='{{ block.settings.category.name }}'>
{% endif %}
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/sections/main-cart.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
<div class="row cart__item" id='{{ item.id }}'>
<div class="cell">
<div class='product-image'>
<img loading='lazy' src='{{ item.image }}' alt='product-name'>
<img loading='lazy' src='{{ item.image }}' alt='{{ item.name }}'>
</div>
</div>
<div class='cell mobile-view'>
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/sections/main-page.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<a href="/" class="first-listing">{{ 'snippets.collection-listing.home' | t }}</a>
</div>
<div class="listings__item">
<img src='{{ 'left-arrow.png' | asset_url }}'>
<img src='{{ 'left-arrow.png' | asset_url }}' alt='Left arrow'>
</div>
<div class="listings__item">
<span class="second-listing">{{ page.name }}</span>
Expand Down
1 change: 1 addition & 0 deletions themes/meraki/sections/main-search.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@
<img
loading='lazy'
src='{{ 'fallback-product-img.webp' | asset_url }}'
alt='{{ item.name }}'
>
{% endif %}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/sections/main-video.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
{% if section.settings.video_link %}
{% if section.settings.video_type == 'youtube' %}
<div class='youtube-video'>
<img class='youtube-thumbnail' src='' loading='lazy'>
<img class='youtube-thumbnail' src='' loading='lazy' alt='YouTube thumbnail'>
<div class='youtube-play-button'>
<div class="triangle"></div>
</div>
Expand Down
1 change: 1 addition & 0 deletions themes/meraki/sections/multi-column.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -135,6 +135,7 @@
class='column-image'
src='{{ block_setting.image.src }}'
loading='lazy'
alt='{{ block_setting.heading }}'
>
</div>
{% else %}
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/sections/notice-bar.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
{%- if section.settings.notice_bar_show %}
<div class='yc-notice'>
<div class='content container '>
{%- if section.settings.notice_bar_logo.src -%} <img src='{{ section.settings.notice_bar_logo.src }}'>{%- endif -%}
{%- if section.settings.notice_bar_logo.src -%} <img src='{{ section.settings.notice_bar_logo.src }}' alt='Notice logo'>{%- endif -%}
<div class="notice-content">
{{ section.settings.notice_bar_content }}
</div>
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/sections/thankyou.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
<ul class="product-list">
{% for item in order.order_variants %}
<li class="product-item">
<img class="product-image" src="{{- item.image -}}" />
<img class="product-image" src="{{- item.image -}}" alt="{{- item.name -}}" />
<div class="product-details">
<a class="product-name" href="/products/{{- item.slug -}}" target="_blank">{{- item.name -}}</a>
<ul class="product-variations">
Expand Down
2 changes: 2 additions & 0 deletions themes/meraki/snippets/collection-preview.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,13 @@
<img
loading='lazy'
src='{{ category.image }}'
alt='{{ category.name }}'
>
{% else %}
<img
loading='lazy'
src='{{ 'default_product.jpeg' | asset_url }}'
alt='{{ category.name }}'
>
{% endif %}
<div class='collection-details'>
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/snippets/product-card.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<img
class="main-image"
src="{% if product.images.size > 0 %}{{ product.images.first }}{% else %}{{ 'default_product.jpeg' | asset_url }}{% endif %}"
alt="product image">
alt="{{ product.name }}">
</div>
<div class="details">
<span class="product-name" id="product-name"></span>
Expand Down
4 changes: 2 additions & 2 deletions themes/meraki/snippets/product-preview.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,9 @@
</div>

{% if item.thumbnail %}
<img loading='lazy' src='{{ item.thumbnail }}'>
<img loading='lazy' src='{{ item.thumbnail }}' alt='{{ item.name }}'>
{% else %}
<img loading='lazy' src='{{ 'default_product.jpeg' | asset_url }}'>
<img loading='lazy' src='{{ 'default_product.jpeg' | asset_url }}' alt='{{ item.name }}'>
{% endif %}
</div>
<div class='product-details'>
Expand Down
3 changes: 2 additions & 1 deletion themes/meraki/snippets/product-slider.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,8 @@
<img
loading='lazy'
src='{%- if block.settings.product.thumbnail -%} {{ block.settings.product.thumbnail }} {%- else -%} {{ 'default_product.jpeg' | asset_url }} {%- endif -%}'
>
alt='{{ block.settings.product.name }}'
>
{% if block.settings.tag_text %}
<div
class="tag {{ section_settings.tag_position }}"
Expand Down
2 changes: 1 addition & 1 deletion themes/meraki/snippets/reviews.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
{{ 'reviews.upload_image' | t }}
</span>
</div>
<img class="uploaded-image" onclick="showExpandedImageView(this);" />
<img class="uploaded-image" onclick="showExpandedImageView(this);" alt="Uploaded image" />
<button class="add-more" type="button" onclick="event.stopPropagation(); uploadReviewImage(this.parentElement, event);">+</button>
</div>
<div class="image-big-view" onclick="hideExpandedImageView(this)" style="display: none;">
Expand Down
Loading