डेवलपर टूल · HTML WYSIWYG एडिटर
भटके हुए और खाली पैराग्राफ: छोटी मार्कअप आदतें जो लेआउट को तोड़ती हैं
· यह क्यों मायने रखती है
HTML पाठ-सफाई संतोषप्रद
दिखाता है कि कैसे डबल स्पेस, एंटर-फॉर-स्पेसिंग और ट्रेलिंग ब्रेक इकाइयां और खाली ब्लॉक बन जाते हैं जो संकीर्ण स्क्रीन पर गलत व्यवहार करते हैं, और उन्हें मार्कअप में कैसे पहचाना जाए।
वह पंक्ति जो मोबाइल पर लपेटी नहीं जाएगी - नॉन-ब्रेकिंग रिक्त स्थान द्वारा एक साथ रखे गए शीर्षक के साथ खुलती है
गैर-ब्रेकिंग रिक्त स्थान के साथ जुड़ा हुआ एक शीर्षक एक संकीर्ण कार्ड के अंदर लपेटने से इनकार कर सकता है, इसके कंटेनर को चौड़ा कर सकता है या अजीब अतिप्रवाह पैदा कर सकता है। दृश्य एडिटर में पात्र सामान्य रिक्त स्थान की तरह दिखते हैं, इसलिए कारण की पहचान करने के लिए स्रोत निरीक्षण या कोड-बिंदु-जागरूक टूलींग की आवश्यकता हो सकती है।
ToolAcre अपने स्थानीय डिकोडर और एस्केपिंग पथ के माध्यम से संस्थाओं को सामान्य बनाता है, लेकिन इसमें नॉन-ब्रेकिंग स्पेस को खोजने या हटाने के लिए समर्पित कोई कमांड नहीं है। किसी टुकड़े को साफ करना रिस्पॉन्सिव-लेआउट मरम्मत नहीं है। लेखकों को अनुमति सूची से वैध रिक्ति वर्णों को बदलने की अपेक्षा करने के बजाय पाठ और गंतव्य व्यवहार का निरीक्षण करना चाहिए।
गैर-ब्रेकिंग रिक्त स्थान सामग्री में कैसे प्रवेश कर सकते हैं; यह एडिटर कोई विशेष प्रविष्टि नियम परिभाषित नहीं करता है
गैर-ब्रेकिंग रिक्त स्थान चिपकाए गए दस्तावेज़ों, जानबूझकर इकाइयों या अनुप्रयोगों से आ सकते हैं जो लगातार दृश्य रिक्ति को संरक्षित करते हैं। रिपॉजिटरी यह साबित नहीं करती है कि ToolAcre स्वयं दो टाइप किए गए स्थानों को एक नॉन-ब्रेकिंग स्पेस में बदल देता है, इसलिए यह आलेख उस व्यवहार को अपने संतुष्ट संपादन योग्य होस्ट को निर्दिष्ट नहीं करता है।
जब चिपकाया गया नामित संदर्भ इकाई डिकोडर को ज्ञात होता है, तो सैनिटाइज़र टेक्स्ट को फिर से उत्सर्जित करने से पहले इसका समाधान करता है। अंतर्निहित चरित्र बने रहने पर लेखकीय वर्तनी बदल सकती है। URL में अज्ञात नामित संदर्भों को अस्वीकार कर दिया गया है क्योंकि ब्राउज़र इस छोटी तालिका की तुलना में अधिक इकाइयों को समझ सकते हैं।
रिक्त पैराग्राफ को रिक्ति के रूप में - <p> </p> का वर्णन करता है और अनुगामी <br> का उपयोग सामग्री को नीचे धकेलने के लिए किया जाता है
खाली पैराग्राफ और अनुगामी बीआर तत्वों का उपयोग अक्सर मैनुअल स्पेसर के रूप में किया जाता है। वे सामग्री नोड बने रहते हैं जिनकी स्पष्ट ऊंचाई गंतव्य CSS पर निर्भर करती है। ToolAcre p और br को स्वीकार करता है, इसलिए एक खाली स्वीकृत ब्लॉक या अनावश्यक ब्रेक को स्वचालित रूप से असुरक्षित के रूप में अस्वीकार नहीं किया जाता है।
Enter को बार-बार दबाने से ब्राउज़र-निर्भर DOM बन सकता है जो बाद में सैनिटाइज़र के माध्यम से संकीर्ण हो जाता है। चूंकि पैनल विभाजक को कॉन्फ़िगर नहीं करता है या कुंजी व्यवहार का वादा नहीं करता है, इसलिए आउटपुट का निरीक्षण करें। उन रिक्त संरचनाओं को हटा दें जिनका कोई अर्थ नहीं है, फिर गंतव्य में स्टाइलशीट मार्जिन और लेआउट प्रिमिटिव का उपयोग करें।
ये रिस्पॉन्सिव लेआउट क्यों तोड़ते हैं - इसमें नो-रैप व्यवहार, डिवाइसों में असंगत अंतराल और स्टैक करने वाले मार्जिन शामिल हैं
एक नॉन-ब्रेकिंग स्पेस एक योग्य लाइन ब्रेक को उसके स्थान पर रोकता है। शब्दों के बीच कई श्रृंखलाएँ उपलब्ध चौड़ाई से परे एक वाक्यांश को एक साथ रख सकती हैं। खाली ब्लॉक शैलियों के अनुसार मार्जिन या लाइन बॉक्स जोड़ते हैं, इसलिए एक पूर्वावलोकन में सही लगने वाला अंतर दोगुना हो सकता है या अन्यत्र गायब हो सकता है।
ये प्रभाव संदर्भ-निर्भर हैं। सैंडबॉक्स अपने स्वयं के हल्के दस्तावेज़ CSS का उपयोग करता है और मोबाइल CMS कार्ड या ईमेल क्लाइंट को पुन: पेश नहीं कर सकता है। वास्तविक चौड़ाई, फ़ॉन्ट और स्टाइलशीट स्थितियों का परीक्षण करें। स्रोत निरीक्षण संदिग्धों की पहचान करता है; यह लक्ष्य परिवेश में रेंडरिंग परीक्षणों को प्रतिस्थापित नहीं करता है।
कार्यान्वित उदाहरण: उत्पन्न कलाकृतियों की एक निश्चित संख्या का दावा किए बिना एक नमूने का निरीक्षण करें
जानबूझकर गैर-ब्रेकिंग रिक्त स्थान के साथ एक नमूना शीर्षक बनाएं, उसके बाद एक खाली पी और दो बीआर तत्वों में समाप्त होने वाला पैराग्राफ। इसे गंतव्य या ब्राउज़र टूल में एक संकीर्ण चौड़ाई पर देखें, फिर प्रत्येक वर्ण और नोड का पता लगाने के लिए ToolAcre स्रोत का निरीक्षण करें।
केवल उन कलाकृतियों को हटा दें जिनका कोई अर्थ संबंधी उद्देश्य नहीं है। एक पता वैध रूप से br का उपयोग कर सकता है, और एक गैर-ब्रेकिंग स्पेस स्टाइल गाइड के तहत किसी संख्या को एक इकाई से सही ढंग से जोड़ सकता है। समीक्षा प्रश्न यह है कि क्या नो-रैप या खाली ब्लॉक अर्थ व्यक्त करता है या केवल एक अस्थायी लेआउट की भरपाई करता है।
स्रोत पर ठीक करें, CSS हैक्स के साथ नहीं - आदतों को उनके आसपास स्टाइल करने के बजाय हटाने की व्याख्या करता है
खाली ब्लॉकों के लिए तेजी से विशिष्ट CSS चयनकर्ताओं को जोड़ने के बजाय सामग्री को उसके स्रोत पर ठीक करें। आकस्मिक स्पेसर पैराग्राफ हटाएं, सजावटी दोहराए गए रिक्त स्थान को सामान्य पाठ से बदलें, और पेज घटक को लय को नियंत्रित करने दें। यह चौड़ाई और थीम में स्वच्छ व्यवहार उत्पन्न करता है।
ऐसा वैश्विक नियम लागू न करें जो एडिटरीय प्रणालियों की समीक्षा किए बिना हर खाली पैराग्राफ को छिपा देता है। कुछ कार्यप्रवाह उन पर निर्भर हो सकते हैं, भले ही उस निर्भरता को स्थानांतरित कर दिया जाए। एक स्थानीय सुधार और एक मापा माइग्रेशन योजना CSS पैच की तुलना में अधिक सुरक्षित है जो अज्ञात संग्रहीत सामग्री को मास्क करता है।
इसमें क्या शामिल नहीं है - CSS रिक्ति प्रणाली या किसी साइट पर बड़े पैमाने पर सफ़ाई
यह आलेख साइट स्पेसिंग सिस्टम, बल्क डेटाबेस क्लीनअप या यूनिवर्सल टाइपोग्राफी नियमों को परिभाषित नहीं करता है। यह वादा नहीं करता है कि स्थानीय डिकोडर परीक्षण किए गए मामलों से परे किन संस्थाओं को पहचानता है, और यह यह बताने से बचता है कि सभी विज़ुअल डबल स्पेस एक एप्लिकेशन से उत्पन्न हुए हैं।
यह साफ़ किए गए स्रोत की तुलना सुरक्षित शत्रुतापूर्ण HTML से भी नहीं करता है। ToolAcre के पूर्वावलोकन सैंडबॉक्स और संकीर्ण अनुमति सूची में स्पष्ट सीमाएँ हैं। सर्वर प्रकाशन के लिए अभी भी उचित स्वच्छता की आवश्यकता होती है, जबकि प्रतिक्रियाशील शुद्धता के लिए गंतव्य प्रतिपादन और पहुंच समीक्षा की आवश्यकता होती है।
टेकअवे: प्रति ड्राफ्ट एक बार मार्कअप पढ़ें - चेकलिस्ट का सारांश देता है और कैसे ToolAcre का HTML WYSIWYG एडिटर संस्थाओं और खाली ब्लॉकों को दृश्यमान बनाता है
प्रति ड्राफ्ट एक बार मार्कअप पढ़ें, विशेष रूप से रिच पेस्ट और बार-बार एंटर दबाने के बाद। नो-रैप वर्णों, खाली ब्लॉकों और अनुगामी विरामों को देखें, फिर तय करें कि क्या प्रत्येक का कोई अर्थ है। जब एक संग्रह और कई विषयों में गुणा किया जाता है तो छोटी कलाकृतियाँ महंगी हो जाती हैं।
ToolAcre स्वीकृत संरचना को दृश्यमान बनाता है और असमर्थित सामान को फिर से लिख सकता है, लेकिन वैध रिक्ति कलाकृतियाँ एक एडिटरीय जिम्मेदारी बनी रहती हैं। उन्हें जानबूझकर हटाएं, वैध ब्रेक सुरक्षित रखें और अंतिम चैनल का परीक्षण करें। स्वच्छ स्रोत और लचीला CSS एक साथ काम करते हैं; कोई भी स्वचालित रूप से दूसरे का अनुमान नहीं लगा सकता।