क्या HEAD, BODY और HTML टैग लिखना आवश्यक है?

194

क्या यह लिखना आवश्यक है <html>, <head>और <body>टैग?

उदाहरण के लिए, मैं ऐसा पेज बना सकता हूं:

<!DOCTYPE html>     
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Page Title</title>
    <link rel="stylesheet" type="text/css" href="css/reset.css">
    <script src="js/head_script.js"></script><!-- this script will be in head //-->


<div>Some html</div> <!-- here body starts //-->

    <script src="js/body_script.js"></script>

और फायरबग सही ढंग से सिर और शरीर को अलग करता है: यहां छवि विवरण दर्ज करें

W3C मान्यता कहती है कि यह मान्य है।

लेकिन मैं शायद ही कभी इस अभ्यास को वेब पर देखता हूं।

क्या इन टैग को लिखने का कोई कारण है?

html tags

— लैरी सिनेबार
स्रोत

5

HTML5 सत्यापनकर्ता HTML5.validator.nu पर titleटैग की आवश्यकता है । यह सबसे छोटा दस्तावेज है जो इसे वैध मानता है:<!DOCTYPE html> <title>A</title>

— bonh

142

छोड़ना html, headऔर body टैग निश्चित रूप से एचटीएमएल चश्मा द्वारा अनुमति दी है। अंतर्निहित कारण यह है कि ब्राउज़र हमेशा मौजूदा वेब पृष्ठों के अनुरूप होना चाहते हैं, और HTML के शुरुआती संस्करणों ने उन तत्वों को परिभाषित नहीं किया है। जब HTML~~2.0~~ पहले किया, यह इस तरह से किया गया था कि टैग गायब होने पर अनुमान लगाया जाएगा।

मुझे अक्सर प्रोटोटाइप को टैग करने में आसानी होती है जब प्रोटोटाइपिंग और विशेष रूप से जब टेस्ट केस लिखते हैं तो यह प्रश्न में परीक्षण पर ध्यान केंद्रित करने में मदद करता है। फायरबग में जिस तरह से आप देखते हैं, उसी तरह से इनवेंशन प्रक्रिया को तत्वों का निर्माण करना चाहिए , और ब्राउज़र ऐसा करने में काफी सुसंगत हैं।

परंतु...

IE में इस क्षेत्र में कम से कम एक ज्ञात बग है। यहां तक कि IE9 यह प्रदर्शित करता है। मान लीजिए मार्कअप यह है:

<!DOCTYPE html>
<title>Test case</title>
<form action='#'>
   <input name="var1">
</form>

आपको (और अन्य ब्राउज़रों में) ऐसा डोम प्राप्त करना चाहिए जो ऐसा दिखता है:

HTML
    HEAD
        TITLE
    BODY
        FORM action="#"
            INPUT name="var1"

लेकिन IE में आपको यह मिलता है:

HTML
    HEAD
       TITLE
       FORM action="#"
           BODY
               INPUT name="var1"
    BODY

इसे अपने लिए देखें।

यह बग formकिसी भी पाठ सामग्री और किसी भी प्रारंभ टैग से पहले प्रारंभ टैग तक सीमित लगता है body।

— Alohci
स्रोत

5

HTML 1.0 ने HTML, HEAD और BODY को परिभाषित किया: w3.org/MarkUp/draft-ietf-iiir-html-01.txt

— Liza Daly

6

@ लिज़ा - खैर यह तर्कपूर्ण है कि क्या यह दस्तावेज़ HTML 1.0 को परिभाषित करता है, लेकिन मैं सही तरीके से खड़ा हूं, कि तत्व HTML 2.0 से पहले के हैं। धन्यवाद। हालाँकि, 1992 से w3.org/History/19921103-hypertext/hypertext/WWW/MarkUp/… देखें । तत्व तब मौजूद नहीं होते हैं।

— एलोहसी

1

यह बग इंटरनेट एक्सप्लोरर 11 को प्रभावित नहीं करता है (मैंने IE8 का भी परीक्षण किया था जिसकी मैं पुष्टि करता हूं प्रभावित है)

— jornane

2

