651f959d7553ee0256b1e0b37ffa83d64709511d
lrnassar
  Mon Mar 16 17:57:16 2026 -0700
Adding accessible labels to form controls across main CGI pages. Extends cheapcgi and hui libraries with aria-label support for track visibility dropdowns, and adds <label> elements to hgBlat, hgTables, hgPcr, and hgGateway form controls. Also adds Form Control Labels section to accessibility page. refs #37253

diff --git src/hg/hgGateway/hgGateway.html src/hg/hgGateway/hgGateway.html
index 83dd228cb7d..335dc42a355 100644
--- src/hg/hgGateway/hgGateway.html
+++ src/hg/hgGateway/hgGateway.html
@@ -43,31 +43,31 @@
               <div class="jwIconSpriteLabel">Worm</div>
             </div>
             <div class="jwIconWrapper">
               <div class="jwIconSprite jwIconSpriteYeast"></div>
               <div class="jwIconSpriteLabel">Yeast</div>
             </div>
             <br>Search through thousands of genome assemblies
             <span id="speciesSearchInfo">
               <svg style="height:1.1em; vertical-align:top" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                 <circle cx="12" cy="12" r="10" stroke="#1C274C" stroke-width="1.5"/>
                 <path d="M12 17V11" stroke="#1C274C" stroke-width="1.5" stroke-linecap="round"/>
                 <circle cx="1" cy="1" r="1" transform="matrix(1 0 0 -1 11 9)" fill="#1C274C"/>
               </svg>
             </span>
             <div>
-              <input id="speciesSearch" value="" size=42>
+              <input id="speciesSearch" value="" size=42 aria-label="Search species, common name or assembly ID">
             </div>
             <a href="/assemblySearch.html" id="assemblySearchLink" style="text-decoration: none;">
                 <div style="padding: 0px; display: flex; align-items: center; margin-top: 12px;">
                     <p style="margin: 0; padding-right: 0px; color: blue; text-decoration: underline;"
                        title="Not finding your assembly on the Gateway page? Visit the Genome assembly search and request page to request it. Ensure you have a GCA_ or GCF_ identifier from NCBI.">Unable to find a genome? Send us a request.</p>
                     <img src="/images/magnify.png"
                          style="height: 16px; width: 16px; margin-top: 0px; margin-left: 5px;"
                          title="Not finding your assembly on the Gateway page? Visit the Genome assembly search and request page to request it. Ensure you have a GCA_ or GCF_ identifier from NCBI.">
                 </div>
             </a>
           </div>
 
           <!-- Recent Genomes Panel (replaces species tree) -->
           <div id="recentGenomesTitle" class="jwSubsectionTitle" style="display: none;">
             Recent Genomes
@@ -247,42 +247,42 @@
             </div> <!-- speciesPicker -->
 
           </div> <!-- speciesGraphic -->
 
         </div> <!-- jwSectionContents -->
       </div> <!-- selectSpeciesSection -->
 
       <div id="findPositionSection" class ="jwColumn">
         <div id="findPositionTitle" class="jwSectionTitle">
           Find Position
         </div>
         <div id="findPositionContents" class="jwSectionContents"
              style="display: none;"> <!-- To avoid empty containers jumping around, hide first. -->
 
           <div id="findPosInputContainer" style="display: inline-block;">
-            <div id="selectAssemblyLabel" class="jwInputLabel">Assembly</div>
+            <label for="selectAssembly" id="selectAssemblyLabel" class="jwInputLabel">Assembly</label>
             <select id="selectAssembly">
             </select>
 
             <div class="vertSpacerAbovePosition"></div>
 
-            <div class="jwInputLabel">
+            <label for="positionInput" class="jwInputLabel">
               Position/Search Term
               <span style="font-size: smaller">
                 (<a href="../../goldenPath/help/query.html">Examples</a>)
               </span>
-            </div>
+            </label>
             <input id="positionInput" value="" size="40">
             <div class="jwCurrentPos">
               Current position:
               <span id="positionDisplay" class="jwPosDisplay"></span>
               <i id="copyPosition" class="fa fa-copy jwTextBlue"
                  title="Copy the current position into the input above"></i>
             </div>
           </div>
 
           <div class="jwGoButtonContainer"
                title="Go to the Genome Browser">
             <div class="jwGoButton">
               GO
             </div>
             <i class="jwGoIcon fa fa-play fa-2x"></i>