आपके कोड का परीक्षण करने के लिए 7 सर्वश्रेष्ठ नि:शुल्क ऑनलाइन HTML संपादक

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

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

चाहे छोटे HTML स्निपेट हों या संपूर्ण वेबसाइट प्रोजेक्ट, एक ऑनलाइन HTML संपादक आदर्श है।

आपको ऑनलाइन HTML संपादक का उपयोग क्यों करना चाहिए

ब्राउज़र-आधारित HTML संपादक का उपयोग करना निम्नलिखित कारणों से Notepad++ जैसी किसी चीज़ पर अच्छी समझ रखता है:

ऑनलाइन HTML संपादक सीधे आपके वेब ब्राउज़र में चलते हैं
अपने HTML कोड का ऑनलाइन परीक्षण करें --- देखें कि कोड अपेक्षित रूप से चलता है या नहीं
रीयल-टाइम वेब पूर्वावलोकन देखें --- आपके द्वारा संपादित किए जाने पर पूर्वावलोकन अपडेट
अपने वर्कफ़्लो को सुव्यवस्थित करें --- अब और बचत नहीं करना, ब्राउज़र में लोड करना, संपादक पर वापस स्विच करना, और दोहराना
प्लेटफ़ॉर्म अज्ञेयवादी --- वे वेब कनेक्शन वाले किसी भी उपकरण पर चलते हैं।

यह अंतिम बिंदु बहुत महत्वपूर्ण है। इसका मतलब है कि आप एक पीसी पर क्रोमबुक के रूप में आसानी से एक वेब पेज विकसित कर सकते हैं। आप एक Android टैबलेट, या रास्पबेरी पाई जैसे के कंप्यूटर का भी उपयोग कर सकते हैं।

प्रोग्रामिंग और विकास को समझने के लिए HTML कोडिंग एक सुलभ, सीधा प्रवेश द्वार है। आपको लगातार अपने HTML कोड का परीक्षण करने की आवश्यकता है --- आपकी ब्राउज़र विंडो में लाइव परिणामों से बेहतर क्या हो सकता है?

आइए वर्तमान में उपलब्ध कुछ सर्वश्रेष्ठ ऑनलाइन HTML संपादकों को देखें।

1. कोडपेन

कोडपेन वेब डेवलपर्स के लिए एक 'सामाजिक विकास का माहौल' है, जिसका मूल रूप से मतलब है कि यह सहयोग सुविधाओं के साथ एक ऑनलाइन संपादक है। यह एक सरल लेआउट प्रदान करता है। आपको HTML के लिए एक पैनल, CSS के लिए एक पैनल, और JavaScript के लिए एक पैनल, साथ ही रीयल-टाइम पूर्वावलोकन के लिए एक पैनल मिलेगा। सभी पैनल आकारों को किनारों को चारों ओर खींचकर समायोजित किया जा सकता है।

आप 'पेन' बना सकते हैं, जो वेब कोड को बदलने के लिए अलग-अलग खेल के मैदानों की तरह हैं। एकाधिक पेन को एक साथ संग्रह में समूहीकृत किया जा सकता है।

जबकि बुनियादी उपयोग के लिए साइनअप निःशुल्क है, निजी पेन और संग्रह के लिए आवश्यक है: प्रो खाता . यह /महीने से शुरू होता है और इसमें एसेट होस्टिंग, एम्बेड करने योग्य थीम, रीयल-टाइम सहयोग, और कोडपेन के पूर्ण वेब विकास आईडीई तक पहुंच शामिल है।

बहुत से लोग कोडपेन को सर्वश्रेष्ठ ऑनलाइन HTML संपादक मानते हैं। यह देखने की कोशिश करें कि क्या यह आपकी आवश्यकताओं के अनुरूप है।

2. JSFiddle

JSFiddle काफी हद तक ऐसा लगता है: एक सैंडबॉक्स जहां आप जावास्क्रिप्ट के साथ फील कर सकते हैं। आप शायद जानते हैं कि जावास्क्रिप्ट एचटीएमएल और सीएसएस के साथ हाथ से जाता है। इसका मतलब है कि JSFiddle के साथ, आप JSFiddle के संपादन इंटरफ़ेस के साथ तीनों को एक साथ संपादित कर सकते हैं।

आप चाहें तो जावास्क्रिप्ट को पूरी तरह से स्किप कर सकते हैं।