@ जस्टिन - वे प्रतिबंध बड़े पैमाने पर तकनीकी हैं और आमतौर पर आपको प्रभावित नहीं करेंगे। तो हाँ, अगर यह आपके पेज के लिए मायने रखता है कि क्या टिप्पणी नोड या सफेद स्थान सिर के तत्व से ठीक पहले या उसके अंदर दिखाई देता है, (पृष्ठ का जेएस इस पर निर्भर हो सकता है) तो आपको स्पष्ट रूप से उस रिश्ते को सही बनाने के लिए हेड स्टार्ट टैग की पहचान करनी चाहिए । लेकिन अगर यह नहीं है, (और मैंने अभी तक एक HTML पृष्ठ नहीं लिखा है, जहां यह होता है) तो हेड टैग समझदार होगा और आप इसे सुरक्षित रूप से छोड़ सकते हैं। इसी तरह अन्य html, हेड और बॉडी टैग के लिए।

— Alohci

3

@Justin इस जवाब से लगता है कि यह सवाल "हीड, बॉड और एचटीएमएल टैग लिखने के लिए आवश्यक है?" यह अच्छा अभ्यास है या नहीं। कन्वेंशन बदल जाते हैं ... बस Google स्टाइलगाइड पर एक नज़र डालिए ... यह एक कन्वेंशन है जिसमें कहा गया है कि आपको इन टैग्स को छोड़ देना चाहिए ... :-)

— Potherca

77

HTML के लिए Google स्टाइल गाइड सभी वैकल्पिक टैग को छोड़ने की सलाह देता है।
शामिल है कि <html>, <head>, <body>, <p>और <li>।

https://google.github.io/styleguide/htmlcssguide.html#Optional_Tags

फ़ाइल आकार अनुकूलन और स्कैन करने के उद्देश्यों के लिए, वैकल्पिक टैग को छोड़ने पर विचार करें। HTML5 विनिर्देश परिभाषित करता है कि कौन से टैग छोड़े जा सकते हैं।

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

<!DOCTYPE html>
<html>
  <head>
    <title>Spending money, spending bytes</title>
  </head>
  <body>
    <p>Sic.</p>
  </body>
</html>


<!DOCTYPE html>
<title>Saving money, saving bytes</title>
<p>Qed.

— रीमा
स्रोत

2

असंगतता का उदाहरण: वेब विकास (प्यूरी) के लिए मैं जिस लाइव-रीलोड टूल का उपयोग करता हूं वह स्वचालित रूप से एक स्क्रिप्ट को सिर में सम्मिलित करता है। पिछले <head> टैग के बिना, यह काम नहीं करता है।

— २०:२० बजे ऑफिरमो

@ ओफ़र्मो पृथ्वी पर क्या है?

— केन शार्प

@KenSharp लिवरेलैड वेब देव उपकरण आमतौर पर काम किए गए पृष्ठों में कुछ कोड डालकर काम करते हैं, जैसे <script src="http://localhost:35729/livereload.js"></script>:। विदेशी टेम्प्लेट के लिए, उन्हें समझ नहीं आता कि उन्हें अपना कोड कहां डालना चाहिए।

— ऑफिशो

1

@Offirmo लिवरेलड का दस्तावेजीकरण बताता है कि आपको उस स्क्रिप्ट को अपने क्लाइंट पृष्ठों पर स्वयं जोड़ना चाहिए। शायद आप एक जादू पुस्तकालय का उपयोग कर रहे हैं जो आपके लिए करता है। आपको होने वाली कठिनाई का स्रोत होना चाहिए।

— kequc

7

सभी संभावित टैग्स को स्वीकार करना पैसा-वार और पाउंड-मूर्खता है। बैंडविड्थ की बचत एक छोटा% है (विशेष रूप से अधिकांश कनेक्शन ऑटो-कम्प्रेस के बाद से), जबकि किनारे के मामलों में मानव त्रुटि की संभावना अधिक है (लेखकों, संपादकों और यहां तक कि HTML पार्सर लेखकों पर भी विचार करें)। त्रुटियों को ढूंढना भी कठिन है (क्योंकि एंट्रोपी में परिवर्तन)।

— TextGeek

48

HTML5 के बारे में @ लिज़ा डेली के नोट के विपरीत, यह कल्पना वास्तव में काफी विशिष्ट है कि कौन से टैग छोड़े जा सकते हैं, और (और नियम HTML 4.01 से थोड़े अलग हैं, ज्यादातर स्पष्ट करने के लिए कि टिप्पणी और व्हाट्सएप जैसे अस्पष्ट तत्व कहां हैं)

प्रासंगिक संदर्भ http://www.w3.org/TR/2011/WD-html5-20110525/syntax.html#optional-tags है , और यह कहता है:

