Yayınlanma tarihi: 6 Aralık 2024
CSS'nin Durumu 2024 ve HTML'nin Durumu 2024'ün sonuçları kullanıma sunuldu. Bu yayında, bu anketlerdeki en ilgi çekici bulgulardan bazılarına ilk bakış atıyoruz.
Web platformu hakkında iyimserlik
Kullanıcıların HTML ve CSS ile ilgili yaşadığı bazı sorunlara bakmadan önce, anketler platformla ilgili çok fazla iyimserlik vermektedir. Web platformunun genel olarak doğru yönde ilerleyip ilerlemediği sorulduğunda, HTML Durumu anketine katılanların% 58'i bu ifadeye katılırken% 18'i kesinlikle katılıyordu.
CSS'de ise :has(), katılımcıların% 36'sının en iyi yeni özellik olarak sıralamasıyla en sevilen yeni CSS özelliği oldu. İkinci favori ise CSS iç içe yerleştirmeyle eşit olarak% 17'lik bir orana sahip @container.
Ne kullanıyorsunuz?
CSS verilerinde bazı sürprizler vardı. Örneğin, kullanıcıların% 75'inden fazlası CSS filtre efektlerini kullanmıştır. Bu da bu özelliği en çok kullanılan özellik haline getirmiştir. Yıllar içinde akışla ilgili şikayetlerin sayısı göz önüne alındığında, akış katmanlarının kullanıcıların yalnızca% 18,9'u tarafından kullanılması ilginç bir durumdur. Bu durum, kullanıcıların ardışık düzenle ilgili sorunlarla karşılaşma olasılığını azaltan Tailwind gibi araçların benimsenmesiyle ilgili olabilir.
Kullandığınız öğeler için HTML anketinde <main> ve <nav> gibi yer işareti öğeleri üst sıralarda yer alıyor. Geç yükleme ve duyarlı resim tekniklerini bu kadar çok kullanıcının kullandığını görmek harika.
En yaygın tarayıcı desteği sorunları
Geliştiricilerle konuştuğumuzda her zaman birlikte çalışabilirlik veya özellikler için tarayıcı desteğiyle ilgili sorunlar gündeme gelir. Anketlerde doğrudan karşılaştığınız sorunlarla ilgili sorular soruldu. En çok soruna neden olan 10 özellik aşağıda verilmiştir. Bu özellikler, ilgili özelliği seçen kullanıcıların yüzdesine göre sıralanmıştır.
- Popover API
- Sabitleme konumlandırması
- Kapsayıcı Sorguları
:has()- CSS iç içe yerleştirme görünümü
- Transition API
- Alt ızgara
- Izgara
<dialog>- Progresif Web Uygulamaları
Sabitleme konumlandırması her iki ankette de% 11, Görüntü Geçişi API'si ise CSS Durumu'nda% 9 ve HTML Durumu'nda% 8 puan aldı. Bu da geliştiricilerin bu özellikleri ne kadar değerli bulduğunu gösteriyor.
İlginç bir şekilde, bu özelliklerden birkaçı birlikte çalışabilir. Kapsayıcı sorguları, :has(), CSS iç içe yerleştirme ve alt ızgara, temel düzeydedir. Popover API de kullanılabilir durumdadır ancak iOS'te hafif kapatma ile ilgili bir sorun vardır. <dialog> öğesi, CSS ızgara düzeni gibi artık yaygın olarak kullanılabilir. Kullanıcıların hangi sorunlarla karşılaştığını öğrenmek için bu sonuçları incelemek faydalı olabilir. Örneğin, ızgara için verilen yanıtlar genellikle gerçek bir birlikte çalışabilirlik sorunundan bahsetmek yerine ızgaranın öğrenilmesinin zor olduğunu belirtir.
Temel düzeyin, geliştiricilerin durumları anlamalarına ve karşılaştıkları sorunların tarayıcı uyumluluğu eksikliğinden mi yoksa başka bir nedenden mi kaynaklandığını öğrenmelerine yardımcı olacağını umuyoruz. Bu anketlerde özelliklerin temel durumunun vurgulandığını görmek çok güzel. En yaygın CSS sorunlarının tarayıcılara göre kullanılabilirlik durumunu webstatus.dev adresinde de görebilirsiniz.
Eksik özellikler
Anketlerde, platformda hangi özelliklerin ve işlevlerin eksik olduğu da sorulur. Bu, hâlâ yapılması zor olan şeyleri görmemize yardımcı oluyor. Bu soruya verilen yanıt oranları daha düşüktü ancak CSS'nin Durumu anketinde kullanıcılar en çok karma, koşullu mantık ve karo düzeni hakkında bilgi istedi.
İlginç bir şekilde kullanıcılar bir üst öğe seçici (:has() bu işlevi sağlar) ve iç içe yerleştirme (zaten mevcuttur ve Temel Yeni olarak kullanılabilir) de istedi.
HTML'nin Durumu anketine katılanlara "HTML'ye 3 öğe ekleyebilseydiniz bunlar ne olurdu?" sorusu soruldu. Katılımcıların% 51'i veri tabloları istedi. Sekmeler ve açma/kapatma düğmeleri de popüler seçenekler arasında yer aldı.
Hangi konuda daha fazla bilgi edinmek istiyorsunuz?
Anketlerde, anketi tamamladıktan sonra hakkında daha fazla bilgi edinmek istediğiniz öğeleri bir okuma listesine ekleyebileceğiniz bir özellik bulunur. Bu veriler, özellikle geliştirici içeriği oluşturma işindeyseniz değerlidir. Aşağıdaki listede, iki ankette de en çok tercih edilen on özellik yer almaktadır. Bu özellikler, listesine ekleyen anket katılımcılarının yüzdesine göre sıralanmıştır.
- CSS
hanging-punctuation - CSS
offset-path @scope- Sabitleme konumlandırması
- Özelleştirilebilir seçim
view-timelinescroll-timelinefocusgroupözellik- Ayrık mülkler animasyonu
image()
CSS okuma listesini ve HTML okuma listesini inceleyerek sonuçların tamamına göz atın.
Web topluluğundan bir sinyal
Chrome, en çok sorun yaşadığınız konular ve web platformunda en çok ilgilendiğiniz konular hakkında bilgi edinmenin bir yolu olarak bu anketleri destekler. Kullandığımız tek sinyal olmasa da yorumlar, bize doğrudan düşüncelerinizi bildirebileceğiniz bir yerdir. Bu anketlerden birini veya ikisini birden doldurduysanız teşekkür ederiz. Web'i istediğiniz şekilde iyileştirmemize yardımcı oluyorsunuz. Yardım etmek istiyorsanız The State of JS'ye katılmak için hâlâ zamanınız var.