मुख्य सामग्री पर जाएँ
Tooletto

HTML ब्यूटीफ़ायर

HTML फ़ॉर्मेटर का एक प्रीसेट

मिनिफ़ाई या ग़लत इंडेंट किए HTML को वापस पढ़ने लायक़ किसी चीज़ में बदलें। एक कंप्रेस्ड लाइन पेस्ट करें और एक जैसी इंडेंटेशन के साथ सही तरीक़े से नेस्ट किया मार्कअप पाएँ — पेज में एम्बेडेड किसी भी CSS और JavaScript सहित।

  • फ़ाइलें कभी आपकी डिवाइस से बाहर नहीं जातीं
  • मुफ़्त, बिना साइन-अप
  • कोई वॉटरमार्क नहीं
  • लोड होने के बाद ऑफ़लाइन भी काम करता है
Loading tool…

HTML फ़ॉर्मेटर कैसे करें

  1. 1

    अपना HTML पेस्ट करें

    मिनिफ़ाई किया, ग़लत इंडेंट किया, या हाथ से लिखा — सब काम करता है।

  2. 2

    इंडेंटेशन चुनें

    2 स्पेस, 4 स्पेस या टैब।

  3. 3

    नतीजा कॉपी करें

    या इसे .html फ़ाइल के रूप में डाउनलोड करें।

किसी और का भेजा मिनिफ़ाई किया मार्कअप पढ़ना

मिनिफ़ाई किया HTML — किसी बिल्ड टूल द्वारा एक या कुछ लंबी लाइनों में समेटा गया — पूरी तरह ट्रांसफ़र साइज़ के लिए ऑप्टिमाइज़ किया गया है, किसी इंसान के पढ़ने के लिए नहीं, जो उस पल एक असली बाधा बन जाता है जब आपको किसी प्रतिस्पर्धी के पेज की संरचना जाँचनी हो, सोर्स कोड देखकर किसी प्रोडक्शन समस्या को डीबग करना हो, या किसी थर्ड-पार्टी एम्बेडेड विजेट को असल में कैसे बनाया गया है यह समझना हो। इसे ब्यूटीफ़ाई करना वह नेस्टिंग वापस लाता है जो किसी इंसानी पाठक को फ़ॉलो करनी होती है: हर एलिमेंट अपनी लाइन पर, यह दिखाने के लिए इंडेंट किया गया कि वह अपने पैरेंट के अंदर कितना गहरा है, जो वह प्रस्तुति है जिस पर कोई इंसान असल में तर्क करता है, न कि वह अकेली घनी लाइन जिसे किसी बिल्ड टूल ने मशीनों द्वारा ट्रांसफ़र किए जाने के लिए ऑप्टिमाइज़ किया।

ऐसे पेज की संरचना वापस पाना जो आपने नहीं लिखा

किसी और द्वारा बनाए पेज की जाँच करना — किसी प्रतिस्पर्धी का लैंडिंग पेज, किसी एम्बेडेड विजेट का मार्कअप, कोई पुराना प्रोजेक्ट जिसका सोर्स कोड उपलब्ध नहीं — ख़ास तौर पर किसी ब्यूटीफ़ायर का सहारा लेने की सबसे आम वजहों में से एक है: ब्राउज़र डेवलपर टूल लाइव रेंडर हुआ DOM दिखाते हैं, जो एक मक़सद के लिए उपयोगी है, जबकि कच्चे HTML सोर्स को ब्यूटीफ़ाई करना वह असली दस्तावेज़ संरचना दिखाता है जो सर्वर ने भेजी थी, इंडेंटेशन वापस लाकर, जो एक अलग और अक्सर ज़्यादा उपयोगी नज़रिया है जब यह समझने की कोशिश की जाए कि कोई पेज असल में कैसे बनाया गया, बजाय यह देखने के कि यह आख़िरकार कैसे रेंडर हुआ।

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

क्या यह पेज के अंदर CSS और JavaScript को फ़ॉर्मेट करता है?

हाँ। `<style>` और `<script>` के अंदर का कंटेंट CSS और JavaScript पार्सर को दिया जाता है, तो एक ही फ़ाइल वाला पूरा पेज इन ब्लॉक को बिना छुए छोड़ने की बजाय सही तरीक़े से फ़ॉर्मेट होता है।

क्या फ़ॉर्मेटिंग से मेरा पेज कैसे रेंडर होता है यह बदल जाएगा?

लगभग कभी नहीं, लेकिन पूरी तरह कभी नहीं भी नहीं: HTML `<pre>`, `<textarea>` और `white-space: pre` वाले एलिमेंट के अंदर व्हाइटस्पेस को महत्वपूर्ण मानता है। इन्हें बिल्कुल जैसा है वैसा छोड़ दिया जाता है। इनलाइन एलिमेंट किनारे के मामलों में एक स्पेस खिसक सकते हैं, इसलिए फ़ॉर्मेटर उनके साथ सतर्क रहता है।

यह मेरा HTML क्यों रिजेक्ट करता है?

आमतौर पर वाक़ई असंतुलित टैग, या Handlebars, Jinja या Blade जैसी टेम्पलेट सिंटैक्स जो वैध HTML नहीं है। ब्राउज़र चुपचाप टूटे मार्कअप को ठीक कर देते हैं; किसी फ़ॉर्मेटर को संरचना समझनी पड़ती है, तो यह ऐसा नहीं कर सकता।

क्या मेरा मार्कअप कहीं अपलोड होता है?

नहीं। पार्सर आपके ब्राउज़र में चलता है, तो बिना पब्लिश किए पेज और क्लाइंट का काम आपकी मशीन पर ही रहता है।