Nieuw in Chrome 127

Adriana Jara

Dit is wat u moet weten:

  • font-size-adjust helpt u de leesbaarheid van reservelettertypen te verbeteren.
  • Gebruikersactivaties worden nu doorgegeven tussen beeld-in-beeld-documenten en hun opener.
  • Scrollcontainers kunnen nu standaard via het toetsenbord worden gefocust.
  • En er is nog veel meer .

Ik ben Adriana Jara. Laten we erin duiken en kijken wat er nieuw is voor ontwikkelaars in Chrome 127.

CSS font-size-adjust

De leesbaarheid van uw site kan afnemen als de lettertypefamilie van de eerste keuze niet beschikbaar is en het reservelettertype een aanzienlijk andere aspectwaarde heeft.

De volgende afbeelding toont het verschil tussen de lettertypen Verdana en Times, ook al heeft de tekst dezelfde grootte.

Tekstregels met de volgende tekst: 'Deze tekst gebruikt het verdana-lettertype (14px), dat relatief grote kleine letters heeft' en 'Dit gebruikt het Times-lettertype (14px), dat moeilijk leesbaar is in kleine formaten'

Als uw site terug zou vallen op het Times-lettertype, wordt het een stuk moeilijker om te lezen.

Met de CSS-eigenschap font-size-adjust kunt u de lettergrootte van reservelettertypen aanpassen om de aspectwaarde (hoogte van kleine letters gedeeld door lettergrootte) consistent te houden, zodat de tekst er hetzelfde uitziet, ongeacht het gebruikte lettertype.

In de volgende afbeelding behoudt het gebruik van font-size-adjust de leesbaarheid tussen de lettertypen Verdana en Times.

   font-size-adjust: 0.545;

Tekstregels met de tekst 'Deze tekst gebruikt het verdana-lettertype (14px), dat relatief grote kleine letters heeft', 'Hier wordt het Times-lettertype (14px) gebruikt, dat moeilijk leesbaar is in kleine formaten' en 'Deze tekst in het 14px Times-lettertype is aangepast aan dezelfde aspectwaarde als het Verdana-lettertype, dus kleine letters worden genormaliseerd over de twee lettertypen

Met de lancering van font-size-adjust in Chrome wordt deze functie Baseline nieuw beschikbaar. Lees de details in CSS font-size-adjust bevindt zich nu in Baseline .

Beeld-in-beeld documenteren: gebruikersactivatie propageren

De Document Picture-in-Picture API verspreidt nu gebruikersactivaties tussen het document Picture-in-Picture-venster en de opener ervan.

Bezoek de demonstratie van de activering van gebruikersgebaren en bekijk de wijzigingen in de achtergrondkleur van de pagina wanneer een gebruikersactivatie wordt gedetecteerd. Het gebruikersgebaar wordt in beide contexten doorgevoerd, waardoor de achtergrond voor beide vensters verandert.

Dit maakt gebruikersactivaties in een beeld-in-beeldvenster van een document bruikbaar in het openingsvenster en andersom. Deze verandering maakt het gebruik van door gebruikers geactiveerde API's ergonomischer, omdat gebeurtenishandlers in het beeld-in-beeldvenster van het document vaak in de context van de opener worden uitgevoerd, zodat de context van de opener toegang nodig heeft tot het gebruikersgebaar.

Bezoek Picture-in-Picture voor elk element, niet alleen <video> voor meer details.

Met toetsenbord focusseerbare scrollcontainers.

Scrollcontainers die op het toetsenbord kunnen worden gefocust, zijn belangrijk om scrollers en de inhoud binnen scrollers toegankelijker te maken voor alle gebruikers.

Vanaf nu zijn scrollers standaard klik-focusseerbaar en programmatisch focusseerbaar. Vóór deze wijziging kon een scrollerelement alleen de focus op tabbladen hebben als de tabindex expliciet was ingesteld op 0 of hoger.

Merk op dat dit gedrag alleen optreedt als de scroller geen focusseerbare kinderen heeft. Als de scroller bijvoorbeeld al een knop bevat, slaat de tabbladfocus de scroller over en wordt de focus direct op de knop gelegd.

Best practices op het gebied van toegankelijkheid bevelen aan dat alle functies beschikbaar moeten zijn via een toetsenbord. Door het toetsenbord te focusseren scrollers maken het standaard gemakkelijker voor de gebruiker om sequentiële focusnavigatie te gebruiken om toegang te krijgen tot de scrollers.

Zie meer details in Focusbare scrollers op het toetsenbord

En meer!

Natuurlijk is er nog veel meer.

  • Gelijktijdige weergaveovergangen van hetzelfde document in een hoofdframe en een iframe van dezelfde oorsprong zijn nu beschikbaar.

  • Alt-tekst gegenereerd op basis van CSS-inhoud ondersteunt nu meerdere argumenten.

  • Het DevTools- prestatiepaneel legt nu WebSocket-berichtgebeurtenissen vast en toont deze in de prestatietracering.

Lees de volledige releaseopmerkingen .

Verder lezen

Dit behandelt slechts enkele belangrijke hoogtepunten. Controleer de volgende links voor aanvullende wijzigingen in Chrome 127.

Abonneren

Als u op de hoogte wilt blijven, abonneert u zich op het YouTube-kanaal van Chrome Developers . U ontvangt dan een e-mailmelding wanneer we een nieuwe video lanceren.

Yo soy Adriana Jara, en zodra Chrome 127 uitkomt, ben ik hier om je te vertellen wat er nieuw is in Chrome!