दिलचस्प पोस्ट
presentViewController: IOS पर क्रैश <6 (ऑटोलेआउट) एक एक्सेल कॉलम नाम में एक स्तंभ सूचक का अनुवाद करें एंड्रॉइड ऐप के लिए आप एक पारदर्शी डेमो स्क्रीन कैसे बना सकते हैं? UIImageWriteToSavedPhotosAlbum गलत आकार और गुणवत्ता के लिए बचाता है एक आदेश और एक क्रमबद्ध संग्रह के बीच अंतर क्या है? आर में एक स्ट्रिंग से पिछले n वर्णों को निकालना एंड्रॉइड में मेमोरी एनालाइज़र टूल? उपयोगकर्ता परिभाषित वर्ग की वस्तुओं की एक सूची छपाई ASP.NET अनुप्रयोग recompiling बिना संसाधन फ़ाइलों को संपादित करना साझा तालिका संरचनाओं के साथ बहु-किरायेदार डेटाबेस कैसे तैयार करें? टर्मिनल से ईमेल कैसे भेजें? कैसे आईफोन ऐप कई एसडीके (फर्मवेयर) संस्करणों के साथ संगत है I SmtpException: परिवहन कनेक्शन से डेटा पढ़ने में असमर्थ: net_io_connectionclosed ग्लोबल म्यूटक्स सी # में उपयोग करने के लिए एक अच्छा पैटर्न क्या है? asp.net: अमान्य पोस्टबैक या कॉलबैक तर्क

क्या <i> <i> <span> के बजाय आइकन के लिए टैग का उपयोग करना चाहिए?

मैंने फेसबुक के स्रोत में देखा है, वे आइकनों को प्रदर्शित करने के लिए <i> टैग का उपयोग करते हैं

इसके अलावा, आज मैं ट्विटर के बूटस्ट्रैप में देखा था। यह आइकन प्रदर्शित करने के लिए <i> टैग का भी उपयोग करता है

परंतु,

HTML5 युक्ति से :

मैं तत्व वैकल्पिक आवाज या मूड में पाठ की अवधि का प्रतिनिधित्व करता है, या अन्यथा सामान्य गद्य से ऑफसेट करता है, जैसे एक वर्गीकरण पद, एक तकनीकी शब्द, किसी अन्य भाषा से एक मुहावरेदार वाक्यांश, एक विचार, जहाज का नाम, या कुछ अन्य गद्य जिसका विशिष्ट typographic प्रस्तुति italicized है

आइकन का प्रदर्शन करने के लिए वे <i> टैग का उपयोग क्यों कर रहे हैं?

क्या यह बुरा व्यवहार नहीं है?

या मुझसे यहां कुछ छूट रहा है?

मैं माउस प्रदर्शित करने के लिए span का उपयोग कर रहा हूं और यह अभी तक मेरे लिए काम कर रहा है।

अद्यतन करें:

बूटस्ट्रैप 3 अब आइकन के लिए span का उपयोग करता है आधिकारिक डॉक्टर

Solutions Collecting From Web of "क्या <i> <i> <span> के बजाय आइकन के लिए टैग का उपयोग करना चाहिए?"

आइकन का प्रदर्शन करने के लिए वे <i> टैग का उपयोग क्यों कर रहे हैं?

क्योंकि यह है:

  • कम
  • मैं आइकन के लिए खड़ा है (हालांकि एचटीएमएल में नहीं)

क्या यह बुरा व्यवहार नहीं है?

भयानक अभ्यास यह शब्दार्थों पर प्रदर्शन की जीत है

मैं यहाँ थोड़ी देर में कूद रहा हूं, लेकिन इस पृष्ठ पर यह मेरे लिए विचार करते हुए आया था बेशक, मुझे नहीं पता कि फेसबुक या ट्विटर ने इसे कैसे न्यायसंगत बनाया है, लेकिन यह मेरी खुद की सोचा प्रक्रिया है जो इसके लायक है।

अंत में, मैंने निष्कर्ष निकाला है कि यह प्रथा असामान्य नहीं है (यह एक शब्द है?) वास्तव में, "आई है I आइकन के लिए", और मुझे लगता है कि यह वास्तव में एक आइकन के लिए सबसे अर्थपूर्ण पसंद है, जब एक सीधी <img> टैग व्यावहारिक नहीं है, इसके अलावा थोड़ेपन और अच्छे सहयोग के अलावा

1. का उपयोग युक्ति के अनुरूप है।

