एचटीएमएल 5 - माइक्रोडाटा

माइक्रोडाटा आपके वेब पेजों में अतिरिक्त शब्दार्थ प्रदान करने का एक मानकीकृत तरीका है।

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

समूह कहलाते हैं items, और प्रत्येक नाम-मूल्य जोड़ी एक है property। वस्तुओं और गुणों का प्रतिनिधित्व नियमित तत्वों द्वारा किया जाता है।

उदाहरण

  • एक आइटम बनाने के लिए, itemscope विशेषता का उपयोग किया जाता है।

  • किसी आइटम में कोई गुण जोड़ने के लिए, itemprop विशेषता का उपयोग आइटम के वंशजों में से एक पर किया जाता है।

यहां दो आइटम हैं, जिनमें से प्रत्येक की संपत्ति "नाम" है -

<html>
   <body>
      
      <div itemscope>
         <p>My name is <span itemprop = "name">Zara</span>.</p>
      </div>
      
      <div itemscope>
         <p>My name is <span itemprop = "name">Nuha</span>.</p>
      </div>
      
   </body>
</html>

यह निम्नलिखित परिणाम का उत्पादन करेगा -

गुणों में आम तौर पर मूल्य होते हैं जो तार होते हैं लेकिन इसके निम्न प्रकार हो सकते हैं -

वैश्विक गुण

माइक्रोडाटा पांच वैश्विक विशेषताओं का परिचय देता है जो आपके डेटा के बारे में मशीनों के उपयोग और संदर्भ के लिए किसी भी तत्व के लिए उपलब्ध होगा।

अनु क्रमांक। विशेषता और विवरण
1

itemscope

इसका उपयोग आइटम बनाने के लिए किया जाता है। आइटमस्कोप विशेषता एक बूलियन विशेषता है जो बताती है कि इस पृष्ठ पर माइक्रोडाटा है, और यह वह जगह है जहां यह शुरू होता है।

2

itemtype

यह विशेषता एक मान्य URL है जो आइटम को परिभाषित करता है और गुणों के लिए संदर्भ प्रदान करता है।

3

itemid

यह विशेषता आइटम के लिए वैश्विक पहचानकर्ता है।

4

itemprop

यह गुण आइटम की एक संपत्ति को परिभाषित करता है।

5

itemref

यह विशेषता आइटम के नाम-मूल्य जोड़े को खोजने के लिए क्रॉल करने के लिए अतिरिक्त तत्वों की एक सूची देती है।

गुण डेटाटिप्स

गुणों में आम तौर पर वे मूल्य होते हैं जो उपरोक्त उदाहरण में उल्लिखित हैं, लेकिन उनमें वे मान भी हो सकते हैं जो URL हैं। निम्नलिखित उदाहरण में एक संपत्ति है, "छवि", जिसका मूल्य एक URL है -

<div itemscope>
   <img itemprop = "image" src = "tp-logo.gif" alt = "TutorialsPoint">
</div>

गुणों में वे मान भी हो सकते हैं जो दिनांक, समय या दिनांक और समय हैं। इस का उपयोग करके हासिल किया हैtime तत्व और उसके datetime विशेषता।

<html>
   <body>
      
      <div itemscope>
         My birthday is:
         <time itemprop = "birthday" datetime = "1971-05-08">
            Aug 5th 1971
         </time>
      </div>
      
   </body>
</html>

यह निम्नलिखित परिणाम का उत्पादन करेगा -

प्रॉपर्टी घोषित करने वाले तत्व पर आइटमस्कोप विशेषता डालकर गुण स्वयं भी नाम-मूल्य जोड़े के समूह हो सकते हैं।

माइक्रोडाटा एपीआई समर्थन

यदि कोई ब्राउज़र HTML5 माइक्रोडाटा एपीआई का समर्थन करता है, तो वैश्विक दस्तावेज़ ऑब्जेक्ट पर एक getItems () फ़ंक्शन होगा। यदि ब्राउज़र माइक्रोडाटा का समर्थन नहीं करता है, तो GetItems () फ़ंक्शन अपरिभाषित हो जाएगा।

function supports_microdata_api() {
   return !!document.getItems;
}

माडर्निज़र अभी तक माइक्रोडाटा एपीआई के लिए जाँच का समर्थन नहीं करता है, इसलिए आपको ऊपर सूचीबद्ध की तरह फ़ंक्शन का उपयोग करना होगा।

HTML5 माइक्रोडेटा मानक में HTML मार्कअप (मुख्य रूप से खोज इंजन के लिए) और DOM फ़ंक्शंस का एक सेट (मुख्य रूप से ब्राउज़र के लिए) शामिल हैं।

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

माइक्रोडाटा शब्दावली को परिभाषित करना

माइक्रोडाटा शब्दावली को परिभाषित करने के लिए आपको एक नामस्थान URL की आवश्यकता होती है जो एक कार्यशील वेब पेज की ओर इशारा करता है। उदाहरण के लिए https://data-vocabulary.org/Person निम्नलिखित गुणों के साथ एक व्यक्तिगत माइक्रोडाटा शब्दावली के लिए नामस्थान के रूप में इस्तेमाल किया जा सकता है -

  • name - एक साधारण स्ट्रिंग के रूप में व्यक्ति का नाम

  • Photo - व्यक्ति की तस्वीर के लिए एक URL।

  • URL - व्यक्ति से संबंधित वेबसाइट।

एक व्यक्ति के बारे में गुणों का उपयोग करके माइक्रोडाटा निम्नानुसार हो सकता है -

<html>
   <body>
   
      <div itemscope>
         <section itemscope itemtype = "http://data-vocabulary.org/Person">
            <h1 itemprop = "name">Gopal K Varma</h1>
         
            <p>
               <img itemprop = "photo" 
                  src = "http://www.tutorialspoint.com/green/images/logo.png">
            </p>
            
            <a itemprop = "url" href = "#">Site</a>
         </section>
      </div>
      
   </body>
</html>

यह निम्नलिखित परिणाम का उत्पादन करेगा -

Google अपने अमीर स्निपेट्स कार्यक्रम के हिस्से के रूप में माइक्रोडाटा का समर्थन करता है। जब Google का वेब क्रॉलर आपके पेज को पार्स करता है और माइक्रोडेटा गुण पाता है जो http://datavocabulary.org/Person शब्दावली के अनुरूप है, यह उन गुणों को पार्स करता है और बाकी पेज डेटा के साथ उन्हें संग्रहीत करता है।

आप http://www.tutorialspoint.com/html5/microdata.htm का उपयोग करके रिच स्निपेट्स टेस्टिंग टूल का उपयोग करके उपरोक्त उदाहरण का परीक्षण कर सकते हैं

माइक्रोडाटा पर आगे के विकास के लिए आप हमेशा HTML5 माइक्रोडाटा का उल्लेख कर सकते हैं ।