JSFiddle के बारे में अच्छी बात यह है कि आप साइडबार में बाहरी अनुरोध जोड़ सकते हैं। यह आपको अपने एचटीएमएल को बढ़ाने के लिए ऑफ-साइट जावास्क्रिप्ट और सीएसएस फाइलों को शामिल करने देता है। Tidy बटन भी उपयोगी है, जो स्वचालित रूप से आपके कोड के इंडेंटेशन को साफ़ करता है, जबकि Collaborate पर क्लिक करने से रीयल-टाइम ऑनलाइन सहयोग की अनुमति मिलती है।

केवल नकारात्मक पक्ष यह है कि पूर्वावलोकन पैनल को अपडेट करने के लिए आपको रन बटन पर क्लिक करना होगा।

3. जेएसबीन

JSBin को JSFiddle के एक सरल और स्वच्छ विकल्प के रूप में देखें। आप केवल शीर्ष टूलबार वाले पैनल को टॉगल करके HTML, CSS और JavaScript के किसी भी संयोजन को संपादित कर सकते हैं। अधिकतम लचीलेपन के लिए आप आवश्यकतानुसार पूर्वावलोकन पैनल और कंसोल पैनल को भी चालू कर सकते हैं।

विज़िओ टीवी में ऐप्स कैसे जोड़ें

लेकिन जहां JSFiddle आपको बाहरी CSS और जावास्क्रिप्ट संसाधनों को जोड़ने की अनुमति देता है, वहीं JSBin आपको पूर्वनिर्धारित जावास्क्रिप्ट पुस्तकालयों तक सीमित कर देता है। हालांकि चयन अच्छा है, jQuery से लेकर रिएक्ट से लेकर एंगुलर तक और बहुत कुछ।

जबकि JSBin मुफ़्त है और इसके लिए किसी खाते की आवश्यकता नहीं है, आपको एक की आवश्यकता होगी प्रो खाता उन्नत सुविधाओं के लिए। इनमें JSBin के माध्यम से प्रकाशित पृष्ठों के लिए निजी डिब्बे, कस्टम एम्बेड, संपत्ति होस्टिंग, ड्रॉपबॉक्स सिंक और वैनिटी URL शामिल हैं।

चार। लाइववीव

लाइववेव एक आकर्षक यूजर इंटरफेस के साथ, पिछले संपादकों के समान है। JSFiddle की तरह, Liveweave रीयल-टाइम सहयोग की अनुमति देता है, और JSBin की तरह, यह आपको jQuery जैसे पूर्वनिर्धारित तृतीय-पक्ष संसाधनों में लिंक करने देता है।

लेकिन इसकी कुछ अनूठी विशेषताएं भी हैं। लोरेम इप्सम जेनरेटर आपकी वर्तमान कर्सर स्थिति पर प्लेसहोल्डर टेक्स्ट बनाता है। CSS एक्सप्लोरर, CSS स्टाइल बनाने के लिए WYSIWYG टूल प्रदान करता है और Color Explorer आपको सही रंगों का चयन करने में मदद करता है। इस बीच, वेक्टर संपादक आपको अपनी साइट के लिए वेक्टर ग्राफिक्स बनाने में सक्षम बनाता है।

ट्विटर पर किसी को अनटैग कैसे करें

5. एचटीएमएलहाउस

यदि आप केवल HTML (यानी कोई CSS या JavaScript नहीं) की परवाह करते हैं तो HTMLhouse एक अच्छा विकल्प है। स्वच्छ और न्यूनतम, यह बाईं ओर संपादन और दाईं ओर रीयल-टाइम पूर्वावलोकन के साथ लंबवत रूप से विभाजित है।

उपयोगी है अपने एचटीएमएल को प्रकाशित करने और इसे निजी तौर पर (निजी यूआरएल के माध्यम से) या सार्वजनिक रूप से साझा करने की क्षमता (इसमें जोड़ा गया HTMLhouse का ब्राउज़ पृष्ठ ) यह सरल लेकिन प्रभावी है, यही वह जगह है जहां एक ऑनलाइन HTML संपादक खेल में आता है और उत्कृष्टता प्राप्त करता है।

ध्यान दें कि HTMLhouse यहां के लोगों द्वारा बनाया और बनाए रखा गया था लिखें.as , एक व्याकुलता मुक्त ऑनलाइन लेखन उपकरण। यदि आप अपनी स्वयं की साइट सामग्री लिखने की योजना बना रहे हैं तो इसे ध्यान में रखें।

6. एचटीएमएलजी

