Interop 2022: Update zum Jahresende

Entdecken Sie einige der Funktionen, die 2022 interoperabel geworden sind.

Das Ende eines weiteren Jahres ist zu Ende und es ist an der Zeit, einen Blick auf die Verbesserungen zu werfen, die Browser vorgenommen haben, um die Interoperabilität der Webplattform zu verbessern. In unserem Beitrag im März dieses Jahres können Sie sich ansehen, wie alles begann, als die Initiative ins Leben gerufen wurde.

Werte für Chrome und Edge Dev auf 71, Firefox Nightly auf 74, Safari-Technologievorschau auf 73.
Die Werte für experimentelle Browser im März 2022

Die Gesamtbewertung am Jahresende zeigt eine erhebliche Verbesserung in allen Suchmaschinen.

Werte für Chrome und Edge Dev auf 90, Firefox Nightly auf 89, Safari Technology Preview auf 94.
Die Punktzahlen für experimentelle Browser im Dezember 2022.

In diesem Beitrag erfahren Sie mehr über die Fortschritte im Jahr 2022. Zusätzlich zu diesen Anzeigentitel-Funktionen gab es in allen Suchmaschinen viele kleinere Verbesserungen. Kleine Probleme, die Inkonsistenzen zwischen Suchmaschinen verursachen und Probleme während der Entwicklung verursachen könnten, wurden behoben. Es ist auf jeden Fall spannend, große, browserübergreifende Funktionen zu sehen, aber es sind manchmal die kleinen Dinge, die die meisten Probleme verursachen, und es ist toll zu sehen, wie sehr sich alles verbessert hat.

Ebenen übereinander weitergeben

Mit Kaskadenebenen können Sie die Kaskade verwalten, indem Sie Selektoren in Ebenen gruppieren. Diese Funktion wird nur dann nützlich, wenn sie überall unterstützt wird. Alle großen Suchmaschinen unterstützen jetzt Kaskadenebenen und die Werte in allen Browsern spiegeln die Interoperabilität der Funktion wider. Es fehlen nur noch wenige Tests für Firefox.

Unterstützte Browser

  • 99
  • 99
  • 97
  • 15,4

Quelle

Das Dialogelement

Mit dem Dialogelement können modale und nicht modale Dialogfelder erstellt werden. Dies ist ein gängiges Muster im Web. Die Verwendung dieses Elements bietet Ihnen Nutzungsfreundlichkeit und Zugänglichkeit, die Sie andernfalls bei der Erstellung Ihrer eigenen Komponenten entwickeln und testen müssten. Im Artikel Erstellen einer Dialogkomponente erläutert Adam Argyle, wie Sie auf diesem Element aufbauen können, um verschiedene Arten von Dialogfeldern zu erstellen.

Unterstützte Browser

  • 37
  • 79
  • 98
  • 15,4

Quelle

Subgrid

Anfang 2022 war Firefox der einzige Browser, der den subgrid-Wert für grid-template-rows und grid-template-columns unterstützt. Safari wird seit 2022 unterstützt und die Funktion befindet sich in der Entwicklung für Chrome. Der Termin für die Interoperabilität zum Jahresende wird wahrscheinlich nicht eingehalten, aber er ist in Kürze.

Unterstützte Browser

  • 117
  • 117
  • 71
  • 16

Quelle

Einheiten des Darstellungsbereichs

Darstellungsbereichseinheiten sind die einzige Funktion, die in allen Suchmaschinen zu 100% der bestandenen Tests bestanden hat. Dazu gehören auch die Konzepte des kleinen und großen Darstellungsbereichs, die berücksichtigen, dass sich die Größe des Darstellungsbereichs auf Mobilgeräten ändert, wenn UI-Elemente der Geräte ein- und ausgeblendet werden. Weitere Informationen zu diesen Anzeigenblöcken finden Sie im Artikel zu den großen, kleinen und dynamischen Darstellungsbereich-Anzeigenblöcken.

Unterstützte Browser

  • 108
  • 108
  • 101
  • 15,4

Farbe 4

Durch diese Sammlung von Farbarbeiten kann CSS nicht nur Farben in höheren Auflösungen angeben (z. B. Display p3, rec2020), sondern auch neue Farbfunktionen bieten, die jeweils einzigartige Dienstprogramme für die Arbeit mit Farben haben. Neue Farbräume sind lch(), oklch(), lab(), oklab(), display-p3, rec2020, a98-rgb, prophoto-rgb, xyz, xyz-d50, xzy-d65: Probieren Sie sie noch heute in Canary aus und verwenden Sie dabei dieses Flag. Diese Änderungen gelten auch für Farbverläufe, sodass Autoren festlegen können, welchen Farbraum ihre Farbverläufe verwenden. Dasselbe Flag aktiviert auch die color-mix()-Unterstützung, sodass Sie zwei Farben in einem Bereich Ihrer Wahl mischen können. Die Funktion color-mix() befindet sich in Safari und Firefox ebenfalls hinter einer Markierung. Mehr Farben, bessere Farben, bessere Farbverläufe und bessere Tools.

Interop 2023

Die Planungsphase von Interop 2023 ist bereits in der Anfangsphase und wir haben vor, bis Ende 2022 nicht aufhören zu wollen. Im neuen Jahr können wir die ausgewählten Funktionen bekanntgeben und freuen uns auf ein weiteres Jahr, in dem wir die Entwicklung für das Web vereinfachen können.

Hero-Image von Ian Schneider