HTML Editor Online
Professional HTML Editors का उपयोग करके वेब पेज बनाए और Modified किए जा सकते हैं। हालांकि, एचटीएमएल सीखने के लिए हम Notepad (पीसी) या TextEdit (मैक) और विसुअल स्टूडियो कोड जैसे साधारण टेक्स्ट एडिटर की सलाह देते हैं। हमारा मानना है कि Simple Text Editor का उपयोग करना HTML सीखने का एक अच्छा तरीका है।…
Professional HTML Editors का उपयोग करके वेब पेज बनाए और Modified किए जा सकते हैं। हालांकि, एचटीएमएल सीखने के लिए हम Notepad (पीसी) या TextEdit (मैक) और विसुअल स्टूडियो कोड जैसे साधारण टेक्स्ट एडिटर की सलाह देते हैं।
हमारा मानना है कि Simple Text Editor का उपयोग करना HTML सीखने का एक अच्छा तरीका है। Notepad या TextEdit के साथ अपना पहला वेब पेज बनाने के लिए नीचे दिए गए चरणों का पालन करें।
क्या आप HTML सीखने या HTML में वेब पेज बनाने के लिए Best FREE HTML Code editors Tools ढूंढ रहे हैं? यदि आपका उत्तर हाँ है, तो यह लेख “HTML Editor” आपके लिए है।
इस लेख में, HTML Editor क्या हैं? कैसे HTML Editors का उपयोग करने के लाभ? और वेब डेवलपमेंट के लिए कौन से HTML कोड एडिटर टूल्स का इस्तेमाल करना चाहिए।
HTML Editors क्या हैं – What is an HTML Editors Tools
HTML कोड एडिटर एक सॉफ्टवेयर टूल है। वेब पेज या वेब विकास के लिए उपयोग किया जाता है। यानी HTML एडिटर टूल का इस्तेमाल वेब पेज या वेबसाइट बनाने और कोड को मॉडिफाई करने के लिए किया जाता है। सभी वेब दस्तावेज़ कुछ टेक्स्ट एडिटर से पहले कोड में लिखे जाते हैं। जिसमें HTML तत्व टैग (जैसे हेडर, बॉडी, पैराग्राफ, टेबल आदि) का उपयोग किया जा सकता है।
अगर आप HTML सीख रहे हैं। इसलिए मैं HTML सीखने के लिए Notepad (पीसी उपयोगकर्ताओं के लिए) और TextEdit (मैक उपयोगकर्ताओं के लिए) जैसे Simple Text Editors की सलाह देता हूं। एक बार जब आप HTML सीख लेते हैं, तो एक पेशेवर HTML Editor का उपयोग करें। HTML Editors में, यह स्वचालित रूप से HTML tags recommend करता है। इससे आपके दिमाग पर ज्यादा दबाव नहीं पड़ता जिससे आपको HTML टैग्स याद नहीं रहेंगे।
5 Best HTML Code Editors for you
HTML Editors को दो प्रकारों में विभाजित किया जा सकता है, एक Text-based HTML Editor है, और दूसरा WYSIWYG Editors है।
- Text-based HTML Editor एक प्रकार का Editor बहुत सरल है। इसमें HTML डॉक्युमेंट बनाने या Edit करने के लिए, आपको HTML पता होना चाहिए। मतलब की आप HTML टैग्स का इस्तेमाल करना जानते हैं.
- WYSIWYG Editor का उपयोग करके वेब पेज डिज़ाइन कर सकते हैं। WYSIWYG का पूरा नाम “जो आप देखते हैं वही आपको मिलता है”।
1) JSFiddle
JSFiddle एक ऑनलाइन HTML Editor है। यह HTML, CSS और जावास्क्रिप्ट का समर्थन करता है। JS Fiddle में कोड स्निपेट्स को fiddles कहा जाता है। यह आपको विभिन्न संस्करणों या भाषा के प्रकारों का चयन करने की अनुमति देता है।
उदाहरण के लिए, HTML पैनल में आप HTML5, XHTML 1.0 Strict, और HTML 4.01 Transitional, आदि जैसे कई विकल्पों में से दस्तावेज़-प्रकार का चयन कर सकते हैं। जावास्क्रिप्ट आपको पुस्तकालयों को लोड करने की अनुमति देता है।
- JSFiddle उपयोग में आसान। एचटीएमएल, सीएसएस और जावास्क्रिप्ट के अलावा, यह जावास्क्रिप्ट ढांचे का समर्थन करता है।
- लेकिन इसमें कोडपेन जैसी उन्नत सुविधाएं नहीं हैं। फालतू के विज्ञापन, उपकरण की लागत/योजना विवरण: नि:शुल्क आदि आपको परेशान करेंगे।
यहाँ से डाउनलोड करें: JSFiddle
2) JS Bin
JS Bin एक ऑनलाइन HTML code editor है। यह HTML, CSS और JavaScript को सपोर्ट करता है। यह तेजी से काम करता है और ऑटो एंडिंग ब्रैकेट्स, हाइलाइटिंग ब्रैकेट्स आदि जैसी कई सुविधाएँ प्रदान करता है।
HTML कोड को टेक्स्ट फ़ाइल में निर्यात कर सकते हैं। यह आपको आपके कोड के लिए रीयल-टाइम आउटपुट दिखाएगा।
यह मोबाइल पर परीक्षण का समर्थन करता है। यह कोड कास्टिंग और कस्टम स्टार्टिंग कोड जैसी दो और सुविधाएँ प्रदान करता है।
उपरोक्त सभी सुविधाएँ मुफ्त संस्करण के लिए हैं। प्रो संस्करण के लिए, यह ड्रॉपबॉक्स सिंक, निजी डिब्बे, वैनिटी यूआरएल, और ईमेल समर्थन इत्यादि जैसी अतिरिक्त अतिरिक्त सुविधाएं प्रदान करता है।
वेबसाइट से डाउनलोड करें: JSBin
3) Adobe Dreamweaver
Adobe Dreamweaver एक वेबसाइट डेवलपमेंट टूल है। नए संस्करणों के लिए, यह सीएसएस, जावास्क्रिप्ट और कुछ सर्वर-साइड प्रोग्रामिंग भाषाओं का समर्थन करता है। इसे विंडोज और मैक ओएस पर इस्तेमाल किया जा सकता है।
सिंटेक्स हाइलाइटिंग (संस्करण 5 और ऊपर), कोड संकेत आदि फीचर्स इसमें मिल जायेगे।
कोड को अपडेट करते समय Code Coloring मदद करता है। आप एक वेबसाइट विकसित कर सकते हैं जो किसी भी स्क्रीन आकार में फिट हो सकती है।
पेशेवरों:
आप अपने कोड के नीचे आउटपुट देख सकते हैं, विंडो को स्विच करने की कोई आवश्यकता नहीं है, जो आपकी गलतियों को बताएगी। इस टूल की लागत/योजना विवरण: $20.99 प्रति माह
वेबसाइट से ख़रीदे: Adobe Dreamweaver
4) Codepen
Codepen एक ऑनलाइन HTML कोड editor है। इसका उपयोग HTML, CSS और Java Scripts के लिए किया जा सकता है। आप Codepen का उपयोग टीमों के साथ, शिक्षा और लेखन के लिए कर सकते हैं।
कोडपेन गोपनीयता बनाए रखने, छवि, पीडीएफ, जावास्क्रिप्ट, सीएसएस, या यहां तक कि एक लघु फिल्म फ़ाइल जैसी किसी भी फ़ाइल को अपलोड करने का समर्थन करता है।
Projects की एक विशेषता प्रदान करता है, जो एक IDE की तरह है। इसमें एक स्वचालित प्री-प्रोसेसिंग, फ़ाइल अपलोडिंग, वेबसाइट परिनियोजन और कई अन्य सुविधाएँ हैं।
आप अपने कोड का आउटपुट कई डिवाइस और कंप्यूटर पर देख सकते हैं। एम्बेड बिल्डर की मदद से आप थीम बना सकते हैं।
प्रोफेसर मोड छात्रों और समूह चैट के साथ कोड और रीयल-टाइम आउटपुट साझा करने जैसी कई सुविधाएं प्रदान करता है। छात्र उस काम को कॉपी करने के लिए सेव कर सकते हैं।
Website: Codepen
5) CoffeeCup
CoffeeCup विंडोज ऑपरेटिंग सिस्टम के लिए एक HTML एडिटर भी है। यह नई HTML और CSS फाइलों के निर्माण का समर्थन करता है। आप किसी भी मौजूदा वेबसाइट पर भी काम कर सकते हैं।
- यह WYSIWYG Editor, क्रॉस-ब्राउज़र संगतता कर सकता है।
- यह टैग संदर्भ और कोड पूर्णता प्रदान करता है और इसमें एक अंतर्निहित FTP लोडर है।
- स्प्लिट-स्क्रीन पूर्वावलोकन सुविधा आपको इसके नीचे अपने कोड का आउटपुट देखने की अनुमति देती है।
- एचटीएमएल के अलावा यह सीएसएस, पीएचपी, और मार्कडाउन का समर्थन करता है और, थीम अनुकूलन योग्य और उत्तरदायी हैं।
Website: CofeeCup
HTML Editor कोड को एडिट करके वेबसाइट का लेआउट बना सकता है। अगर आपने कभी CMS पर ब्लॉग पोस्ट किया है जैसे WordPress, Blogger या जूमला इत्यादि। तो आपको पता होना चाहिए कि पोस्ट लिखते समय HTML और CSS का उपयोग नहीं किया जाता है।