धारा बनाम आर्टिकल HTML5


201

मेरे पास विभिन्न "वर्गों" जैसे वीडियो, एक न्यूज़फ़ीड आदि से बना एक पेज है .. मैं थोड़ा भ्रमित हूं कि एचटीएमएल 5 के साथ इनका प्रतिनिधित्व कैसे करें। वर्तमान में मैं उन्हें एचटीएमएल 5 <section>एस के रूप में देखता हूं , लेकिन आगे के निरीक्षण में ऐसा लगता है कि वे अधिक सही टैग होंगे <article>। क्या कोई मेरे लिए इस पर कुछ प्रकाश डाल सकता है?

इनमें से कोई भी चीज़ शब्द के सही अर्थ में ब्लॉग पोस्ट या "दस्तावेज़" नहीं है, इसलिए यह देखना कठिन है कि कौन सा तत्व लागू करना है।

चियर्स

संपादित करें: मैंने articleटैग का उपयोग करने का विकल्प चुना है क्योंकि यह असंबंधित तत्वों के लिए एक कंटेनर टैग लगता है जो मुझे लगता है कि मेरे "अनुभाग" हैं। हालांकि, वास्तविक tagname लेख भ्रामक लगता है और यद्यपि वे कह रहे हैं कि HTML5 वेब अनुप्रयोगों के लिए अधिक विचार के साथ विकसित किया गया है , मुझे लगता है कि बहुत सारे टैग अधिक ब्लॉग-केंद्रित / दस्तावेज़ आधारित हैं।

वैसे भी आपके उत्तर के लिए धन्यवाद यह काफी व्यक्तिपरक प्रतीत होता है।


5
यह वास्तव में कोई फर्क नहीं पड़ता। जो कुछ भी आपके लिए समझ में आता है उसका उपयोग करें। व्यक्तिगत रूप से मैं section's
Ilia Choly

@ मिलिया चोली: मैं आपसे सहमत हूं, कोई वास्तविक सही या गलत नहीं है।
शिरगिल फरहान

जवाबों:


143

HTML3 को संरचित करने के बारे में W3 विकी पृष्ठ में , यह कहता है:

<section>: या तो विभिन्न लेखों को अलग-अलग उद्देश्यों या विषयों में समूहित करने के लिए, या किसी एक लेख के विभिन्न खंडों को परिभाषित करने के लिए उपयोग किया जाता है।

और फिर प्रदर्शित करता है एक छवि जिसे मैंने साफ किया:

यहां छवि विवरण दर्ज करें

यह <article>टैग का उपयोग करने का भी वर्णन करता है (ऊपर W3 लिंक से):

<article>से संबंधित है <section>, लेकिन स्पष्ट रूप से अलग है। जहाँ तक<section> सामग्री या कार्यक्षमता के अलग-अलग वर्गों को समूहीकृत करने के लिए है, संबंधित सामग्री के <article>अलग-अलग स्टैंडअलोन टुकड़ों को रखने के लिए है, जैसे कि व्यक्तिगत ब्लॉग पोस्ट, वीडियो, चित्र या समाचार आइटम। इसे इस तरह से सोचें - यदि आपके पास सामग्री के कई आइटम हैं, जिनमें से प्रत्येक अपने दम पर पढ़ने के लिए उपयुक्त होगा, और आरएसएस फ़ीड में अलग-अलग वस्तुओं के रूप में सिंडिकेट करने के लिए समझ में आएगा, तो <article>उन्हें चिह्नित करने के लिए उपयुक्त है।

हमारे उदाहरण में, <section id="main">ब्लॉग प्रविष्टियाँ हैं। प्रत्येक ब्लॉग प्रविष्टि एक आरएसएस फ़ीड में एक आइटम के रूप में सिंडिकेटिंग के लिए उपयुक्त होगी, और समझ में आएगी जब अपने दम पर पढ़ा जाता है, संदर्भ से बाहर है, इसलिए <article>उनके लिए एकदम सही है:

<section id="main">
    <article>
      <!-- first blog post -->
    </article>

    <article>
      <!-- second blog post  -->
    </article>

    <article>
      <!-- third blog post -->
    </article>
</section>

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

<article>
  <section id="introduction">
  </section>

  <section id="content">
  </section>

  <section id="summary">
  </section>
</article>

13
अतिरिक्त रूप से: <main> हेडर और फुटर (छवि से नीले ब्लॉक) के बीच तत्वों को लपेटने के लिए उपयोग किया जा सकता है। <आंकड़ा> लेख या अनुभाग के भीतर छवियों को लपेटता है।
तर्क-इकाई

2
अच्छा काम। यह स्वीकृत उत्तर होना चाहिए। मैं तर्क-इकाई से सहमत हूं जिसे आपको जोड़ना चाहिए main
चक ले बट

1
आपको लेखों में अनुभाग के साथ तस्वीर को अपडेट करना चाहिए।
के - एसओ में विषाक्तता बढ़ रही है।

