HTML पेस्ट करें और कुछ ही सेकंड में हर टूटी इमेज ढूँढें। हर इमेज सच में आपके ब्राउज़र में लोड की जाती है, इसलिए आप देख पाते हैं कि कौन सी फ़ेल होती है, उसका असली पिक्सेल साइज़ क्या है, और किसमें alt टेक्स्ट नहीं है।
टूल के बटन और संदेश अभी अंग्रेज़ी में हैं। टूल का काम करने का तरीका अंग्रेज़ी पेज जैसा ही है।
इस टूल के बारे में
Broken Image Checker आपके पेस्ट किए HTML में हर <img> टैग ढूँढता है और हर इमेज को आपके ब्राउज़र में लोड करने की कोशिश करता है, ठीक वैसे ही जैसे किसी विज़िटर का ब्राउज़र करेगा। जो इमेज लोड हो जाती हैं, उन्हें ठीक (working) माना जाता है और उनकी असली चौड़ाई और ऊँचाई पिक्सेल में दिखाई जाती है, यानी फ़ाइल का अपना साइज़, न कि वह साइज़ जो आपके HTML में सेट है। जो इमेज फ़ेल होती हैं, उन्हें टूटी (broken) माना जाता है, चाहे फ़ाइल डिलीट हो गई हो, पते में टाइपो हो, सर्वर बंद हो, लिंक इमेज की जगह किसी पेज पर जाता हो, या होस्ट इमेज देने से मना करे। जो इमेज 15 सेकंड बाद भी लोड नहीं होती, उसे टाइमआउट बताया जाता है, और ख़ाली src एट्रिब्यूट तुरंत फ़्लैग किया जाता है। लोड जाँच के साथ-साथ टूल alt टेक्स्ट भी जाँचता है: गायब alt एट्रिब्यूट फ़्लैग किया जाता है क्योंकि स्क्रीन रीडर और सर्च इंजन उस पर निर्भर रहते हैं, जबकि ख़ाली alt="" को सिर्फ़ सजावटी इमेज के लिए सही विकल्प माना जाता है। https:// या http:// से शुरू होने वाले पते और इनलाइन data: इमेज जाँची जाती हैं; /images/logo.png जैसे रिलेटिव पाथ अलग से दिखाए जाते हैं, क्योंकि उनका मतलब सिर्फ़ उसी साइट के साथ बनता है जिसके वे हैं। टाइप करते ही नतीजे अपडेट होते हैं, और एक सारांश बताता है कि कितनी इमेज मिलीं और कितनी टूटी हैं। जाँच आपके ब्राउज़र में होती है, इसलिए आपका पेस्ट किया HTML हमारे सर्वर पर अपलोड नहीं होता।
पेज खोलें, राइट-क्लिक करके View Page Source चुनें, या अपने CMS या ईमेल टेम्पलेट से कोई हिस्सा कॉपी करें। <img> टैग वाला कोई भी HTML चलेगा।
HTML को एडिटर में पेस्ट करें। टूल हर <img> टैग ढूँढता है और आपके टाइप करना रोकने के आधे सेकंड बाद जाँच शुरू करता है।
पूरे https:// पते या data: URI वाली हर इमेज आपके ब्राउज़र में लोड की जाती है। हर इमेज के पूरा होते ही नतीजे एक-एक करके दिखते हैं।
टूटी इमेज बदलें या फिर से अपलोड करें, ग़लत पते सुधारें, और जहाँ alt टेक्स्ट नहीं है वहाँ जोड़ें। पुष्टि के लिए अपडेट किया HTML फिर से पेस्ट करें।
हर इमेज को आपका ब्राउज़र सच में माँगता और डिकोड करता है, इसलिए जो इमेज ठीक दिखाई गई है, वह विज़िटर को भी दिखेगी।
हर इमेज फ़ाइल के असली आयाम देखें, जिससे छोटे थंबनेल में ठूँसी गई 4000 px की फ़ोटो पकड़ने में मदद मिलती है।
गायब alt एट्रिब्यूट फ़्लैग होते हैं, जबकि सजावटी इमेज पर ख़ाली alt टेक्स्ट को सही तरह से मान्य माना जाता है।
टूटी इमेज, 15 सेकंड के टाइमआउट, ख़ाली src एट्रिब्यूट और रिलेटिव पाथ, सबको अलग लेबल मिलता है, ताकि आपको पता रहे कि क्या ठीक करना है।
विज़िटर से पहले गायब इमेज पकड़ें
होस्ट बदलने, डोमेन बदलने या HTTPS पर जाने के बाद अक्सर इमेज लिंक पुरानी जगह की ओर इशारा करते रह जाते हैं।
उदाहरणhttp://old-domain.com से हटने के बाद किसी ब्लॉग पोस्ट का HTML पेस्ट करें। जो इमेज अब भी पुराने डोमेन से जुड़ी हैं, वे टूटी दिखती हैं।
कैंपेन भेजने के बाद उसकी टूटी इमेज ठीक नहीं की जा सकती, इसलिए पहले हर इमेज जाँचें।
उदाहरणअपने ईमेल बिल्डर का HTML एक्सपोर्ट पेस्ट करें और शेड्यूल करने से पहले पुष्टि करें कि हेडर बैनर और प्रोडक्ट फ़ोटो सब लोड हो रहे हैं।
गायब प्रोडक्ट फ़ोटो से बिक्री घटती है और दुकान लावारिस जैसी लगती है।
उदाहरणकिसी कैटेगरी पेज का प्रोडक्ट ग्रिड पेस्ट करें और वे आइटम ढूँढें जिनकी इमेज फ़ाइल मीडिया लाइब्रेरी से डिलीट हो गई है।
टूटी इमेज और गायब alt टेक्स्ट ऑन-पेज SEO और एक्सेसिबिलिटी रिव्यू में आम तौर पर मिलने वाली कमियाँ हैं।
उदाहरण24 इमेज वाले एक पेज में 2 टूटी और 5 बिना alt एट्रिब्यूट वाली इमेज दिखती हैं, जिससे क्लाइंट रिपोर्ट के लिए साफ़ सुधार-सूची मिल जाती है।
दूसरी वेबसाइटों से एम्बेड की गई इमेज कभी भी गायब या ब्लॉक हो सकती हैं।
उदाहरणपार्टनर साइट पर होस्ट इमेज दिखाने वाले एक लेख में तीन इमेज अब फ़ेल होती दिखती हैं, क्योंकि पार्टनर ने उन्हें हटा दिया।
असली पिक्सेल साइज़ से पता चलता है कि कौन सी इमेज ज़रूरत से कहीं बड़ी हैं।
उदाहरण64 px का अवतार असल में 3000 × 3000 px की फ़ाइल निकलता है; उसे रीसाइज़ करते ही पेज की स्पीड में आसान सुधार मिलता है।
वजह ढूँढें, फिर हमेशा के लिए ठीक करें
/uploads/photo.jpg जैसे रिलेटिव पाथ छोड़ दिए जाते हैं। उन्हें जाँचने के लिए पेज लोड होने के बाद View Page Source से HTML कॉपी करें, या पाथ के आगे अपना डोमेन जोड़ें।
लेज़ी-लोडिंग प्लगइन अक्सर src में एक छोटा प्लेसहोल्डर और data-src में असली पता रखते हैं। टूल src जाँचता है, इसलिए पेज स्क्रॉल करने के बाद, जब असली पते आ जाएँ, अपने ब्राउज़र के Elements पैनल से HTML कॉपी करें।
टूटी इमेज का पता नए टैब में खोलें। 404 पेज का मतलब है फ़ाइल नहीं रही; तस्वीर की जगह वेब पेज दिखे तो लिंक ग़लत जगह जा रहा है।
अगर असली साइज़ दिखाई जाने वाली जगह से कई गुना बड़ा है, तो पेज तेज़ करने के लिए उसे रीसाइज़ और कंप्रेस करें।
Image Resizer खोलेंछोटे वाक्यांश में बताएँ कि इमेज में क्या है। alt="" सिर्फ़ पूरी तरह सजावटी इमेज के लिए इस्तेमाल करें, जैसे डिवाइडर या बैकग्राउंड आकृतियाँ।
जिन पेजों में टूटी इमेज होती हैं, उनमें अक्सर टूटे लिंक भी होते हैं। उसी पेज को लिंक चेकर में भी चलाएँ।
Broken Link Checker खोलें
इमेज लोड होना बंद होने की पाँच असली वजहें, पेज पर हर टूटी इमेज मिनटों में कैसे ढूँढें, और ऐसा alt टेक्स्ट कैसे लिखें जो लोगों और Google दोनों की मदद करे।
लेख पढ़ें
साफ़ लेखन क्यों जीतता है, Flesch स्कोर असल में क्या मापते हैं, और किसी भी टेक्स्ट को उसका मतलब और अंदाज़ बनाए रखते हुए पढ़ने में आसान बनाने की व्यावहारिक तकनीकें।
लेख पढ़ें
लाइन ड्रॉइंग, घूमते लोडर, hover इफ़ेक्ट और एक-एक करके दिखने वाले हिस्से: CSS से SVG एनिमेशन कैसे काम करता है, वे उलझनें जिनमें सब फँसते हैं, और इसे सबके लिए सुलभ कैसे रखें।
लेख पढ़ें