Img की ऊंचाई और शीर्षक के बीच अंतर - जो एक का उपयोग करें - और प्रभाव

Question

वर्षों से मैं इस तरह की छवियों के लिए अपना HTML लिख रहा हूं:

<img src="picture.jpg" alt="my picture" >

लेकिन मैंने हाल ही में रेवेन एसईओ टूल का उपयोग करके अपनी साइट का एक ऑडिट चलाया और इसने उन त्रुटियों का भार बताया, जिनसे मैं वास्तव में आश्चर्यचकित था।

जब मैं रिपोर्ट के माध्यम से गया, तो इन त्रुटियों में से 99% गायब छवि शीर्षक पाठ के कारण थे।

मुझे पता है कि एक छवि के लिए शीर्षक पाठ जब आप एक छवि पर मंडराते हैं, तो थोड़ा पॉप प्रदर्शित कर सकते हैं, लेकिन इसके अलावा इसका उद्देश्य क्या है और इसका एसईओ पर प्रभाव पड़ता है?

इसके अलावा अगर आप इसे लागू करते हैं, तो आप वहां क्या करेंगे? क्या आप केवल वही जानकारी डालेंगे जो altविशेषता में है? अर्थातalt="my picture" title="my picture"

Comments

"कौन सा उपयोग करें" - मुझे नहीं लगता कि इस बारे में कोई सवाल है कि क्या आपको altविशेषता का उपयोग करना चाहिए - यह अनिवार्य है और आपके पृष्ठ इसके बिना सत्यापन विफल हो जाएंगे (जब तक कि एचटीएमएल 5 के साथ कुछ किनारे के मामलों में?)।

— MrWhite

क्या "रेवेन एसईओ" एक सटीक "त्रुटि", या एक चेतावनी / सूचना की रिपोर्टिंग कर रहा है?

— MrWhite

@ w3d ने इसकी चेतावनी / सूचना दी

— sam

Answer 1

ALT टैग एक एक्सेसिबिलिटी टैग है, जो उन लोगों के लिए पेश किया गया है, जिन्हें Google के माध्यम से भी दृष्टि संबंधी कठिनाइयाँ होती हैं, यह निर्धारित करने के लिए कि यह क्या छवि है, आपके विज़िटर के समक्ष SEO उद्देश्यों के लिए ऑल्ट टैग लगाने पर विचार नहीं करना चाहिए।

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

हालाँकि, आप Google को सूचित कर सकते हैं कि आपके दर्शकों को देखने के दौरान छवि किस बारे में है, कभी भी कीवर्ड को पूरी तरह से टैग में न रखें, यह उपयोगकर्ता के अनुभव और इसके बहुत ही अप्राकृतिक होने को नम करता है।

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

इसका एक अच्छा उदाहरण नीचे देखा जा सकता है

<img src="i.jpg" alt="Bournemouth" />

बनाम

<img src="i.jpg" alt="Birdseye view of Bournemouth" />

उपरोक्त उदाहरण में अभी भी आपका कीवर्ड शामिल है, जबकि Google और आपका ऑडियंस दोनों को बताता है कि छवि किस बारे में है।

तो शीर्षक टैग के बारे में क्या?

शीर्षक टैग को अधिक जानकारी देने के लिए डिज़ाइन किया गया था, जब आप किसी तत्व पर मंडराते हैं, तो यह IMG के लिए बहुत उपयोगी नहीं है क्योंकि यदि आप ALT और TITLE के लिए समान जानकारी का उपयोग करने का इरादा रखते हैं, तो आप एक स्क्रिप्ट का उपयोग कर सकते हैं, ताकि पूरी तरह से टैग को पढ़ा जा सके और अपना बहुत कुछ बना सके जेएस का उपयोग करते हुए खुद के होवर ओवर। मैं केवल शीर्षक टैग की सिफारिश करूंगा, यदि आपके एएलटी टैग की तुलना में अधिक जानकारी प्रदान करने के लिए जा रहा है, एक लंबे विवरण की तरह - दोनों तत्वों में सटीक जानकारी प्रदान करने की कोई आवश्यकता नहीं है, क्योंकि यह कोड को ब्लास्ट करता है।

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

Comments

"यदि कोई शीर्षक नहीं मिला है, तो यह ऑवर टैग को हॉवर ओवर के रूप में पढ़ेगा" - किसी भी आधुनिक ब्राउज़र altमें "हॉवर ओवर" के रूप में विशेषता का उपयोग नहीं किया जाता है। केवल IE7 और पहले ने पॉपअप टूलटिप (जब विशेषता छोड़ी गई है) के रूप में ऑल्ट टेक्स्ट दिखाया । title

— MrWhite

क्षमा करें, मेरे कहने का मतलब यह नहीं है। मेरा मतलब है कि पाठ बंद करने के लिए आपको ऑल्ट टैग मिल जाएगा। होवर ओवरों के लिए आप सिर्फ एक टैग का उपयोग करके एशट टैग को पढ़कर शीर्षक बना सकते हैं। अगर वे एक ही हैं तो वे ऊंचाई और शीर्षक दोनों लिखने की ज़रूरत नहीं है, वे आपके कोड को ब्लोट करते हैं।

— साइमन हैटर

); @ संपादित जवाब W3D

— साइमन हैटर

लेकिन जहां तक ​​एसईओ शीर्षक के संदर्भ में शीर्षक रैंकिंग के लिए बहुत कम है, मैट कट्स इस वीडियो में शीर्षक के बारे में थोड़ी बात करते हैं googlewebmastercentral.blogspot.co.uk/2007/12/… लेकिन ALT टैग पर अधिक ध्यान केंद्रित करता है। मेरा व्यक्तिगत रूप से मानना ​​है कि यह उपयोगकर्ता अनुभव में योगदान दे सकता है लेकिन विशाल तरीके से नहीं जैसा कि आप आशा करेंगे, लाखों शीर्ष साइटें छवियों पर किसी भी शीर्षक के बिना रैंक करती हैं।

— साइमन हैटर

बस सोचा कि यह स्पष्ट करने लायक था ... altऔर titleविशेषताओं को "कभी भी एक ही" नहीं होना चाहिए, क्योंकि यह उन लोगों को भ्रमित करेगा जो altपाठ को उपयोग करने के लिए उपयोग करते हैं । JQuery समाधान एक माउसओवर इवेंट बनाता है, यह केवल altटेक्स्ट को titleविशेषता में कॉपी नहीं करता है ।

— MrWhite

Answer 2

altछवि का एक वैकल्पिक विवरण देता है । के लिए यह विशेषता आवश्यक है img।

titleछवि के बारे में अतिरिक्त जानकारी देता है । यह विशेषता इसके लिए वैकल्पिक है img।

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

इन दोनों विशेषताओं में समान सामग्री नहीं होनी चाहिए।

Answer 3

आपका भ्रम सामान्य है और हां प्रत्येक टैग (शीर्षक, ALT) यह अपनी क्षमता का प्रतिनिधित्व करता है जो खोज इंजन और उपयोगकर्ता को यह जानने में मदद करता है कि छवि क्या है।

कुछ समय एएलटी पाठ छवि का वर्णन करने के लिए पर्याप्त नहीं है, इसलिए जहां तक ​​संभव हो अधिक जानकारी प्रदान करना बेहतर है, असाइन किए गए शब्दों में भिन्नता का उपयोग करें जो एसईओ के दृष्टिकोण से भी अधिक प्रभावी है।