मुझे लगता है कि भ्रम के कारण लेख और अनुभाग के बीच यह युद्ध अब एक हो जाएगा। लेकिन जस्टिन इम 100% बोर्ड पर आपके लेख पर अनुभाग का उपयोग करने के रूप में अनुभाग दस्तावेजों के हिस्सों पर लागू होता है (जैसा कि आपने दिखाया है) जहां लेख अकेले खड़ा है, स्वतंत्र सामग्री दस्तावेज़ (और इस प्रकार इसके अनुभाग) शामिल हैं। शब्दार्थ "खंड" शब्द अभी भी पुराने div वर्गों के प्रतिस्थापन के रूप में अधिक समझ में आता है। बहुत बढ़िया!
स्टोकली

1
आप <लेख> के अंदर <शीर्ष लेख> और <पाद> का उपयोग भी कर सकते हैं, यदि आपको <खंड> से कुछ अधिक विशिष्ट चाहिए
रिक

130

लगता है कि आपको <article>टैग में लेख में प्रविष्टियों और प्रविष्टियों में "अनुभाग" (जैसा कि आप उन्हें कहते हैं) में से प्रत्येक को लपेटना चाहिए <section>

एचटीएमएल 5 कल्पना (धारा) का कहना है:

अनुभाग तत्व किसी दस्तावेज़ या एप्लिकेशन के सामान्य अनुभाग का प्रतिनिधित्व करता है। इस संदर्भ में एक खंड, सामग्री का विषयगत समूहन है, आमतौर पर शीर्षक के साथ। [...]

अनुभागों के उदाहरण अध्याय, टैब किए गए संवाद बॉक्स में विभिन्न टैब किए गए पृष्ठ, या थीसिस के गिने हुए अनुभाग होंगे। एक वेब साइट के मुख पृष्ठ को एक परिचय, समाचार आइटम और संपर्क जानकारी के लिए खंडों में विभाजित किया जा सकता है।

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

और अनुच्छेद के लिए

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

मुझे लगता है कि आप ओपी में "अनुभाग" कहते हैं जो लेख की परिभाषा फिट करते हैं क्योंकि मैं उन्हें स्वतंत्र रूप से वितरण योग्य या पुन: प्रयोज्य होने के रूप में देख सकता हूं

अपडेट करें: HTML 5.1 के लिए नवीनतम संपादकों के मसौदेarticle में कुछ मामूली पाठ परिवर्तन (इटैलिक में परिवर्तन):

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

साथ ही, 2013 के जनवरी और फरवरी के बारे articleमें सार्वजनिक HTML मेलिंग सूची पर चर्चा ।


17
वेब पर खोज करते समय, मुझे एक कानूनी दस्तावेज़ आया जो पढ़ा गया था Article 1, Section 2, Clause 3। मुझे उम्मीद है कि इससे मुझे तर्क याद रखने में मदद मिलेगी।
आम

3
मैं एक हद तक असहमत हूं, लेकिन मेरा यह भी मानना ​​है कि संदर्भ के आधार पर उन्हें स्विच किया जा सकता है। कल्पना विवरण पढ़ने से मुझे पता चलता है कि यह article"विजेट" के रूप में कार्य करता है, तो इसके आसपास दूसरा रास्ता होना चाहिए । section: "विषयगत समूहन" और "एक दस्तावेज़ का अनुभाग"। article: "स्व-निहित" और "विजेट"। एक होमपेज उदाहरण पर विचार करें जैसे कि codepen.io/anon/pen/iDEwf
daleyjem

2
वे क्यों कहते हैं कि एक एकल मंच पोस्ट एक लेख बनाता है? एक मंच पोस्ट बाकी थ्रेड इम्हो के बिना पूरा नहीं होता है।
मास्टरएक्सिलो

7
यह पीछे की तरफ है। W3C स्पष्ट रूप से बताता है कि sectionसामग्री का एक विषयगत समूहन है, और articleएक स्टैंड-अलोन तत्व है (यानी जिसे एक विषय में समूहीकृत किया जा सकता है)। एक अखबार की तरह सोचें: आपको प्रत्येक अनुभाग में कई लेख मिलेंगे। उदाहरण के लिए, मनोरंजन अनुभाग में फिल्म समीक्षा लेख।
चक ले बट

3
यहां @Chuck से सहमत हैं। मेरी पुस्तक में इस उत्तर में यह पूरी तरह से पीछे की ओर है। जस्टिन का जवाब अधिक उपयुक्त है। लेकिन ओह ठीक है, अनुमान लगाओ कि व्याख्या के लिए बहुत जगह छोड़ देता है। यकीन नहीं हो रहा है अगर यह एक बुरी या अच्छी बात है।
मैरीसिडेड

39

मैं <article>एक टेक्स्ट ब्लॉक के लिए उपयोग करूंगा जो पेज पर अन्य ब्लॉक से पूरी तरह से असंबंधित है। <section>दूसरी तरफ, एक दस्तावेज़ को अलग करने के लिए एक विभक्त होगा जो एक दूसरे से संबंधित हैं।

