उपयोगकर्ता प्रोफ़ाइल में माइक्रोफ़ॉर्मेट्स

एक परीक्षण पृष्ठ बनाया। बिल्ली के नीचे मेरे कार्यों का वर्णन है।

चेतावनी! मैं विवरण को अभी जोड़ रहा हूं और पूरा कर रहा हूं जब आप इसे पढ़ते हैं, तो नए पैराग्राफ की उपस्थिति पर आश्चर्यचकित न हों।

एक नई लाइन एक नई लाइन शुरू करने के लिए दया नहीं है

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

हमारे नए प्रोफाइल

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

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

हेडर, मेनू आदि के माध्यम से स्क्रॉल करना। वर्ग = "userinfo" के साथ ब्लॉक की सामग्री का अध्ययन करना शुरू किया - यह वह है जो उपयोगकर्ता के बारे में जानकारी रखता है। मैं उसे एक अतिरिक्त वर्ग vcard प्रदान करूंगा। यह इंगित करेगा कि ब्लॉक में hCard microformat है।

<div class="userinfo vcard ">







उपयोगकर्ता के बारे में जानकारी के अंश अब इस प्रकार की विशिष्ट संरचनाओं में निहित हैं:



<div class="userinfo_line">

<div class="left"></div>

<div class="right"><span class="username"> </span></div>

</div>









मुझे पता है कि इसे अधिक कॉम्पैक्ट और अधिक शब्दार्थ के साथ कैसे करना है। मैं परिभाषाओं की सूचियों का उपयोग करता हूं, तुरंत उन्हें उपयुक्त रूप से उपयुक्त माइक्रोफ़ॉर्मेटिंग कक्षाओं के साथ संतृप्त करना शुरू कर देता हूं। मैं एक टैग बीटिंग टैब करूँगा। तो यह अधिक दृश्य है, और तेज, और कम वजन है।



उदाहरणों में, मैंने सभी सेवा जानकारी को हटा दिया है जो धारणा (मुख्य रूप से URL) के साथ हस्तक्षेप करती है, इसे दीर्घवृत्त (...) के साथ बदल देती है।



<dl class=" fn n ">

<dt> </dt>

<dd class="username"><span class=" given-name "></span> <span class=" family-name "></span></dd>

</dl>







यह कोड बताता है कि इसके अंदर व्यक्ति के नाम और उपनाम के बारे में जानकारी है।



हम और आगे बढ़ें। हम जन्म तिथि के बारे में जानकारी का वर्णन करते हैं:

<dl>

<dt> :</dt>

<dd class=" bday " title="1982-01-26" >26 1982</dd>

</dl>







हम फोटो के लिंक का वर्णन करते हैं:

<dl>

<dt>:</dt>

<dd><img class="photo" src="…" width="136" height="144" alt="" title="" border="0"></dd>

</dl>







अब उपयोगकर्ता की स्थान जानकारी की बारी है:

<dt>:</dt>

<dd><a class="country-name" href="…"></a>,

<a class="region" href="…"> .</a></dd>

</dl>



, :

<dl>

<dt> :</dt>

<dd class= "summary" > , </dd>

</dl>









. IT- ? , "url" rel "me" — , , . .. . — , XFN, hCard.



<dl>

<dt>:</dt>

<dd class= "url" ><a class="icon" rel="me" href="http://webmascon.com/" target="_blank">Webmascon</a></dd>

</dl>







.