कोई भी चित्र जिसे आप अपनी वेबसाइट में लिंक करना चाहते हैं एचटीएमएल पहले उसी स्थान पर अपलोड किया जाना चाहिए जहां आप वेब पेज के लिए एचटीएमएल भेजते हैं, चाहे साइट उस वेब सर्वर पर होस्ट की गई हो जिस पर आप पहुंचते हैं एफ़टीपी या आप वेब होस्टिंग सेवा का उपयोग करते हैं। यदि आप वेब होस्टिंग सेवा का उपयोग करते हैं, तो संभवतः आप सेवा द्वारा प्रदान किए गए अपलोड फॉर्म का उपयोग करते हैं। ये फ़ॉर्म आमतौर पर आपके होस्टिंग खाते के व्यवस्थापन अनुभाग में होते हैं।
अपनी छवि को होस्टिंग सेवा पर अपलोड करना केवल पहला कदम है। फिर आपको इसे पहचानने के लिए HTML में एक टैग जोड़ना होगा।
छवियों को HTML के समान निर्देशिका में अपलोड करना
आपकी तस्वीरें HTML के समान निर्देशिका में स्थित हो सकती हैं। अगर ऐसी बात है:
- अपनी वेबसाइट के रूट पर एक इमेज अपलोड करें।
- छवि को इंगित करने के लिए अपने HTML में एक छवि टैग जोड़ें।
- HTML फ़ाइल को अपनी वेबसाइट के रूट पर अपलोड करें।
- अपने वेब ब्राउज़र में पेज खोलकर फ़ाइल का परीक्षण करें।
छवि टैग निम्न प्रारूप लेता है:
यह मानते हुए कि आप "lunar.jpg" नाम से चंद्रमा की एक तस्वीर अपलोड कर रहे हैं, छवि टैग निम्नलिखित रूप लेता है:
ऊंचाई और चौड़ाई वैकल्पिक है लेकिन अनुशंसित है। ये डिफ़ॉल्ट मान पिक्सेल में हैं, लेकिन प्रतिशत के रूप में भी व्यक्त किए जा सकते हैं:
इमेज टैग को क्लोजिंग टैग की आवश्यकता नहीं है।
यदि आप किसी अन्य दस्तावेज़ में किसी छवि से लिंक कर रहे हैं, तो एंकर टैग का उपयोग करें और छवि टैग को अंदर घोंसला बनाएं।
उपनिर्देशिका में चित्र अपलोड करना
छवियों को एक उप-निर्देशिका में संग्रहीत करना अधिक सामान्य है, जिसे आमतौर पर कहा जाता है इमेजिस. उस निर्देशिका में छवियों को इंगित करने के लिए, आपको यह जानना होगा कि यह आपकी वेबसाइट की जड़ के संबंध में कहां है।
आपकी वेबसाइट की जड़ वह जगह है जहां यूआरएल, बिना किसी निर्देशिका के अंत में प्रदर्शित होता है। उदाहरण के लिए, "MyWebpage.com" नाम की वेबसाइट के लिए रूट इस फॉर्म का अनुसरण करता है: http://MyWebpage.com/. अंत में स्लैश पर ध्यान दें। इस प्रकार एक निर्देशिका की जड़ आमतौर पर इंगित की जाती है। उपनिर्देशिकाओं में वह स्लैश शामिल होता है, यह दिखाने के लिए कि वे निर्देशिका संरचना में कहाँ बैठते हैं। MyWebpage उदाहरण साइट की संरचना हो सकती है:
http://MyWebpage.com/ — रूट डायरेक्टरी
http://MyWebpage.com/products/ — उत्पाद निर्देशिका
http://MyWebpage.com/products/documentation/ — उत्पाद निर्देशिका के अंतर्गत दस्तावेज़ीकरण निर्देशिका
http://MyWebpage.com/images/ — इमेज डायरेक्टरी
इस मामले में, जब आप छवि निर्देशिका में अपनी छवि को इंगित करते हैं, तो आप लिखते हैं:
इसे कहा जाता है निरपेक्ष पथ आपकी छवि को।
छवियों के साथ सामान्य समस्याएं जो प्रदर्शित नहीं होती हैं
अपने वेब पेज पर छवियों को प्रदर्शित करना पहली बार में चुनौतीपूर्ण हो सकता है। दो सबसे आम कारण हैं कि छवि अपलोड नहीं की गई थी जहां HTML इंगित कर रहा है, या HTML गलत तरीके से लिखा गया है।
पहली बात यह देखना है कि क्या आप अपनी छवि ऑनलाइन ढूंढ सकते हैं। अधिकांश होस्टिंग प्रदाताओं के पास कुछ प्रकार के प्रबंधन उपकरण होते हैं जिनका उपयोग आप यह देखने के लिए कर सकते हैं कि आपने अपनी छवियां कहां अपलोड की हैं। यह सोचने के बाद कि आपके पास अपनी छवि के लिए सही URL है, इसे अपने ब्राउज़र में टाइप करें। यदि छवि दिखाई देती है, तो आपके पास सही स्थान है।
फिर जांचें कि आपका HTML उस छवि की ओर इशारा कर रहा है। ऐसा करने का सबसे आसान तरीका पेस्ट करना है छवि यूआरएल कि आपने अभी-अभी SRC विशेषता में परीक्षण किया है। पृष्ठ को फिर से अपलोड करें और परीक्षण करें।
आपके इमेज टैग की SRC विशेषता कभी भी शुरू नहीं होनी चाहिए सी:\ या फ़ाइल: जब आप अपने कंप्यूटर पर अपने वेब पेज का परीक्षण करते हैं तो ये काम करने लगते हैं, लेकिन आपकी साइट पर आने वाले सभी लोगों को एक टूटी हुई छवि दिखाई देगी। ऐसा इसलिए है क्योंकि C:\ किसी स्थान की ओर इशारा करता है तो आप का हार्ड ड्राइव। चूंकि छवि आपकी हार्ड ड्राइव पर है, जब आप इसे देखते हैं तो यह प्रदर्शित होती है, लेकिन यह किसी और के लिए नहीं होगी।