Ya estamos en el último trimestre de 2023, con mucho progreso de todos los navegadores en las áreas de enfoque de Interoperabilidad de 2023. En este artículo, encontrarás información sobre las puntuaciones de Interop 2023 hasta el momento y las funciones que ya están disponibles debido al esfuerzo de este año.
Estado en enero de 2023
En enero de 2023, anunciamos el lanzamiento de Interoperabilidad 2023 y las 26 áreas de enfoque en las que todos los motores trabajarían para mejorar durante el año.
La puntuación general de interoperabilidad para navegadores experimentales en el momento del lanzamiento era de 62.
Estado hasta octubre de 2023
La puntuación general de interoperabilidad para navegadores experimentales es de 89. Si cambias a la vista estable y observas los elementos que ya se enviaron a navegadores estables, la puntuación es un 75 respetable. Detrás de esa puntuación hay un montón de elementos que ahora funcionan en los motores principales. Algunas de estas son pequeñas correcciones de interoperabilidad, pero también algunas funciones importantes.
Dimensione las consultas del contenedor y los valores de longitud de la consulta del contenedor
En febrero, celebramos la interoperabilidad de las consultas de contenedores de tamaño. Esta era una función muy solicitada por los desarrolladores web, y tenerla disponible en todos los motores con tanta rapidez fue un gran beneficio para la plataforma web.
Junto con las consultas de contenedores de tamaño vinieron unidades de consulta de contenedor.
Se usan de la misma manera que las unidades de viewport, como vw. La diferencia es que se relacionan con el contenedor y no con el viewport.
Navegadores compatibles
- 105
- 105
- 110
- 16
Funciones y espacios de color
En mayo, los espacios de color de Lab, LCH, Oklab y Oklch son compatibles con la interoperabilidad. Las notaciones funcionales de CSS lab(), lch(), oklab() y oklch() ofrecen a los desarrolladores una manera de usar estos espacios de color. También se incluyeron las notaciones funcionales color() y color-mix().
Puedes obtener más información sobre estos nuevos espacios de color y funciones en la Guía de colores de CSS en alta definición.
Subcuadrícula
La función de la subcuadrícula para el diseño de cuadrícula de CSS es un valor nuevo para grid-template-columns y grid-template-rows que permite que una cuadrícula anidada use la definición de segmento de la cuadrícula superior. Esto significa que puedes alinear los elementos
que están anidados en la estructura de cuadrícula.
Obtén más información sobre la subcuadrícula. Para descubrir algunas de las complejidades que dificultaron la implementación de la subcuadrícula, mira este video de BlinkOn 18.
El atributo HTML inert
El atributo global HTML inert implica que puedes marcar secciones de tu página como inertes. Esto evita eventos de clic y enfoque, y oculta el elemento y su contenido del árbol de accesibilidad. Esto es útil para el contenido que está visualmente fuera de la pantalla, por ejemplo, y, por lo tanto, también debe estar inactivo para los lectores de pantalla.
Hay mucho más
Además de estas funciones principales, este año se incorporaron muchas otras funciones y correcciones a los navegadores. Hay versiones de navegadores alineadas para el resto del año, y publicaremos un resumen completo una vez que tengamos todas las puntuaciones obtenidas.