परिचय

HTML कोड का परीक्षण करना किसी भी वेब डेवलपर के लिए एक आवश्यक कौशल है। चाहे आप एक साधारण पैराग्राफ टैग का सत्यापन कर रहे हों या एक जटिल प्रतिक्रियाशील लेआउट को डीबग कर रहे हों, परीक्षण के लिए एक व्यवस्थित दृष्टिकोण रखने से समय की बचत होती है और बग को उत्पादन तक पहुंचने से रोका जाता है।

परीक्षण के तरीके

1. ऑनलाइन HTML रनर

HTML का परीक्षण करने का सबसे तेज़ तरीका HTML कोड रनर जैसे ऑनलाइन टूल से है। अपना कोड पेस्ट करें, रन पर क्लिक करें और आउटपुट देखें। त्वरित परीक्षण और पृथक डिबगिंग के लिए आदर्श।

2. स्थानीय ब्राउज़र परीक्षण

अपने HTML को .html फ़ाइल के रूप में सहेजें और इसे सीधे अपने ब्राउज़र में खोलें। यह बहु-फ़ाइल परियोजनाओं के लिए अधिक यथार्थवादी है लेकिन पुनरावृत्ति के लिए धीमा है।

3. ब्राउज़र डेवलपर उपकरण

DevTools खोलने के लिए F12 दबाएँ। HTML का निरीक्षण करने के लिए एलिमेंट पैनल, जावास्क्रिप्ट डिबगिंग के लिए कंसोल पैनल और संसाधन लोडिंग समस्याओं के लिए नेटवर्क पैनल का उपयोग करें।

4. क्रॉस-ब्राउज़र परीक्षण

लगातार रेंडरिंग सुनिश्चित करने के लिए अपने HTML को कई ब्राउज़रों (क्रोम, फ़ायरफ़ॉक्स, सफारी, एज) में परीक्षण करें। प्रत्येक ब्राउज़र में थोड़े भिन्न रेंडरिंग इंजन होते हैं।

क्या परीक्षण करें

  • संरचना — क्या तत्व सही ढंग से नेस्टेड हैं?
  • शब्दार्थ — क्या आप सही HTML5 तत्वों का उपयोग कर रहे हैं?
  • पहुंच-योग्यता — क्या छवियों में वैकल्पिक पाठ है? क्या फॉर्म लेबल किए गए हैं?
  • प्रतिक्रियाशीलता — क्या लेआउट विभिन्न स्क्रीन आकारों पर काम करता है?
  • प्रदर्शन — क्या छवियां अनुकूलित हैं? क्या HTML दुबला है?
  • सत्यापन — क्या HTML W3C सत्यापन पास करता है?

परीक्षण चेकलिस्ट

  1. ✓ HTML त्रुटियों के बिना मान्य होता है
  2. ✓ लक्षित ब्राउज़रों में पृष्ठ सही ढंग से प्रस्तुत होता है
  3. ✓ रिस्पॉन्सिव लेआउट प्रमुख ब्रेकप्वाइंट पर काम करता है
  4. ✓ सभी लिंक और बटन सही ढंग से काम करते हैं
  5. ✓ छवियाँ उचित वैकल्पिक पाठ के साथ लोड होती हैं
  6. ✓ फॉर्म सही ढंग से सबमिट और सत्यापित करें
  7. ✓ जावास्क्रिप्ट कंसोल त्रुटियों के बिना चलता है
  8. ✓ पेज कीबोर्ड नेविगेशन के माध्यम से पहुंच योग्य है

अक्सर पूछे जाने वाले प्रश्नों

एक ऑनलाइन HTML रनर का उपयोग करें. अपना कोड पेस्ट करें, रन पर क्लिक करें और तुरंत आउटपुट देखें।

ब्राउज़र DevTools रिस्पॉन्सिव मोड (Chrome में Ctrl+Shift+M) का उपयोग करें या अपनी ब्राउज़र विंडो का आकार बदलें।

हाँ। त्रुटियों और अनुरूपता की जाँच के लिए W3C मार्कअप सत्यापन सेवा का उपयोग करें।