मॉडर्न वेब गाइडेंस के विषयों के बारे में जानें

सलाह के अलग-अलग विषयों के बारे में जानने के लिए, यहां दिए गए विषयों को ब्राउज़ करें.

मुख्य विषय

वेब पर सुरक्षित और अच्छी क्वालिटी वाले अनुभव बनाने के सबसे सही तरीके.

accessibility

अपने पूरे ऐप्लिकेशन में, ऐक्सेस करने की सुविधा से जुड़े पैटर्न का आकलन करें, उन्हें ठीक करें, और लागू करें.

GitHub पर, accessibility गाइड देखें

performance

Core Web Vitals को ऑप्टिमाइज़ करें, पेज लोड होने में लगने वाले समय को कम करें, और उपयोगकर्ता के इनपुट के हिसाब से रिस्पॉन्स को बेहतर बनाएं.

GitHub पर, performance गाइड देखें

privacy

निजता को ध्यान में रखकर डिज़ाइन करना, डेटा को कम से कम इकट्ठा करना, तीसरे पक्ष से ऑडिट कराना, और डेटा को सुरक्षित तरीके से मैनेज करना जैसी सुविधाएं लागू करें.

GitHub पर, privacy गाइड देखें

security

वेब की सामान्य कमज़ोरियों (XSS, CSP, कुकी, क्रॉस-ऑरिजिन आइसोलेशन) से बचाने के लिए, सुरक्षा से जुड़ी ज़रूरी गाइडलाइन लागू करें.

GitHub पर, security गाइड देखें

वेब टेक्नोलॉजी

वेब की मुख्य भाषाओं, टेक्नोलॉजी, और रनटाइम एनवायरमेंट का इस्तेमाल करने के सबसे सही तरीके.

html

मॉडर्न एचटीएमएल आर्किटेक्चर, सिमैंटिक्स, नेटिव इंटरैक्टिव एपीआई (डायलॉग, पॉपओवर, डीटेल), फ़ोकस मैनेजमेंट, और संसाधन की प्राथमिकता तय करने की सुविधा लागू करें.

GitHub पर, html गाइड देखें

css

मॉडर्न सीएसएस आर्किटेक्चर, लेआउट, और परफ़ॉर्मेंस से जुड़े सबसे सही तरीके लागू करें.

GitHub पर, css गाइड देखें

css-layout

फ़्लेक्सबॉक्स, ग्रिड, सबग्रिड, कंटेनर क्वेरी, ऐंकर पोज़िशनिंग, और इंट्रिंसिक साइज़िंग जैसी मॉडर्न सीएसएस सुविधाओं का इस्तेमाल करके, रिस्पॉन्सिव लेआउट बनाएं.

GitHub पर, css-layout गाइड देखें

forms

ऐक्सेस किए जा सकने वाले, सुरक्षित, और इस्तेमाल में आसान वेब फ़ॉर्म बनाएं.

GitHub पर, forms गाइड देखें

passkeys

वेब ऐप्लिकेशन में, WebAuthn और पासकी लागू करने के लिए, मॉडर्न सिद्धांतों का पालन करें.

GitHub पर, passkeys गाइड देखें

webmcp

क्लाइंट-साइड ब्राउज़र की सुविधाओं को एआई एजेंट के लिए इंटरैक्टिव टूल के तौर पर दिखाने के लिए, WebMCP लागू करें.

GitHub पर, webmcp गाइड देखें

ब्राउज़र की सुविधाएं (ऑप्ट-इन)

खास ब्राउज़र एपीआई और प्लैटफ़ॉर्म के साथ काम करने के सबसे सही तरीके. ये, modern-web-guidance से अलग कौशल हैं. इन्हें अलग-अलग इंस्टॉल करना होगा.

chrome-extensions

Manifest V3 के तहत, सुरक्षित और Chrome की नीतियों के मुताबिक Chrome एक्सटेंशन बनाएं. इससे, सर्विस वर्कर के लाइफ़साइकल और सैंडबॉक्सिंग से जुड़ी सामान्य समस्याओं से बचा जा सकता है. साथ ही, मेटाडेटा, निजता नीतियों, और अनुमतियों की वजहें तैयार करके, Chrome Web Store पर पब्लिश करने की प्रोसेस को आसान बनाया जा सकता है. ऑप्ट-इन करने के लिए, Modern Web Guidance इंस्टॉल करते समय, chrome-extensions कौशल चुनें:

npx modern-web-guidance@latest install --choose

GitHub पर, chrome-extensions कौशल देखें

अगले चरण

अब आपको Modern Web Guidance के बारे में पता चल गया है, तो इसे आज़माएं! Modern Web Guidance में काम करने वाली सुविधाओं और इस्तेमाल के उदाहरणों के बारे में जानें. साथ ही, शुरू करने के लिए कुछ सैंपल प्रॉम्प्ट आज़माएं.