Html एलिमेंट का स्टार्ट टैग तब छोड़ा जा सकता है जब html एलिमेंट के अंदर पहली चीज कोई कमेंट न हो।
Html तत्व का अंतिम टैग तब छोड़ा जा सकता है यदि html तत्व को तुरंत टिप्पणी नहीं दी जाती है।
यदि तत्व खाली है, या यदि मुख्य तत्व के अंदर पहली चीज है, तो एक प्रमुख तत्व का प्रारंभ टैग छोड़ा जा सकता है।
यदि मुख्य तत्व का तुरंत स्थान वर्ण या टिप्पणी से अनुसरण नहीं किया जाता है, तो एक प्रमुख तत्व का अंतिम टैग छोड़ा जा सकता है।
यदि तत्व खाली है, या यदि शरीर तत्व के अंदर पहली चीज कोई अंतरिक्ष वर्ण या टिप्पणी नहीं है, तो सिवाय इसके कि शरीर तत्व के अंदर पहली चीज एक स्क्रिप्ट या शैली तत्व है, तो एक बॉडी एलिमेंट का स्टार्ट टैग छोड़ा जा सकता है।
यदि किसी बॉडी एलिमेंट का तुरंत अनुसरण नहीं किया जाता है तो बॉडी एलिमेंट का एंड टैग छोड़ा जा सकता है।

तो आपका उदाहरण HTML5 मान्य है, और इस तरह से पार्स किया जाएगा, जिसमें HTML, सिर और शरीर के टैग उनकी निहित स्थितियों में हैं:

<!DOCTYPE html><HTML><HEAD>     
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Page Title</title>
    <link rel="stylesheet" type="text/css" href="css/reset.css">
    <script src="js/head_script.js"></script></HEAD><BODY><!-- this script will be in head //-->


<div>Some html</div> <!-- here body starts //-->

    <script src="js/body_script.js"></script></BODY></HTML>

ध्यान दें कि टिप्पणी "यह स्क्रिप्ट सिर में होगी" वास्तव में शरीर के हिस्से के रूप में पार्स की गई है, हालांकि स्क्रिप्ट स्वयं सिर का हिस्सा है। युक्ति के अनुसार, यदि आप चाहते हैं कि सभी अलग-अलग हों, तो टैग </HEAD>और <BODY>टैग को छोड़ा नहीं जा सकता है। (हालांकि संबंधित <HEAD>और </BODY>टैग अभी भी हो सकते हैं)

— इयान क्लीलैंड
स्रोत

15

उन्हें HTML4 में छोड़ना मान्य है:

7.3 The HTML element
start tag: optional, End tag: optional

7.4.1 The HEAD element
start tag: optional, End tag: optional

http://www.w3.org/TR/html401/struct/global.html

HTML5 में, कोई "आवश्यक" या "वैकल्पिक" तत्व ठीक नहीं हैं, क्योंकि HTML5 सिंटैक्स को अधिक परिभाषित किया गया है। उदाहरण के लिए title:

शीर्षक तत्व अधिकांश स्थितियों में एक आवश्यक बच्चा है, लेकिन जब एक उच्च-स्तरीय प्रोटोकॉल शीर्षक जानकारी प्रदान करता है, जैसे ई-मेल की विषय पंक्ति में जब HTML का उपयोग ई-मेल संलेखन प्रारूप के रूप में किया जाता है, तो शीर्षक तत्व को छोड़ा जा सकता है ।

http://www.w3.org/TR/html5/semantics.html#the-title-element-0

यह सही XHTML5 में उन्हें छोड़ना मान्य नहीं है, हालांकि इसका उपयोग कभी नहीं किया जाता है (बनाम XHTML- अभिनय-जैसे- HTML5)।

हालाँकि, व्यावहारिक दृष्टिकोण से आप अक्सर चाहते हैं कि HTML और CSS रेंडर करने में पूर्वानुमान के लिए ब्राउज़र "मानक मोड" में चलें। DOCTYPE और अधिक संरचित HTML ट्री प्रदान करना अधिक पूर्वानुमानित क्रॉस-ब्राउज़र परिणामों की गारंटी देगा।

— लिजा डेली
स्रोत

13

टैग के साथ तत्वों को अव्यवस्थित न करें। इस पृष्ठ पर कहीं और cHao की टिप्पणियाँ देखें। के लिए html, headऔर body, तत्व अनिवार्य हैं, लेकिन टैग वैकल्पिक हैं।

— एलोहसी

