Cómo implementar y aplicar estilo al elemento de diálogo | Programar Plus

Una mirada de Christian Kozalla en el <dialog> HTML y usarlo para crear un modal atractivo y accesible.

Me atrae el <dialog> elemento, ya que es uno de esos elementos “obtienes mucho gratis” (incluso más que el elemento amado <details> elemento) y es tan fácil equivocar la accesibilidad modal (por ejemplo, captura de enfoque) que tener este tipo de cosas proporcionadas por un elemento nativo parece … genial. ::backdrop es especialmente genial.

¿Pero es demasiado bueno para ser verdad? El soporte sólido aún no está ahí, y Safari no lo está recogiendo. Christian menciona el polyfill de Google, que definitivamente ayuda a brindar funcionalidad básica a navegadores que de otro modo no serían compatibles.

El principal problema son las pruebas reales en un lector de pantalla. Scott O’Hara tiene un artículo, “Tener un diálogo abierto”, que se ha actualizado tan recientemente como este mismo mes (octubre de 2021), en el que finalmente dice: “[…] el dialog element y su polyfill no son adecuados para su uso en producción “. No dudo de las pruebas de Scott, pero debido a que la mayoría de las personas simplemente desarrollan sus propias experiencias modales prestando poca atención a la accesibilidad, me pregunto si la web estaría mejor si más personas simplemente usaran <dialog> (y el polyfill) de todos modos. Un mayor uso probablemente provocaría más atención y mejoras en el navegador.

(Visited 4 times, 1 visits today)