¿Viste esta mierda de Facebook?
“¿Por qué necesito un quadcore de 4Ghz para ejecutar Facebook?” Esta es la razón por. Una sola palabra dividida en 11 elementos DOM HTML para evitar los bloqueadores de anuncios. pic.twitter.com/Zv4RfInrL0
– Mike Pan (@themikepan) 6 de febrero de 2019
Fui a Facebook para verificar eso y lo que vi fue un desastre diferente e incluso más anidado:
Están tratando de luchar contra su extensión de navegador bloqueador de anuncios. Por supuesto que lo son. Estoy seguro de que, a su escala, no hacer esto significa perder millones de dólares. Pero me pregunto si realmente se está perdiendo dinero cuando se tiene en cuenta la pérdida de confianza y la posibilidad de perder personas en la plataforma por completo.
Se siente tan grosero, ¿no? Como un usuario instala específicamente tecnología en su computadora para ejercer cierto control sobre lo que permite en sus computadoras y en sus ojos. Y están diciendo: “No, no respetamos esa elección. Vamos a luchar contra su tecnología con nuestra tecnología y forzar la alimentación de estas cosas en su computadora y sus globos oculares “. No se sienta bien.
No ignoro que los bloqueadores de anuncios tienen un efecto adverso en la capacidad de los sitios web para ganar dinero. Así es como gano dinero literalmente. Pero no quiero hacerlo peleando y a costa de romper la confianza. Quiero hacerlo con gracia mientras genero confianza.
De todos modos.
Me pregunto cómo sería escribir HTML para ayudar a los bloqueadores de anuncios:
<!-- start: advertisement -->
<div class="ad sponsor paid" id="ad-1" data-ad="true">
<div>Sponsor:</div>
<a href="https://sponsor.com" rel="nofollow">Company</span>
</div>
<!-- end: advertisement -->Los buenos Lo he estado haciendo durante años.
Estas letras basadas en tramos me hacen pensar en bibliotecas como Splitting.js y Lettering.js que dividen el texto en <span>s por razones de estilo.
Resulta que eso no afecta la búsqueda en la página (es decir, si busca “perro”, encontrará <span>d</span><span>o</span><span>g</span>), pero sí afecta a algunos lectores de pantalla en el sentido de que tratarán cada letra de manera distinta, lo que puede resultar en una salida de audio bastante terrible, como pausas entre letras donde no las esperaría o no las querría.
¡Sin embargo, es totalmente solucionable!
Acabo de leer sobre lo poderoso aria-label es a través de Web Platform News, citando a Amelia Bellamy-Royds:
Un aria-label El atributo en un botón o enlace reemplaza efectivamente el contenido de texto de ese elemento con la nueva etiqueta.
¡Fue genial ver que eso es lo que hace Lettering.js por defecto! Y Splitting.js está descubriendo el mejor método para ellos, lo que implica aria-label.
Oh, y como siempre ::nth-letter() Podría ser genial. Resumen de 2018 de una solicitud de 2011.