वास्तव में आप अंतिम बिट में गलत हैं। टैग चूक एक SGML DTD सुविधा है, सभी ब्राउज़र जो SGML पार्सिंग का समर्थन करते हैं (वह सभी ब्राउज़र हैं) टैग चूक का भी समर्थन करते हैं। XHTML5 में आप ऐसा क्यों नहीं कर सकते इसका कारण यह है कि यह XML है, SGML नहीं। XML बहुत कम गूंगा तत्व है।

— OdraEncoded

@OdEEncoded आप अपने बयान के लिए सत्यापन प्रदान कर सकते हैं, कृपया? मुझे ऐसा नहीं लगता कि मामला हो ( HTML Standard देखें )।

— टूथब्रश

@OdraEncoded - पास, लेकिन बिल्कुल सच नहीं है। टैग चूक, एसजीएमएल पार्सर्स के लिए एक वैकल्पिक सुविधा है (हालांकि यह सबसे अधिक समर्थन करता है), जैसा कि आईएसओ 8879 में परिभाषित किया गया है। लगभग सभी HTML पार्सर्स इसका समर्थन करते हैं, हालांकि पायथन का 'html.parse' नहीं दिखता है (देखें stackoverflow- questions/29954170/… )।

— टेक्स्टकेक

14

यह सच है कि HTML चश्मा कुछ टैग को कुछ मामलों में छोड़ने की अनुमति देता है, लेकिन आम तौर पर ऐसा करना नासमझी है।

इसके दो प्रभाव हैं - यह कल्पना को और अधिक जटिल बनाता है, जो बदले में ब्राउज़र लेखकों के लिए सही कार्यान्वयन लिखना कठिन बनाता है (जैसा कि IE द्वारा गलत तरीके से दिखाया गया है)।

यह कल्पना के इन भागों में ब्राउज़र त्रुटियों की संभावना को उच्च बनाता है। एक वेबसाइट लेखक के रूप में आप इन टैगों को शामिल करके इस समस्या से बच सकते हैं - इसलिए जब तक कि कल्पना न करें कि आपको ऐसा करना है, ऐसा करने से चीजों के गलत होने की संभावना कम हो जाती है, जो कि अच्छा इंजीनियरिंग अभ्यास है।

अभी और क्या है, नवीनतम HTML 5.1 WG कल्पना वर्तमान में कहती है (ध्यान रखें कि यह प्रगति में एक काम है और अभी भी बदल सकता है)।

यदि तत्व खाली है, या यदि शरीर तत्व के अंदर पहली चीज कोई अंतरिक्ष वर्ण या टिप्पणी नहीं है, तो सिवाय इसके कि शरीर तत्व के अंदर पहली चीज एक मेटा, लिंक, स्क्रिप्ट, शैली है तो एक बॉडी एलिमेंट का स्टार्ट टैग छोड़ा जा सकता है। , या टेम्पलेट तत्व।

http://www.w3.org/html/wg/drafts/html/master/sections.html#the-body-element

यह थोड़ा सूक्ष्म है। आप शरीर और सिर को छोड़ सकते हैं, और ब्राउज़र तब पता लगाएगा कि उन तत्वों को कहां डाला जाना चाहिए। यह स्पष्ट नहीं होने का जोखिम वहन करता है, जिससे भ्रम हो सकता है।

तो यह

<html>
  <h1>hello</h1>
  <script ... >
  ...

लिपि तत्व के परिणामस्वरूप शरीर तत्व का एक बच्चा होता है, लेकिन यह

<html>
  <script ... >
  <h1>hello</h1>

स्क्रिप्ट टैग के परिणामस्वरूप मुख्य तत्व का एक बच्चा होगा।

ऐसा करके आप स्पष्ट हो सकते हैं

<html>
    <body>
      <script ... >
      <h1>hello</h1>

और फिर आपके पास जो भी पहले, स्क्रिप्ट या एच 1 है, वे दोनों, शरीर के तत्व में अनुमानित रूप से दिखाई देंगे। ये ऐसी चीजें हैं जो रिफैक्टिंग और डिबगिंग कोड को अनदेखा करना आसान है। (उदाहरण के लिए, आपके पास जेएस है जो शरीर में 1 स्क्रिप्ट तत्व की तलाश कर रहा है - दूसरे स्निपेट में यह काम करना बंद कर देगा)।