अब, मुझे यकीन नहीं है कि आपके वीडियो, न्यूज़फ़ीड इत्यादि में क्या है, लेकिन यहाँ एक उदाहरण है (कोई वास्तविक सही या गलत नहीं है, बस एक दिशानिर्देश है कि मैं इन टैग का उपयोग कैसे करूँ):

<article>
    <h1>People</h1>
    <p>text about people</p>
    <section>
        <h1>fat people</h1>
        <p>text about fat people</p>
    </section>
    <section>
        <h1>skinny people</p>
        <p>text about skinny people</p>
    </section>
</article>
<article>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</article>

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

जैसे

<body>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</body>

आशा है कि यह समझ में आता है।


5
I'd use <article> for a text block that is totally unrelated to the other blocks on the page.मुझे पता है कि आपने इसे 2011 में लिखा था, लेकिन, क्या यह <aside>टैग के लिए नहीं है?
MyDaftQuestions

19

मैं इस्तेमाल किए गए शब्दों के मानक अर्थ के साथ रहना पसंद करता हूं: एक article, अच्छी तरह से, लेखों पर लागू होगा। मैं ब्लॉग पोस्ट, दस्तावेज़ और समाचार लेख को परिभाषित करूंगाarticles । दूसरी ओर अनुभाग, लेआउट / औक्स आइटम को संदर्भित करेगा: साइडबार, हेडर, पाद लेख अनुभाग होंगे। हालाँकि, यह मेरी अपनी व्यक्तिगत व्याख्या है - जैसा कि आपने बताया, इन तत्वों के लिए विनिर्देश अच्छी तरह से परिभाषित नहीं हैं।

इसका समर्थन करते हुए, w3c एक articleतत्व को सामग्री के एक खंड के रूप में परिभाषित करता है जो स्वतंत्र रूप से अपने दम पर खड़ा हो सकता है। एक ब्लॉग पोस्ट सामग्री के एक मूल्यवान और उपभोग्य वस्तु के रूप में खुद पर खड़ी हो सकती है। हालाँकि, हैडर नहीं होगा।

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

क्या अधिक समस्याग्रस्त है कि लेख और अनुभाग बहुत समान हैं। उन्हें अलग करने वाला शब्द "आत्म निहित" शब्द है। यह तय करना कि कौन से तत्व का उपयोग करना आसान होगा यदि कुछ कठिन और तेज़ नियम थे। इसके बजाय, यह व्याख्या का विषय है। आपके पास एक सेक्शन के भीतर कई आर्टिकल हो सकते हैं, आपके कई सेक्शन और आर्टिकल हो सकते हैं। आप सेक्शन के भीतर सेक्शंस और सेक्शंस के भीतर सेक्शंस को सेस्ट कर सकते हैं। यह आपको तय करना है कि किसी भी स्थिति में कौन सा तत्व सबसे अधिक उपयुक्त है।

यहाँ इतने पर यहाँ एक ही सवाल का एक बहुत अच्छा जवाब है



5

अनुभाग

  • अपने लेआउट के एक भाग को परिभाषित करने के लिए इसका उपयोग करें। यह हो सकता है mid, left,right , आदि ..
  • यह किसी अन्य तत्व के साथ कनेक्शन का एक अर्थ है, सीधे शब्दों में कहें तो यह DEPENDENT है।

लेख

  • इसका उपयोग करें जहां आपके पास स्वतंत्र सामग्री है जो अपने आप में समझ में आता है।

  • अनुच्छेद का अपना पूर्ण अर्थ है।


3

एक खंड मूल रूप से h1(या अन्य hटैग) के लिए एक आवरण है और वह सामग्री जो इससे मेल खाती है। एक articleअनिवार्य रूप से अपने दस्तावेज़ में एक दस्तावेज है कि बार-बार या पृष्ठवार होता है ... अपने दस्तावेज़ पर एक ब्लॉग पोस्ट की तरह एक लेख हो सकता है, या अपने दस्तावेज़ पर एक टिप्पणी में एक लेख हो सकता है।


1

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


0

मेरी व्याख्या है: मुझे लगता है कि YouTube के पास एक टिप्पणी-अनुभाग है, और टिप्पणी-अनुभाग के अंदर कई लेख हैं (इस मामले में टिप्पणियां)।

तो एक अनुभाग एक दिव्य-कंटेनर की तरह है जो लेख रखता है।


-2

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

अनुच्छेद और अनुभाग दोनों में एक शीर्षक तत्व h2-h6 शामिल होना चाहिए।

एक ब्लॉग पोस्ट के लिए, लेख और अनुभाग के लिए सिंटैक्स का उपयोग करें।

<article>
         <h1>Heading 1</h1>
         <p>Article Description</p>
         <section id="sec1">
                <h2>Section Heading</h2>
                <p>Section Description</p>
         </section>
         <section id="sec2">
                <h2>Section Heading</h2>
                <p>Section Description</p>
         </section>
</article>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.