Chrome 127'deki yenilikler

Şunları bilmeniz gerekir:

Ben Adriana Jara. Şimdi, Chrome 127'de geliştiriciler için sunulan yeniliklere göz atalım.

CSS font-size-adjust

Birinci tercih yazı tipi ailesi kullanılamadığında ve yedek yazı tipi önemli ölçüde farklı bir en boy değerine sahip olduğunda sitenizin okunabilirliği azalabilir.

Aşağıdaki resimde, metin aynı boyutta olmasına rağmen Verdana ve Times yazı tipleri arasındaki fark gösterilmektedir.

Şu metin satırları: 'Bu metinde nispeten büyük küçük harflerden oluşan verdana yazı tipi (14px) kullanılıyor' ve 'Bu, küçük boyutlarda okunması zor Times yazı tipini (14 piksel) kullanıyor"

Sitenizde Times yazı tipi kullanılmaya başlanırsa okunması çok daha zor hale gelir.

font-size-adjust CSS özelliği, en boy değerinin (küçük harf yüksekliğinin yazı tipi boyutuna bölümü) tutarlı olmasını sağlamak için yedek yazı tiplerinin yazı tipi boyutunu ayarlamanıza yardımcı olur. Böylece, kullanılan yazı tipi ne olursa olsun metnin benzer görünmesi sağlanır.

Aşağıdaki resimde yazı tipi boyutu ayarı kullanıldığında Verdana ve Times yazı tipleri okunabilirliği korur.

   font-size-adjust: 0.545;

'Bu metinde nispeten büyük küçük harfler bulunan verdana yazı tipi (14 piksel) kullanılıyor', 'Bunda küçük boyutlarda okunması zor Times yazı tipi (14 piksel) kullanılıyor" yazan metin satırları ve "14 piksel Kez yazı tipindeki bu metin, Verdana yazı tipiyle aynı en boy değerine ayarlanır. Bu nedenle, küçük harfli yazı tipleri iki yazı tipinde normalleştirilir.

Chrome'da font-size-adjust kullanıma sunulduktan sonra bu özellik "Referans değer" olarak değiştirildi. Ayrıntıları CSS font-size-adjust artık Baseline'da bulabilirsiniz.

Doküman pencere içinde pencere: Kullanıcı etkinleştirme işlemini dağıtma

Document Picture-in-Pencere API'si artık kullanıcı etkinleştirmelerini doküman pencere içinde pencere penceresi ile açıcısı arasında yayıyor.

Kullanıcı hareketi etkinleştirme yayılımı demosunu ziyaret edin ve bir kullanıcı etkinleştirmesi algılandığında sayfanın arka plan rengindeki değişiklikleri görün. Kullanıcı hareketi, her iki pencerenin de arka planını değiştirerek her iki bağlamda da yayılır.

Böylece doküman pencere içinde penceredeki kullanıcı etkinleştirmeleri, pencerenin içinde ve tam tersi şekilde kullanılabilir. Genellikle belgenin pencere içinde pencere penceresindeki etkinlik işleyiciler aslında açanın bağlamında çalıştırıldığı için bu değişiklik, kullanıcı tarafından etkinleştirilen API'lerin kullanımını daha ergonomik hale getirir. Bu nedenle, açanın bağlamının kullanıcı hareketine erişmesi gerekir.

Daha fazla ayrıntı için Sadece <video> değil, tüm öğeler için Pencere İçinde Pencere sayfasını ziyaret edin.

Klavyeye odaklanılabilir kaydırma kapsayıcıları.

Kaydırma kapsayıcılarının klavyeye odaklanılabilir olması, kaydırıcıların ve kaydırıcıların içindeki içeriğin tüm kullanıcılar için daha erişilebilir olmasını sağlamak açısından önemlidir.

Artık kaydırıcılar varsayılan olarak tıklamaya odaklanılabilir ve programlı şekilde odaklanılabilir. Bu değişiklikten önce, sekme dizini açıkça 0 veya daha yüksek bir değere ayarlandığında kaydırıcı bir öğe sekmeye odaklanabiliyordu.

Bu davranışın yalnızca kaydırıcının odaklanılabilir alt öğesi olmadığında gerçekleştiğini unutmayın. Örneğin, kaydırma çubuğunda zaten bir düğme varsa sekme odağı, kaydırma çubuğunu atlar ve doğrudan düğmeye odaklanır.

Erişilebilirlikle ilgili en iyi uygulamalar, tüm özelliklerin klavye kullanılarak kullanılabilir olmasını gerektirir. Varsayılan olarak klavyeye odaklanılabilir kaydırıcılar, kullanıcının kaydırma çubuklarına erişmek için sıralı odaklamayla gezinmesini kolaylaştırır.

Daha fazla ayrıntı için Klavye odaklanılabilir kaydırıcılar bölümüne bakın.

Diğer özellikler

Tabii ki çok daha fazlası var.

  • Ana çerçeve ve aynı kaynak iframe'de eşzamanlı olarak aynı doküman görünümü geçişleri kullanılabilir.

  • CSS içeriğinden oluşturulan alternatif metin artık birden fazla bağımsız değişkeni desteklemektedir.

  • DevTools Performans paneli, artık WebSocket mesaj etkinliklerini yakalayıp performans izlemesinde gösteriyor.

Sürüm notlarının tamamını okuyun.

Daha fazla bilgi

Bu bölümde, yalnızca bazı önemli noktalar yer alıyor. Aşağıdaki bağlantıları kontrol edin: Chrome 127'deki ek değişiklikler.

Abone ol

Gelişmelerden haberdar olmak için şu yayına abone olun: Chrome Developers YouTube kanalı Yeni bir video yayınladığımızda size e-posta bildirimi göndereceğiz.

Merhaba Adriana Jara. Chrome 127 yayınlanır yayınlanmaz size Chrome'daki yenilikleri anlatacağım.