सीएसएस और एचटीएमएल के स्टेटस के बारे में सर्वे से हमें क्या पता चलता है?

Rachel Andrew

पब्लिश किया गया: 6 दिसंबर, 2024

सीएसएस की स्थिति 2024 और एचटीएमएल की स्थिति 2024 के नतीजे अब लाइव हैं. इस पोस्ट में, उन सर्वे में मिली कुछ सबसे दिलचस्प जानकारी के बारे में बताया गया है.

वेब प्लैटफ़ॉर्म के बारे में आशावादी होना

एचटीएमएल और सीएसएस से जुड़ी कुछ समस्याओं के बारे में जानने से पहले, सर्वे से पता चलता है कि लोगों को इस प्लैटफ़ॉर्म पर काफ़ी उम्मीद है. जब उनसे पूछा गया कि क्या वेब प्लैटफ़ॉर्म सही दिशा में आगे बढ़ रहा है, तो 58% लोगों ने इस बात से सहमति जताई. साथ ही, 18% लोगों ने इस बात से पूरी तरह सहमति जताई.

सीएसएस के लिए, :has() को सीएसएस की सबसे पसंदीदा नई सुविधा के तौर पर चुना गया. 36% लोगों ने इसे सबसे अच्छी नई सुविधा के तौर पर रेटिंग दी. दूसरा पसंदीदा तरीका, @container है. इसे 17% लोगों ने चुना है. यह सीएसएस नेस्टिंग के साथ बराबर है.

किसका इस्तेमाल किया जा रहा है?

सीएसएस डेटा में कुछ आश्चर्यजनक बातें मिलीं. उदाहरण के लिए, 75% से ज़्यादा लोगों ने सीएसएस फ़िल्टर इफ़ेक्ट का इस्तेमाल किया है. इस वजह से, यह सबसे ज़्यादा इस्तेमाल की जाने वाली सुविधा है. पिछले कुछ सालों में, कैस्केड के बारे में मिली शिकायतों की संख्या को देखते हुए, यह दिलचस्प है कि कैस्केड लेयर का इस्तेमाल सिर्फ़ 18.9% लोग करते हैं. शायद Tailwind जैसे टूल का इस्तेमाल करने से, लोगों को कैस्केड से जुड़ी समस्याओं से बचने में मदद मिलती है.

<main> और <nav> जैसे लैंडमार्क एलिमेंट, एचटीएमएल सर्वे में सबसे ज़्यादा इस्तेमाल किए गए एलिमेंट के तौर पर सबसे ऊपर रहे. यह देखकर खुशी हो रही है कि बहुत से लोग लेज़ी लोडिंग और रिस्पॉन्सिव इमेज की तकनीकों का इस्तेमाल कर रहे हैं.

ब्राउज़र के लिए सहायता से जुड़ी सबसे ज़्यादा समस्याएं

डेवलपर से बातचीत करते समय, इंटरऑपरेबिलिटी या सुविधाओं के लिए ब्राउज़र की सहायता से जुड़ी समस्याएं हमेशा सामने आती हैं. सर्वे में आपसे सीधे तौर पर उन समस्याओं के बारे में पूछा गया था जिनका सामना आपको करना पड़ा. समस्या वाली 10 सुविधाओं की सूची यहां दी गई है. इन सुविधाओं को, उन लोगों के प्रतिशत के हिसाब से रैंक किया गया है जिन्होंने इन सुविधाओं को चुना है.

  • Popover API
  • ऐंकर की पोज़िशनिंग
  • कंटेनर क्वेरी
  • :has()
  • सीएसएस नेस्टिंग व्यू
  • Transition API
  • सबग्रिड
  • ग्रिड
  • <dialog>
  • प्रोग्रेसिव वेब ऐप्लिकेशन

दोनों सर्वे में, ऐंकर पोज़िशनिंग को 11%, सीएसएस की स्थिति में व्यू ट्रांज़िशन एपीआई को 9%, और एचटीएमएल की स्थिति में 8% स्कोर मिला. इससे पता चलता है कि डेवलपर के हिसाब से ये सुविधाएं कितनी अहम हैं.

दिलचस्प बात यह है कि कई सुविधाएं एक-दूसरे के साथ काम करती हैं. कंटेनर क्वेरी, :has(), CSS नेस्टिंग, और सबग्रिड, बेसलाइन के तौर पर नए वर्शन में उपलब्ध हैं. Popover API भी उपलब्ध होगा, लेकिन iOS पर लाइट डिसमिज़ करने से जुड़ी समस्या की वजह से. <dialog> एलिमेंट और सीएसएस ग्रिड लेआउट अब सभी के लिए उपलब्ध हैं. लोगों को क्या समस्याएं आ रही हैं, यह जानने के लिए इन नतीजों को ध्यान से देखें. उदाहरण के लिए, ग्रिड के लिए मिले जवाबों में, अक्सर इंटरऑपरेबिलिटी से जुड़ी किसी असल समस्या के बजाय, इसे सीखने में मुश्किल होने की बात कही जाती है.

