¿Alguien tiene una idea de qué idea brillante puede haber detrás de colocar una imagen de 1px dentro de diferentes bloques html? Se utilizan en los temas de la tienda web Shoper (SaaS) en muchos lugares diferentes, como los que se muestran a continuación. Necesito reducir el número de nodos por motivos de SEO y estoy tentado a eliminarlos (son cientos o miles en una sola página).

El CSS predeterminado es:

 .px1 { display: none; width: 0; height: 0; display: inline-block; border-width: 0; vertical-align: middle; }

y no lo he analizado contra la modificación del código JS, solo con RWD (nada cambia).

Ejemplos HTML:

 <button class="addtobasket btn btn-red" type="submit"> <img src="/libraries/images/1px.gif" alt="" class="px1"> <span>Buy</span> </button>

 <div class="boxhead"> <span> <img src="/libraries/images/1px.gif" alt="" class="px1"> Sale </span> </div>

 <li class="parent" id="hcategory_126"> <h3> <a href="/pl/c/bikes/126" title="Bikes" id="headercategory126" class="spanhover"> <span>Bikes</span> <img src="/libraries/images/1px.gif" alt="" class="px1"> </a> </h3> <div class="submenu level2">...</div> </li>