एक अन्य विकल्प HTMLG, HTML के लिए कोड और पूर्वावलोकन पैन का उपयोग करने के समान पैटर्न का अनुसरण करता है। हालांकि, इस टूल में एक ही एकीकृत प्रोजेक्ट में CSS और JavaScript शामिल नहीं हैं। इसके बजाय, यदि आप उन्हें संपादित करना चाहते हैं, तो आपको एक नया टैब खोलना होगा और उन्हें अलग प्रोजेक्ट के रूप में संपादित करना होगा।

यह आपके ब्राउज़र में शुद्ध HTML बदलाव और परीक्षण कोड के लिए इसे आदर्श बनाता है; कम इसलिए यदि आप CSS संपादन शामिल करना चाहते हैं।

ध्यान दें कि यदि आप HTMLG के साथ पूर्ण वेब पृष्ठों का परीक्षण कर रहे हैं तो 300 शब्दों की सीमा है। इसे बढ़ाने के लिए, आप विज्ञापन-मुक्त प्रीमियम संस्करण के लिए साइन अप कर सकते हैं, जो कम से कम .80 प्रति माह से शुरू होता है।

7. डब्बलेट

ऑनलाइन HTML संपादकों पर थोड़ा अलग रूप पेश करते हुए, Dablet स्क्रीन को तीन/चार पैन के बजाय दो में विभाजित करता है। तो, आपके पास HTML और परिणाम के लिए एक दृश्य है, और CSS और परिणाम के लिए एक अलग (लेकिन जुड़ा हुआ) दृश्य है।

यह कोड और पूर्वावलोकन का एक स्पष्ट दृश्य देते हुए अधिक स्थान प्रदान करता है। इसके अलावा, अंतर्निहित w3.org HTML और CSS सत्यापनकर्ता किसी भी मुद्दे पर प्रकाश डालते हैं।

यदि आपको अपने साइट कोड का परीक्षण करने के लिए एक स्पष्ट डेस्कटॉप स्थान की आवश्यकता है, तो यह आपके लिए सबसे अच्छा HTML संपादक हो सकता है।

अपने कौशल में सुधार के लिए सर्वश्रेष्ठ ऑनलाइन HTML संपादकों का उपयोग करें

यदि आप HTML के बारे में केवल वही जानते हैं जो आपने एक दशक पहले सीखा था, तो अब समय आ गया है। HTML5 को 2014 में वापस रिलीज़ किया गया और कुछ नए मानकों और सुविधाओं को पेश किया गया। निश्चित नहीं हूं कि कहां से शुरुआत की जाए? इन आवश्यक नए HTML5 तत्वों को देखें।

HTML5 वेब डिज़ाइन और विकास में अच्छे अभ्यास सीखना चाहते हैं? इन्हें जांचें गुणवत्ता वाले HTML कोडिंग उदाहरण वाली वेबसाइटें . आपको अपने वेब विकास कौशल को उन्नत करने के लिए इन अन्य उपकरणों पर भी एक नज़र डालनी चाहिए।

साझा करना साझा करना कलरव ईमेल 15 विंडोज़ कमांड प्रॉम्प्ट (सीएमडी) कमांड जो आपको अवश्य जानना चाहिए

कमांड प्रॉम्प्ट अभी भी एक शक्तिशाली विंडोज टूल है। यहां सबसे उपयोगी सीएमडी कमांड हैं जिन्हें हर विंडोज उपयोगकर्ता को जानना आवश्यक है।

आगे पढ़िए संबंधित विषय

प्रोग्रामिंग
पाठ संपादक
वेब विकास
WYSIWYG संपादकों
एचटीएमएल 5
स्क्रिप्टिंग

लेखक के बारे में क्रिश्चियन कावली(१५१० लेख प्रकाशित)

डेस्कटॉप और सॉफ्टवेयर समर्थन में व्यापक अनुभव के साथ सुरक्षा, लिनक्स, DIY, प्रोग्रामिंग, और टेक समझाया, और वास्तव में उपयोगी पॉडकास्ट निर्माता के लिए उप संपादक। लिनक्स प्रारूप पत्रिका में योगदानकर्ता, ईसाई एक रास्पबेरी पाई टिंकरर, लेगो प्रेमी और रेट्रो गेमिंग प्रशंसक है।

क्रिस्चियन काउली की और फ़िल्में या टीवी शो

हमारे न्यूज़लेटर की सदस्यता लें

तकनीकी युक्तियों, समीक्षाओं, निःशुल्क ई-पुस्तकों और अनन्य सौदों के लिए हमारे न्यूज़लेटर से जुड़ें!

सब्सक्राइब करने के लिए यहां क्लिक करें