हालांकि यह नहीं हो सकता है कि डब्लू 3 मुख्य रूप से मन में क्या था, मुझे लगता है कि <i> लिए आधिकारिक कल्पना एक आइकन को आसानी से समायोजित कर सकता है आखिरकार, उत्तर-तीर का प्रतीक दूसरे तरफ "उत्तर" कह रहा है। यह एक तकनीकी शब्द व्यक्त करता है जो पाठक से अपरिचित हो सकता है और इसे आमतौर पर इटैलिक किया जाएगा। ("यहां ट्विटर पर, यह हम एक उत्तर तीर कहते हैं ।") और यह दूसरी भाषा से एक शब्द है: एक प्रतीकात्मक भाषा।

अगर, तीर के प्रतीक के बजाय, ट्विटर ने <i>shout out</i> या <i>[Japanese character for reply]</i> (एक अंग्रेजी पृष्ठ पर) का उपयोग किया है, जो कि युक्ति के अनुरूप होगा फिर क्यों <i>[reply arrow]</i> ? (मैं कड़ाई से HTML शब्दार्थों के बारे में बात कर रहा हूँ, पहुंच योग्यता नहीं, जो मुझे मिलेगा।)

जहाँ तक मैं देख सकता हूं, आइकन के उपयोग से स्पष्ट रूप से उल्लंघन किए जाने वाले स्पेक का एकमात्र हिस्सा "पाठ का काल" वाक्यांश है (जब टैग में पाठ भी नहीं है)। यह स्पष्ट है कि <i> टैग मुख्य रूप से पाठ के लिए होता है, लेकिन यह टैग के समग्र इरादे की तुलना में एक बहुत छोटा विस्तार है। इस टैग के लिए महत्वपूर्ण प्रश्न यह नहीं है कि इसमें किस सामग्री का प्रारूप है, लेकिन उस सामग्री का अर्थ क्या है

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

