वेबसाइटहरू तिनीहरूका सामुन्ने कुनै संचार माध्यमको विपरीत हुन्। प्रिन्ट, रेडियो, र भित्री टेलिभिजन जस्ता अघिल्लो मिडिया ढाँचाहरू बाहेक वेबसाइटहरू सेट गर्ने मुख्य चीजहरू " हाइपरलिङ्क " को अवधारणा हो।
हाइपरलिंकहरू, सामान्यतया "लिङ्कहरू" को रूपमा पनि चिनिन्छन्, के यसले वेबलाई गतिशील बनाउँछ। एक प्रकाशित लेखको विपरीत जुन अर्को आलेख वा अन्य स्रोत सन्दर्भ गर्न सक्छ, वेबसाइटहरू वास्तवमा ती अन्य पृष्ठहरू र स्रोतहरूलाई दर्शकहरूलाई पठाउन यी लिंकहरू प्रयोग गर्न सक्छन्। कुनै अन्य प्रसारण माध्यमले यो गर्न सक्दैन। तपाईं रेडियोमा विज्ञापन सुन्न सक्नुहुनेछ वा टिभीमा हेर्न सक्नुहुन्छ, तर त्यहाँ हाइपरलिङ्कहरू छैनन् जुन तपाइँले ती विज्ञापनहरूमा कम्पनीहरू लिन सक्नुहुने तरिकाले वेबसाइट सजिलै गर्न सक्दछ। लिङ्कहरू साँच्चै अचम्मको कुराकानी र अन्तरक्रिया उपकरण हुन्!
अक्सर, वेबसाइटमा भेटिएका लिङ्कहरू पाठ सामग्री हुन् जुन आगन्तुकहरूलाई त्यही साइटको अन्य पृष्ठहरूमा दर्शकहरूलाई डोऱ्याउँछ। वेबसाइटको नेभिगेसन एक अभ्यासमा पाठ लिङ्कहरूको एक उदाहरण हो तर लिङ्क पाठ आधारित हुन आवश्यक छैन। तपाईं सजिलै संग छवियों को आफ्नो वेबसाइट मा लिंक गर्न सक्छन्। यो कसरी गर्ने छ भनेर हेर्नुहोस्, केही उदाहरणहरू जहाँ तपाइँ छवि-आधारित हाइपरलिंकहरू प्रयोग गर्न चाहानुहुन्छ।
तस्बिर कसरी लिङ्क गर्ने?
तपाईंले गर्नु पर्छ भन्ने पहिलो कुरा भनेको तपाईंको HTML कागजातमा छवि राख्नु हो। तस्बिर आधारित लिङ्कको सामान्य प्रयोग साइटको लोगो ग्राफिक छ जुन पछिको गृहपृष्ठमा लिङ्क भएको छ। तल हाम्रो उदाहरण कोडमा, हामीले प्रयोग गरिरहनुभएको फाइल हाम्रो लोगोको लागि SVG हो । यो एक राम्रो छनौट हो किनभने यसले हाम्रो छविलाई विभिन्न रिजोल्युशनहरूको लागि विस्तार गर्न अनुमति दिन्छ, सबै समय छवि गुणस्तर र सानो आकारको फाइल साइजको आकारमा।
यहाँ छ तपाईको HTML छविमा तपाईँले कसरी छवि पाउनुहुनेछ:
छवि ट्यागको वरिपरि, अब तपाई एंकर लिङ्क थप्नु भएको छ, छवि भन्दा पहिले एंकर तत्व खोल्न र छवि पछि एंकर बन्द गर्नुपर्नेछ। यो तपाईं कसरी पाठ लिङ्क गर्न सक्नुहुन्छ जस्तो छ, केवल ती शब्दहरूलाई लंगर ट्यागसँग लिङ्क गर्न चाहने शब्दहरू लुकाउनुको सट्टा, तपाईं छवि लपेटो। तल हाम्रो उदाहरणमा, हामी हाम्रो साइटको होमपेजमा लिंक गर्दैछौं, जुन "index.html" हो।
यस पृष्ठमा यो एचटीएमएल थप्दा, लंगर ट्याग र छवि ट्याग बीच कुनै स्थानहरू नदिनुहोस्। यदि तपाइँ गर्नुहुन्छ भने, केही ब्राउजरले छविको छेउमा सानो टिक्स थप्नेछ, जुन अजीब देखिन्छ।
लोगो छविले अब गृहपृष्ठ बटनको रूपमा कार्य गर्नेछ, जुन ती दिनहरू एकदम धेरै वेब मानक हो। याद गर्नुहोस् कि हामी कुनै पनि दृश्य शैलीहरू समावेश गर्दैनौं, जस्तै छविको चौडाइ र उचाइ, हाम्रो HTML मार्कअपमा। हामी यी भिजुअल शैलीहरू CSS मा छोड्छौं र एचटीएमएल संरचना र सीएसएस शैलियहरूको सफा विभाजन राख्दछौं।
जब तपाईं सीएसएसमा जानुहुन्छ, तपाईले यो लोगोलाई लक्षित गर्न शैलीहरू लेख्नु भएको छ ग्राफिकले छवि साइजिंग समावेश गर्न सक्दछ, जसमा बहु-अनुकूल मैनुअल तस्बिरहरू र साथमा कुनै पनि भिजुअलहरू जुन छवि / लिंक, सिमाना वा सीएसएसमा थप्न मनपर्छ। छाया छाया। तपाइँले तपाइँको छवि दिन सक्नुहुनेछ वा एक क्लास विशेषता लिङ्क गर्न सक्नुहुनेछ यदि तपाईले "CSS" लाई तपाईको CSS शैलीहरू प्रयोग गर्न आवश्यक छ।
छवि लिङ्कहरूको लागि कारणहरू प्रयोग गर्नुहोस्
त्यसैले तस्बिर लिङ्क थप्न सजिलो छ। हामीले भर्खरै हेरेका छौं, तपाईले सबैले गर्नु पर्छ उपयुक्त एंकर ट्यागको साथ छवि लपेटा। तपाईंको अर्को प्रश्न हुन सक्छ "aforementioned लोगो / होमपेज लिङ्क उदाहरण को बावजूद तपाईं वास्तव मा यो अभ्यास मा गर्नेछ?"
यहाँ केही विचारहरू छन्:
- ग्यालरीमा थंबनेल छविहरू जुन ती तस्बिरहरूको ठूलो संस्करणसँग लिङ्क।
- छविहरू इ-वाणिज्य वेबसाइटको लागि सामग्री फोटोहरू जस्तै सामग्री प्रतिनिधित्व गर्न एक्लो प्रयोग गरिन्छ।
- टिजर तस्बिरहरू अन्य सामग्रीको भाग हो, ब्लग लेख जस्ता वा रिलीज थिच्नुहोस्, जसले व्यक्तिहरूलाई सामग्रीलाई सूचना दिन पूर्ण लेख पढ्न ट्याप वा क्लिक गर्न लक्षित क्षेत्र दिन्छ।
- आकृति छविहरू जुन साइटमा निर्दिष्ट प्रकार्यता वा पृष्ठहरूमा जडान गर्न बटनहरूको रूपमा प्रयोग गरिन्छ।
- सोशल मिडिया लिङ्कहरू जुन विभिन्न सामाजिक मिडिया साइटहरूको पहिचानयोग्य लोगो प्रयोग गर्दछ जुन साइट वा कम्पनीको लागि महत्त्वपूर्ण छ।
- छविहरू केहि प्रकार्यताका लागि बटनहरू रूपमा प्रयोग गरे जस्तै फारम सबमिशनहरू (उत्तम अभ्यासहरू टिप्पणी - वेबसाइट प्रदर्शनको परिप्रेक्ष्यबाट, सीएसएससँग शुद्ध रूपमा बटन बटन छवि बटन भन्दा राम्रो विकल्प हो)।
तस्बिरहरू प्रयोग गर्दा एक अनुस्मारक
चित्रहरूले वेबसाइटको सफलतामा महत्त्वपूर्ण भूमिका खेल्न सक्छ। माथि उल्लिखित उदाहरण मध्ये एउटा उदाहरण छ कि अन्य सामग्री संग छ कि सामाग्री मा ध्यान आकर्षित गर्न को लागी छवियों को उपयोग गरेर मान्छे को यसलाई पढ्न को लागि।
छविहरू प्रयोग गर्दा, तपाइँका आवश्यकताहरूको लागि सही छवि चयन गर्न मनपर्ने हुनुपर्दछ, यसले सही छवि विषय, ढाँचा समावेश गर्दछ र यो पनि सुनिश्चित गर्दछ कि तपाइँले तपाइँको वेबसाइटमा प्रयोग गर्ने कुनै छविहरू ठीकसँग वेबसाइट वितरणको लागि अनुकूलित छन्। यो छविहरू थप्न धेरै कामहरू लाग्न सक्छ, तर भुक्तानी यसको लायक छ जस्तो लाग्छ! छविहरू साँच्चै साइटको सफलतामा धेरै थप्न सक्दछ।
तपाईंको साइटमा उपयुक्त छविहरू प्रयोग गर्न संकोच नगर्नुहोस् र ती छविहरूलाई तपाईंको सामग्रीमा केही अन्तरक्रियात्मक रूपमा थप्न आवश्यक पर्दछ, तर यी छविहरूको पनि राम्रो अभ्यासहरू विचार गर्नुहोस् र यी ग्राफिक्सहरू / लिङ्कहरू सही रूपमा र उत्तरदायी रूपमा तपाईंको वेब डिजाइन कार्यमा प्रयोग गर्नुहोस्।