एक सामान्य नियम के रूप में, चीजों के बारे में स्पष्ट होना हमेशा चीजों को व्याख्या के लिए खुला छोड़ने से बेहतर होता है। इस संबंध में एक्सएचटीएमएल बेहतर है क्योंकि यह आपको अपने कोड में आपके तत्व संरचना के बारे में पूरी तरह से स्पष्ट होने के लिए मजबूर करता है, जिससे यह सरल हो जाता है, और इसलिए गलत व्याख्या की संभावना कम होती है।

तो हां, आप उन्हें छोड़ सकते हैं और तकनीकी रूप से मान्य हो सकते हैं, लेकिन आमतौर पर ऐसा करना नासमझी है।

— पीटर बैगनॉल
स्रोत

1

IE चीजों को गलत करता है क्योंकि लेखक मानकों के बारे में कम परवाह नहीं कर सकते हैं। अगर यह ठीक से काम नहीं करता है तो यह उनकी गलती है। मानकों को परिभाषित किया गया है ताकि उन्हें यह सुनिश्चित करना चाहिए कि IE उनके साथ काम करता है।

— केन तीव्र

3

@KenSharp मैं असहमत नहीं हूं, लेकिन जब तक आप सभी ग्राहकों को इसका इस्तेमाल न करने के लिए मजबूर कर सकते हैं, तब तक हम इसके साथ चिपके हुए हैं। कोड लिखने के लिए इतना बेहतर है जो काम करने की हर चीज पर भरोसा करने के बजाय पूरी तरह से अस्पष्ट है।

— पीटर बैगनॉल

1

उपयोगकर्ताओं को आज्ञाकारी नहीं होने के लिए IE को वर्षों से डंप करने के लिए मजबूर किया गया है। किसी को भी उम्मीद नहीं है कि लोग IE6 का उपयोग करना जारी रखेंगे, भले ही लोग अभी भी Windows XP स्थापित कर रहे हों। हम विंडोज 3.1 को हमेशा के लिए सपोर्ट करने की उम्मीद नहीं कर सकते। OSI स्तर 8 त्रुटि।

— केन शार्प

1

वास्तव में कौन सा टैग छोड़ा जा सकता है और वास्तव में कहां, HTML संस्करण द्वारा भी भिन्न होता है। यह भी उनसे बचने का एक अच्छा कारण लगता है (सबसे स्पष्ट और सामान्य और सुसंगत मामलों को छोड़कर)।

— TextGeek

@TextGeek <!DOCTYPE html>।

— Det

-3

फायरबग इसे सही ढंग से दिखाता है क्योंकि आपका ब्राउज़र आपके लिए खराब मार्कअप को स्वचालित रूप से ठीक करता है। यह व्यवहार कहीं भी निर्दिष्ट नहीं है और यह (विल) ब्राउज़र से ब्राउज़र में भिन्न हो सकता है। उन टैगों की आवश्यकता DOCTYPE द्वारा है जिनका आप उपयोग कर रहे हैं और उन्हें छोड़ा नहीं जाना चाहिए।

HTML तत्व हर html पृष्ठ का मूल तत्व है। यदि आप अन्य सभी तत्वों के विवरण को देखते हैं तो यह कहता है कि एक तत्व का उपयोग कहां किया जा सकता है (और लगभग सभी तत्वों को सिर या शरीर की आवश्यकता होती है)।

— Halfdan
स्रोत

तो, यह गैर-क्रॉस-ब्राउज़र हो सकता है?

— लैरी सिनेबार

5

दूसरे शब्दों में - अनिर्धारित परिणामों का पालन करने वाला बुरा अभ्यास।

— रैंडी

3

@Innuendo सिर्फ इसलिए कि कुछ बड़ा का मतलब यह नहीं है कि यह अच्छी तरह से एक साथ रखा गया है।

— डेमियन ब्रेख्त

2

प्राधिकरण के लिए एक अपील के रूप में, मुझे लगता है कि असंबद्धता। google.com HTML भी अमान्य है। इसका मतलब यह नहीं है कि तुम्हारा होना चाहिए।

— रीन हेनरिक्स

17

तत्वों का अस्तित्व होना चाहिए। कुछ नहीं कहते हैं कि टैग करते हैं। बिना html / सिर / शरीर टैग एचटीएमएल वास्तव में, है, वैध लंबे कोई तत्व दिखाई देता है, जहां यह नहीं करना चाहिए के रूप में के रूप में। ( उदाहरण के लिए <title>एक के बाद <p></p>।)

— cHao