इसलिए तथ्य यह है कि कल्पना के लेखकों ने इसे स्पष्ट करने के लिए (या चुनना) नहीं किया, यह हमारे हाथों को जो कि समझ में आता है, से टाई नहीं करना चाहिए और टैग की भावना के अनुरूप है। <a> टैग मूल रूप से उपयोगकर्ता को कहीं और ले जाने का इरादा था, लेकिन अब यह एक लाइटबॉक्स को पॉप अप कर सकता है। बिग ऊपरी, सही? अगर किसी ने कल्पना की थी कि कैसे कल्पना पर क्लिक करने से पहले क्लिक करने पर लाइटबॉक्स को पॉप अप किया जाता है, तो अब भी <span> टैग टैग <span> उपयोग करना चाहिए था, भले ही यह वर्तमान परिभाषा के अनुरूप नहीं था, क्योंकि – यह निकटतम आया और टैग की भावना से अभी भी सुसंगत था ("जब आप यहां क्लिक करेंगे तो कुछ होगा)"। <i> के साथ एक ही सौदा – आप जिस चीज़ को अंदर डालते हैं, या फिर रचनात्मक रूप से इसका इस्तेमाल करते हैं, यह एक वैकल्पिक या सेट-अलौकिक शब्द का सामान्य विचार व्यक्त करता है।

2. <i> टैग एक आइकन तत्व को अर्थ का अर्थ जोड़ता है

एक आइकन वर्ग को अपने आप में ले जाने का वैकल्पिक विकल्प <span> , जो कि किसी भी अर्थ के अर्थ का अर्थ नहीं है। जब एक मशीन <span> इसमें शामिल है, तो यह कहता है, "मुझे पता नहीं। कुछ भी हो सकता है।" लेकिन <i> टैग कहता है, "मैं एक सामान्य तरीका, या शायद एक अपरिचित शब्द से कुछ कहने का एक अलग तरीका है।" यह वही नहीं है जैसे "मैं एक आइकन रखता हूं," लेकिन यह <span> तुलना में बहुत करीब है!

3. अंततः, आम उपयोग सही बनाता है।

उपर्युक्त के अतिरिक्त, यह मशीन पाठकों (चाहे खोज इंजन, स्क्रीन रीडर, या जो कुछ भी हो) को ध्यान में लाएगा, चाहे किसी भी समय फेसबुक, ट्विटर, और अन्य वेबसाइटों को आइकनों के लिए <i> टैग का उपयोग करना शुरू हो जाए। वे कल्पना के बारे में ज्यादा परवाह नहीं करते जितना वे आवश्यकतानुसार जो भी अर्थ से कोड से अर्थ निकालने की परवाह करते हैं। इसलिए वे सामान्य उपयोग के इस ज्ञान का प्रयोग केवल यह रिकॉर्ड करने के लिए कर सकते हैं कि "यहां एक आइकन हो सकता है" या कुछ और उन्नत कर सकते हैं जैसे कि संकेत को अर्थ के लिए सीएसएस पर ट्रिगर करना, या कौन जानता है कि क्या है। इसलिए यदि आप अपनी वेबसाइट पर चिन्हों के लिए <i> का उपयोग करना चुनते हैं, तो आप युक्ति से अधिक अर्थ प्रदान कर सकते हैं।

इसके अलावा, यदि यह उपयोग व्यापक हो जाता है, तो भविष्य में यह संभावना को शामिल किया जाएगा। फिर आप <i> 's के साथ <i> <span> s की जगह अपने कोड के माध्यम से जा रहे होंगे! तो यह कल्पना की दिशा के साथ बोर्ड पर पहुंचने का अर्थ हो सकता है, खासकर जब यह वर्तमान कल्पना के साथ स्पष्ट रूप से संघर्ष नहीं करता है। सामान्य उपयोग भाषा के नियमों को अन्य तरीकों से अधिक के आधार पर निर्देशित करने के लिए जाता है। यदि आप काफी पुरानी हैं, तो क्या आपको याद है कि जब शब्द नया था, तो "वेब साइट" आधिकारिक वर्तनी थी? शब्दकोशों ने जोर दिया कि वहां एक स्थान होना चाहिए और वेब को पूंजीकृत होना चाहिए। इसके लिए अर्थपूर्ण कारण थे लेकिन आम उपयोग ने कहा, "जो भी हो, वह बेवकूफी है। मैं 'वेबसाइट' का उपयोग कर रहा हूं क्योंकि यह अधिक संक्षिप्त है और बेहतर दिखता है।" और लंबे समय से पहले, शब्दकोशों ने औपचारिक रूप से स्वीकार किया कि वर्तनी सही है

4. इसलिए मैं आगे बढ़ रहा हूं और इसका इस्तेमाल कर रहा हूं।

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

क्विंटिन के जवाब में स्पष्ट रूप से कहा गया है कि आइकॉन को परिभाषित करने के लिए i टैग का उपयोग नहीं करना चाहिए

लेकिन, होली ने सुझाव दिया कि span का अर्थ अपने आप में कोई मतलब नहीं है और span टैग के बजाय i इसके पक्ष में वोट किया है।

आईएमजी का उपयोग करने के लिए कुछ सुझाव हैं क्योंकि यह शब्दार्थ है और इसमें alt टैग शामिल है। लेकिन, हमें img उपयोग भी नहीं करना चाहिए क्योंकि रिक्त src सर्वर से अनुरोध भेजता है। यहां पढ़ें

मुझे लगता है, सही तरीका होगा,

<span class="icon-fb" role="img" aria-label="facebook"></span>

यह span में कोई alt टैग के मुद्दे को हल नहीं करता है और इसे दृष्टि-प्रभावित उपयोगकर्ताओं के लिए सुलभ बनाता है। यह शब्दार्थ है और किसी भी टैग का दुरुपयोग नहीं है (हैकिंग)

मेरा अनुमान: क्योंकि ट्विटर ने विरासत के ब्राउज़रों का समर्थन करने की आवश्यकता को देख लिया है, अन्यथा वे इसका उपयोग करेंगे :before / :after छद्म तत्वों के :after

लिगेसी ब्राउज़र उन छद्म-तत्वों का समर्थन नहीं करते हैं, इसलिए उन्हें आइकनों के लिए वास्तविक HTML तत्व का उपयोग करने की आवश्यकता होती है, और जब से आइकनों में 'अनन्य' टैग नहीं होता है, वे केवल <i> टैग के साथ जाते हैं, और सभी ब्राउज़र उस टैग का समर्थन करते हैं।

वे निश्चित रूप से एक <span> उपयोग कर सकते थे, जैसे आप पूरी तरह से (जो पूरी तरह से ठीक है), लेकिन संभवतया मैंने ऊपर दिए गए कारण के कारण क्वेंटिन द्वारा उल्लेखित लोगों के लिए भी यही कारण है कि बूटस्ट्रैप <i> टैग का उपयोग कर रहा है।

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

पुनश्च। यह तथ्य कि 'आई' के साथ चिन्ह शुरू होते हैं और यह कि एक <i> टैग है, पूरी तरह संयोग है।

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

कस्टम तत्वों को बनाने से रोकने के लिए कुछ भी ऐसा नहीं है जो स्वयं को बहुत ही उद्देश्य से वर्णनात्मक है

दोनों आधुनिक ब्राउज़रों और यहां तक ​​कि आईई 6+ (डब्ल्यू / शिम) जैसी चीजों का समर्थन कर सकते हैं:

 <icon class="plus"> 

या

 <icon-add> 

बस टैग को सामान्य करने के लिए सुनिश्चित करें:

  icon { display:block; margin:0; padding:0; border:0; ... } 

और यदि आपको IE9 या उससे पहले का समर्थन करने की आवश्यकता है तो एक शिम का उपयोग करें (नीचे पोस्ट देखें)

यह स्टैक ओवरफ्लो पोस्ट देखें:

HTML5 में अपना खुद का HTML टैग बनाने का कोई तरीका क्या है

मेरी बहस को आगे बढ़ाने के लिए, Google के कोण निर्देशक और नई पॉलिमर परियोजना दोनों कस्टम HTML टैग की अवधारणा का उपयोग करते हैं।

मैंने सोचा कि यह बहुत बुरा लग रहा है – क्योंकि मैं हाल ही में एक जूमला टेम्पलेट पर काम कर रहा था और मैंने टेम्पलेट को डब्लू 3 सी में असफल रखा क्योंकि यह <i> टैग का उपयोग कर रहा था और जिसने इसे नापसंद किया था, क्योंकि यह मूल उपयोग था, जो कुछ इटैलिक करना था, जो अब है सीएसएस नहीं एचटीएमएल के माध्यम से किया और किसी भी अधिक

यह वास्तव में खराब अभ्यास करता है क्योंकि जब मैंने इसे देखा था तब मैं टेम्पलेट के माध्यम से गया और सभी <i> टैग को <span style="font-style:italic"> दिया और फिर आश्चर्य हुआ कि पूरे टेम्पलेट अजीब क्यों दिख रहा है

यह मुख्य कारण यह है कि <i> इस तरह से टैग का उपयोग करना बुरा विचार है – आप कभी नहीं जानते कि आपके काम को बाद में कौन देख रहा है और "मान लें" कि आप वास्तव में क्या करने की कोशिश कर रहे हैं, पाठ को इटैलिक करें एक आइकन प्रदर्शित करने से मैंने एक वेबसाइट में कुछ आइकॉन डाल दिए हैं और मैंने इसे निम्नलिखित कोड के साथ किया है

 <img class="icon" src="electricity.jpg" alt="Electricity" title="Electricity"> 

इस तरह से मुझे एक वर्ग में अपने सारे आइकॉन मिलते हैं, इसलिए मैं जो भी परिवर्तन करता हूं, वह सभी चिह्नों को प्रभावित करता है (जैसे कि मैं उन्हें बड़ा या छोटा, या गोल सीमाएं आदि चाहता हूं), वैकल्पिक पाठ स्क्रीन पाठकों को व्यक्ति को बताने का मौका देता है आइकन संभवत: "इटैलिक में पाठ, इटैलिक का अंत" प्राप्त करने की जगह नहीं है (मुझे बिल्कुल पता नहीं है कि स्क्रीन रीडर्स कैसे स्क्रीन पढ़ते हैं, लेकिन मुझे लगता है कि ऐसा कुछ है), और शीर्षक भी उपयोगकर्ता को माउस का मौका देता है छवि और एक टूलटिप प्राप्त करें जो उन्हें बताए कि आइकन क्या है, यदि वे इसे नहीं समझ सकते <i> का उपयोग करने से बेहतर – और यह भी W3C मानक पास करता है

मुझे यह भी उपयोगी साबित हुआ जब मैं एक लिंक <a> टैग के अंदर पूर्ण स्थिति वाला आइकन रखना चाहता था

मैंने पहले <img> टैग के बारे में सोचा, लेकिन लिंक्स के अंदर उन टैगों की डिफ़ॉल्ट स्टाइल में आमतौर पर सीमा स्टाइल और / या छाया प्रभाव होते हैं। इसके अलावा, यह एक "src" विशेषता को परिभाषित किए बिना एक <img> टैग का उपयोग करने में गलत लगता है जबकि मैं पृष्ठभूमि-छवि शैली पत्रक घोषणा का उपयोग कर रहा हूं ताकि छवि भूत और ड्रैग न हो।

इस बिंदु पर आप <span> या <i> जैसे टैगों के बारे में सोच रहे हैं – उस स्थिति में <i> इस प्रकार के आइकन के रूप में बहुत मायने रखता है

सभी में मुझे लगता है कि इसके लाभ को सहज ज्ञान युक्त होने के अलावा, यह एक आइकन के रूप में इस टैग के काम को बनाने के लिए न्यूनतम शैली शीट समायोजन की आवश्यकता है।