Merge pull request #8324 from braze-inc/ada-add-img-alt

ADA - add alt tags to layouts/includes

_includes/feedback.html

@@ -1,6 +1,6 @@
 <div class="gitedit_div">
     <a href="{{site.github_baseurl}}{{page.relative_path }}" class="extignore" target="_blank">
-        <img src="{{site.baseurl}}/assets/img/{{site.github_icon}}" /> &nbsp; {{ site.data.i18n[site.language]['edit_github'] | default: "Edit this page on GitHub" }}
+        <img src="{{site.baseurl}}/assets/img/{{site.github_icon}}" alt="Github" /> &nbsp; {{ site.data.i18n[site.language]['edit_github'] | default: "Edit this page on GitHub" }}
     </a>
 </div>
 
@@ -37,4 +37,4 @@
     var feedback_site = '{{site.baseurl}}{{page.url}}';
     var feedback_article_title = '{{page.article_title}}';
     var feedback_nav_title = '{{page.nav_title}}';
-</script>
+</script>

_includes/search_page.html

@@ -38,6 +38,7 @@ <h1 style="padding-top: 40px; color: #212123">Advanced Search</h1>
 					Braze Learning &nbsp;<img
 						src="{{site.baseurl}}/assets/img/braze_learning.png"
 						height="18px"
+						alt="Braze Learning"
 					/>
 					<hr />
 				</div>

_layouts/api_glossary.html

@@ -274,7 +274,7 @@ <h1> {{ page.glossary_top_header }} </h1>
             <i class="{{menu_list.fa_icon}}"></i>
             {%- else -%}
               {%- if menu_list.image -%}
-              <img src="{{site.baseurl}}{{ menu_list.image}} " />
+              <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
               {%- endif -%}
             {%- endif -%}
             <div class="menu_description">
@@ -287,9 +287,9 @@ <h1> {{ page.glossary_top_header }} </h1>
       {%- endfor -%}
       <b class="glossary_text">  {{ page.glossary_mid_text }} </b>
     </div>
-    <div id="glossary_filter">
+    <fieldset id="glossary_filter">
         <input id="glossary_search" type="search" placeholder="Search" />
-        <div id="glossary_filter_titlev2">{{ page.glossary_filter_text }}</div>
+        <legend id="glossary_filter_titlev2">{{ page.glossary_filter_text }}</legend>
         {%- for tag in page.glossary_tags -%}
         <div class="glossary_filter_div">
           <label for="filter_{{ tag.name | slugify }}"> <input type="checkbox" name="filter_{{ tag.name | slugify }}" id="input_filter_{{ tag.name | slugify }}" value="{{tag.name | downcase }}" />
@@ -298,7 +298,7 @@ <h1> {{ page.glossary_top_header }} </h1>
         </div>
         {%- endfor -%}
 
-    </div>
+    </fieldset>
 
     <div id="glossary_list" class="flex mx-auto">
       <div class="d-flex" style="width: 100%;">

_layouts/api_page.html

@@ -82,7 +82,7 @@
 <div class="d-none d-lg-block col-lg-2 d-print-none" id="toc_col">
   <div class="gitedit_div" style="margin-top: 30px;padding-left: 5px;">
       <a href="{{site.github_baseurl}}{{page.relative_path }}" class="extignore" target="_blank">
-          <img src="{{site.baseurl}}/assets/img/{{site.github_icon}}" /> &nbsp; {{ site.data.i18n[site.language]['edit_github'] | default: "Edit this page on GitHub" }}
+          <img src="{{site.baseurl}}/assets/img/{{site.github_icon}}" alt="Github" /> &nbsp; {{ site.data.i18n[site.language]['edit_github'] | default: "Edit this page on GitHub" }}
       </a>
   </div>
   <div id="toc" ></div>

_layouts/broken_page.html

@@ -151,7 +151,7 @@
 
     <div id="broken-main">
       <div id="broken_banner">
-        <div id="broken_banner_img"><img src="{{ page.broken_image | multi_lang }}" /></div>
+        <div id="broken_banner_img"><img src="{{ page.broken_image | multi_lang }}" alt="Broken Image" /></div>
         <div id="broken_banner_info" class="broken_info">
           <div id="content_start"></div>
           <div id="broken_banner_text">

_layouts/dev_guide.html

@@ -70,7 +70,7 @@ <h2 class="guide_featured_title"> {{ page.guide_featured_title }} </h2>
             <i class="{{menu_list.fa_icon}}"></i>
             {%- else -%}
               {%- if menu_list.image -%}
-              <img src="{{site.baseurl}}{{ menu_list.image}} " />
+              <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
               {%- endif -%}
             {%- endif -%}
             <div class="menu_description">
@@ -102,7 +102,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -130,7 +130,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title2 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -160,7 +160,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title3 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -189,7 +189,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title4 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -218,7 +218,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title5 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -247,7 +247,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title6 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -276,7 +276,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title7 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -305,7 +305,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title8 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -331,7 +331,7 @@ <h2 class="guide_menu_title"> {{ page.guide_menu_title9 }} </h2>
         <i class="{{menu_list.fa_icon}}"></i>
         {%- else -%}
           {%- if menu_list.image -%}
-          <img src="{{site.baseurl}}{{ menu_list.image}} " />
+          <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
           {%- endif -%}
         {%- endif -%}
         <div class="menu_description">
@@ -362,4 +362,4 @@ <h1> {{ page.guide_footer_header }} </h1>
     {%- endunless -%}
 
     {% include footer.html class="footer_dev" %}