हमें उम्मीद है कि Baseline की मदद से, डेवलपर को चीज़ों की स्थिति समझने में मदद मिलेगी. साथ ही, यह भी पता चलेगा कि उन्हें जो समस्या आ रही है वह ब्राउज़र के साथ काम न करने की वजह से है या किसी और वजह से. यह देखकर खुशी हो रही है कि इन सर्वे में, सुविधाओं के आधारभूत स्टेटस को हाइलाइट किया गया है. webstatus.dev पर जाकर, सीएसएस की सबसे ज़्यादा समस्याओं के लिए, सभी ब्राउज़र पर उपलब्धता की स्थिति भी देखी जा सकती है.

सुविधाएं कम हैं

सर्वे में यह भी पूछा जाता है कि प्लैटफ़ॉर्म में कौनसी सुविधाएं और फ़ंक्शन मौजूद नहीं हैं. इससे हमें यह पता चलता है कि कौनसे काम अब भी मुश्किल हैं. इस सवाल के जवाब देने वाले लोगों की संख्या कम थी. हालांकि, सीएसएस के स्टेटस के सर्वे में, लोगों ने सबसे ज़्यादा मिक्सिन, कंडीशनल लॉजिक, और मज़ारी लेआउट के बारे में पूछा. दिलचस्प बात यह है कि लोगों ने पैरंट सिलेक्टर (:has() यह सुविधा देता है) और नेस्टिंग के लिए भी कहा है. ये पहले से मौजूद हैं और बेसलाइन के तौर पर नए सिरे से उपलब्ध हैं.

'एचटीएमएल की स्थिति' सर्वे में हिस्सा लेने वाले लोगों से यह सवाल पूछा गया था, "अगर आपके पास एचटीएमएल में तीन एलिमेंट जोड़ने का विकल्प होता, तो वे कौनसे होते?" 51% लोगों ने डेटा टेबल के लिए कहा. टैब और टॉगल एलिमेंट भी लोकप्रिय विकल्पों में शामिल हैं.

आपको किस बारे में ज़्यादा जानना है?

सर्वे में एक सुविधा होती है, जिसकी मदद से रीडिंग लिस्ट में आइटम जोड़े जा सकते हैं. ऐसा तब किया जा सकता है, जब आपको सर्वे पूरा करने के बाद उनके बारे में ज़्यादा जानना हो. यह अहम डेटा है. खास तौर पर, अगर आप डेवलपर कॉन्टेंट बनाने के कारोबार में हैं. यहां दी गई सूची में, दोनों सर्वे में सबसे ज़्यादा पसंद की गई 10 सुविधाएं शामिल हैं. इन सुविधाओं को, सर्वे में हिस्सा लेने वाले उन लोगों के प्रतिशत के हिसाब से रैंक किया गया है जिन्होंने इन्हें अपनी सूची में जोड़ा है.

  • सीएसएस hanging-punctuation
  • सीएसएस offset-path
  • @scope
  • ऐंकर की पोज़िशनिंग
  • पसंद के मुताबिक चुनने की सुविधा
  • view-timeline
  • scroll-timeline
  • focusgroup एट्रिब्यूट
  • अलग-अलग प्रॉपर्टी का ऐनिमेशन
  • image()

सीएसएस रीडिंग सूची और एचटीएमएल रीडिंग सूची की मदद से, पूरे नतीजे देखें.

वेब कम्यूनिटी से एक सिग्नल

Chrome पर ये सर्वे इसलिए काम करते हैं, क्योंकि इससे हमें आपके सबसे ज़्यादा परेशान करने वाले पहलुओं और वेब प्लैटफ़ॉर्म पर आपकी सबसे ज़्यादा दिलचस्पी वाली चीज़ों के बारे में जानकारी मिलती है. हम इस सिग्नल का ही इस्तेमाल नहीं करते. हालांकि, यह एक ऐसी जगह है जहां आप सीधे तौर पर हमें अपने विचार बता सकते हैं. अगर आपने इनमें से एक या दोनों सर्वे पूरे किए हैं, तो आपका धन्यवाद! आपके सुझावों से, हमें वेब को आपके हिसाब से बेहतर बनाने में मदद मिलती है. अगर आपको मदद करनी है, तो The State of JS में हिस्सा लेने के लिए अब भी समय है.