वेबसाइट त्यांच्या आधी आलेल्या कोणत्याही संप्रेषण माध्यमापेक्षा वेगळ्या आहेत. पूर्वीच्या माध्यम स्वरुपे, जसे प्रिंट, रेडिओ आणि अगदी टेलिव्हिजन व्यतिरिक्त वेबसाईट सेट केलेले मुख्य गोष्टी " हायपरलिंक " ची संकल्पना आहे.
हायपरलिंक्स, जे सामान्यतः फक्त "दुवे" म्हणून ओळखले जातात, ते वेब इतके गतिमान कसे बनवतात अन्य लेख किंवा इतर स्त्रोत संदर्भित करू शकणार्या छापील प्रकाशनाप्रमाणे, वेबसाइट या दुवे वापरु शकता त्या अभ्यागतांना त्या इतर पृष्ठांना आणि संसाधनांना पाठवू शकता. इतर प्रसार माध्यमे माध्यमाने हे करू शकत नाही. आपण रेडिओवर एक जाहिरात ऐकू शकता किंवा टीव्हीवर पाहू शकता, परंतु त्या जाहिरातींमध्ये असलेल्या कंपन्यांना आपणास ज्या वेबसाइटवर सहज करू शकतात अशा हायपरलिंक नाहीत. दुवे खरोखर एक आश्चर्यकारक संवाद आणि संवाद साधन आहेत!
बर्याचदा, वेबसाइटवर आढळणारे दुवे मजकूर सामग्री असतात ज्या अभ्यागतांना त्याच साइटच्या इतर पृष्ठांना निर्देश करतात. एक वेबसाइट नेव्हिगेशन सराव मध्ये मजकूर दुवे एक उदाहरण आहे पण दुवे मजकूर आधारित करणे आवश्यक नाही आपण आपल्या वेबसाइटवर देखील प्रतिमा सहजपणे लिंक करू शकता. हे कसे केले जाते ते पहा, नंतर काही उदाहरणे जिथे आपण प्रतिमा-आधारित हायपरलिंक चा वापर करु इच्छिता.
कसे एक प्रतिमा दुवा साधा
सर्वप्रथम आपल्या HTML दस्तऐवजात ही प्रतिमा ठेवणे आवश्यक आहे. प्रतिमा-आधारित लिंकचा सामान्य वापर साइटचा लोगो ग्राफिक आहे जो नंतर साइटच्या मुख्यपृष्ठावर परत जोडला जातो. आमच्या उदाहरण खाली दिलेल्या कोडमध्ये, आपण वापरत असलेली फाईल आमच्या लोगोसाठी एसव्हीजी आहे. हे चांगले पर्याय आहे कारण ते आमच्या प्रतिमेला वेगवेगळ्या रिजोल्यूशनसाठी स्केल करण्याची परवानगी देतात, तर प्रतिमा गुणवत्ता आणि एक छोटा समग्र फाईल आकार राखून ठेवेल.
आपण आपली प्रतिमा HTML दस्तऐवजात कसे ठेवाल ते येथे आहे:
प्रतिमा टॅग सुमारे, आपण आता अँकर लिंक जोडा होईल, प्रतिमा आधी अँकर घटक उघडणे आणि प्रतिमा नंतर अँकर बंद. हे आपण मजकूर कसे जोडाल त्याचप्रमाणेच आहे, फक्त आपण अँकर टॅगसह एक दुवा बनवू इच्छित शब्द ओघ करण्याऐवजी, आपण प्रतिमा लपेटो. आमच्या उदाहरण खाली, आम्ही आमच्या साइटच्या मुख्यपृष्ठावर परत जोडत आहोत, जे "index.html" आहे
आपल्या पृष्ठावर हे HTML जोडताना, अँकर टॅग आणि प्रतिमा टॅग दरम्यान कोणत्याही जागा ठेवू नका. आपण असे केल्यास, काही ब्राउझर प्रतिमा बाजूला बरीच छोटी ticks जोडेल, विचित्र दिसेल जे.
लोगो प्रतिमा आता मुख्यपृष्ठ बटण म्हणून कार्य करेल, जे आजकाल खूपच एक वेब मानक आहे. लक्षात घ्या की आपल्या HTML मार्कअप मध्ये आपण कोणत्याही व्हिज्युअल स्टाईल समाविष्ट करत नाही, जसे की इमेजची रूंदी आणि उंची. आम्ही हे व्हिज्युअल स्टाइल CSS वर सोडा आणि HTML रचना आणि CSS शैलीचे वेगळे वेगळेपण ठेवू.
एकदा आपण CSS वर आला की, आपण या लोगोच्या ग्राफिकवर लक्ष्य करण्यासाठी लिहिलेल्या शैलीमध्ये मल्टी-डिव्हाइस-अनुकूल प्रतिमांसाठी प्रतिसाद शैलीसह प्रतिमा / दुवा जसे बॉर्डर किंवा सीएसएस जोडणे आपल्याला आवडते अशा कोणत्याही व्हिज्युअलसह प्रतिमा इमेज करणे समाविष्ट होऊ शकते सावल्या ड्रॉप करा आपण आपल्या सीएसएस शैलीसह वापरण्यासाठी अतिरिक्त "hooks" ची आवश्यकता असल्यास आपण आपली इमेज देखील देऊ शकता किंवा क्लास ऍट्रिब्यूट लिंक करू शकता.
प्रतिमा दुवे साठी प्रकरणांचा वापर करा
त्यामुळे एक प्रतिमा दुवा जोडणे खूपच सोपे आहे. जसे आपण आत्ताच बघितले आहे तेंव्हा आपण नेमके असेच योग्य अँकर टॅगसह प्रतिमा लपेटणे आवश्यक आहे. आपला पुढील प्रश्न असू शकेल "आपण पूर्वी वरील उल्लेखित लोगो / मुख्यपृष्ठ दुवा उदाहरणात याशिवाय सराव करणार का?"
येथे काही विचार आहेत:
- गॅलरीमध्ये लघुप्रतिमा प्रतिमा ज्या त्या चित्रांच्या मोठ्या आवृत्तीशी जोडतात.
- एखादी ई-कॉमर्स वेबसाइटसाठी उत्पादन फोटो सारखी प्रतिमा दर्शविण्यासाठी वापरली जाणारी प्रतिमा.
- टीझर प्रतिमा ज्या इतर सामग्रीचा भाग आहेत, जसे की ब्लॉग लेख किंवा प्रेस रिलीझ, जे लोक निदर्शनास आणून देतात की ते संपूर्ण सामग्री वाचण्यासाठी टॅप किंवा क्लिक करण्यासाठी एक लक्ष्य क्षेत्र देतात.
- साइटवर असलेल्या विशिष्ट कार्यक्षमता किंवा पृष्ठांवर जोडण्यासाठी बटणे म्हणून वापरले जाणारे चिन्ह प्रतिमा.
- सामाजिक मीडिया दुवे जे त्या साइट किंवा कंपनीसाठी महत्त्व असलेल्या विविध सोशल मिडिया साइटच्या ओळखण्यायोग्य लोगो वापरतात.
- काही कार्यक्षमतेसाठी बटना म्हणून वापरलेली प्रतिमा, जसे की फॉर्म सबमिशन (सर्वोत्तम अभ्यासांच्या नोट - वेबसाइट कार्यप्रदर्शन दृष्टीकोनातून, सीएसएस सह विशिष्ठ केलेल्या बटणे ही प्रतिमा बटणेपेक्षा अधिक चांगली पर्याय आहेत).
प्रतिमा वापरताना स्मरणपत्र
वेबसाइट एखाद्या वेबसाइटच्या यशाने महत्वाची भूमिका बजावू शकतात. उपरोक्त दिलेल्या उदाहरणांपैकी एक म्हणजे त्या सामग्रीवर लक्ष वेधून घेण्यासाठी आणि त्यास वाचण्यासाठी लोकांना इतर सामग्रीसह छायाचित्राचा वापर करून नमूद केले आहे.
प्रतिमा वापरताना, आपण आपल्या गरजेसाठी योग्य प्रतिमा निवडण्यावर लक्ष देण्याची आवश्यकता आहे , यात योग्य प्रतिमा विषय, स्वरुप, आणि आपण आपल्या वेबसाइटवर वापरत असलेल्या कोणत्याही प्रतिमा वेबसाइट वितरणासाठी योग्यरितीने ऑप्टिमाइझ केल्या आहेत हे सुनिश्चित करणे आवश्यक आहे . हे केवळ प्रतिमा जोडण्यासाठी भरपूर काम आहे असे दिसते, परंतु पैसे देणे हे योग्य आहे! प्रतिमा खरंच साइटच्या यशापर्यंत जोडू शकतात
आपल्या साइटवर योग्य प्रतिमेचा वापर करण्यास संकोच करू नका, आणि आपल्या प्रतिमांमधे काही परस्परसंवेदी जोडणे आवश्यक असताना त्या प्रतिमांचा दुवा साधू नका, परंतु ही प्रतिमा सर्वोत्तम सल्ल्यांकडे लक्ष द्या आणि आपल्या वेब डिझाईन कामामध्ये या ग्राफिक्स / दुवे योग्यरित्या आणि जबाबदारीने वापरा.