-</div>
+</div>

_layouts/doc_guide.html

@@ -61,7 +61,7 @@ <h2 class="doc_menu_title"> {{ page.doc_top_header }} </h2>
         <div id="{{ doc_list.name | handle }}" class="doc_item">
           <div class="doc_img">
           {%- if doc_list.image -%}
-          <img src="{{site.baseurl}}{{ doc_list.image}} " />
+          <img src="{{site.baseurl}}{{ doc_list.image}} " alt="{{doc_list.name}}" />
           {%- endif -%}
           </div>
           <div class="doc_info">
@@ -73,7 +73,7 @@ <h2 class="doc_menu_title"> {{ page.doc_top_header }} </h2>
             </div>
           </div>
           <div class="doc_img arrow">
-            <img src="{{site.baseurl}}/assets/img/braze_icons/arrow-circle-right-pink.svg" />
+            <img src="{{site.baseurl}}/assets/img/braze_icons/arrow-circle-right-pink.svg" alt="Arrow Right" />
           </div>
         </div>
           {%- if doc_list.link -%}
@@ -86,7 +86,7 @@ <h2 class="doc_menu_title"> {{ page.doc_top_header }} </h2>
           <a href="https://learning.braze.com" target="_blank">
 
           <div id="doc_lab">
-            <div id="doc_lab_img"><img src="{{site.baseurl}}/assets/img/braze_learning.png" /></div>
+            <div id="doc_lab_img"><img src="{{site.baseurl}}/assets/img/braze_learning.png" alt="Braze Learning" /></div>
             <div id="doc_lab_info" class="doc_info">
               <div class="doc_name">
                 Braze Learning

_layouts/documents.html

@@ -71,7 +71,7 @@
 <div class="d-none d-lg-block col-lg-2 d-print-none" id="toc_col">
   <div class="gitedit_div" style="margin-top: 30px;padding-left: 5px;">
       <a href="{{site.github_baseurl}}{{page.relative_path }}" class="extignore" target="_blank">
-          <img src="{{site.baseurl}}/assets/img/{{site.github_icon}}" /> &nbsp; {{ site.data.i18n[site.language]['edit_github'] | default: "Edit this page on GitHub" }}
+          <img src="{{site.baseurl}}/assets/img/{{site.github_icon}}" alt="Github" /> &nbsp; {{ site.data.i18n[site.language]['edit_github'] | default: "Edit this page on GitHub" }}
       </a>
   </div>
   <div id="toc" ></div>

_layouts/featured.html

@@ -62,7 +62,7 @@ <h2 class="guide_featured_title"> {{ page.guide_featured_title }} </h2>
             <i class="{{menu_list.fa_icon}}"></i>
             {%- else -%}
               {%- if menu_list.image -%}
-              <img src="{{site.baseurl}}{{ menu_list.image}} " />
+              <img src="{{site.baseurl}}{{ menu_list.image}} " alt="{{ menu_list.name }}" />
               {%- endif -%}
             {%- endif -%}
             <div class="menu_description">

_layouts/glossary_page.html

@@ -288,7 +288,7 @@ <h1> {{ page.glossary_top_header }} </h1>
           <div id="{{ glossary_id }}" class="anchor"></div>
           <div class="content"><p class="title">{{ glossary['name'] }} <a class="glossary_share" data-clipboard-text="#{{ glossary_id }}" id="cp_{{glossary_id}}"><i class="fas fa-link"></i></a><span id="dv_cp_{{glossary_id}}"></span></p>
             {%- if glossary['image'] -%}
-            <img src="{{ glossary['image'] }}" />
+            <img src="{{ glossary['image'] }}" alt="{{ glossary['name'] }}" />
             {%- endif -%}
             <p class="desc">{{ glossary['description'] }}</p>
             {%- if glossary['metric'] -%}

_layouts/self_help.html

@@ -62,7 +62,7 @@ <h1> {{ page.help_top_header }} </h1>
           <i class="{{help_list.fa_icon}}"></i>
           {%- else -%}
             {%- if help_list.image -%}
-            <img src="{{site.baseurl}}{{ help_list.image}} " />
+            <img src="{{site.baseurl}}{{ help_list.image}} " alt="Help List" />
             {%- endif -%}
           {%- endif -%}
         </div>
@@ -88,7 +88,7 @@ <h1> {{ page.help_top_header }} </h1>
       <div id="{{ user_list.name | handle }}" class="user_item">
         <div class="user_img" style="background-color: {{ user_list.bg_color}}">
         {%- if user_list.image -%}
-        <img src="{{site.baseurl}}{{ user_list.image}} " />
+        <img src="{{site.baseurl}}{{ user_list.image}} " alt="User List" />
         {%- endif -%}
         </div>
         <div class="user_info">
@@ -130,4 +130,4 @@ <h1> {{ page.help_top_header }} </h1>
 
 {%- endunless -%}
 
-{% include footer.html class="footer_help" %}
+{% include footer.html class="footer_help" %}

_layouts/user_guide.html

@@ -62,7 +62,7 @@ <h1> {{ page.user_top_header }} </h1>
       <div id="{{ user_list.name | handle }}" class="user_item">
         <div class="user_img" style="background-color: {{ user_list.bg_color}}">
         {%- if user_list.image -%}
-        <img src="{{site.baseurl}}{{ user_list.image}} " />
+        <img src="{{site.baseurl}}{{ user_list.image}} " alt="User List" />
         {%- endif -%}
         </div>
         <div class="user_info">