వెబ్సైట్లు వాటి ముందు వచ్చిన సమాచార ప్రసారం మాదిరిగా కాకుండా. ముద్రణ, రేడియో, మరియు టెలివిజన్ వంటి మునుపటి మీడియా ఫార్మాట్ ల నుండి వేరుగా వున్న వెబ్సైట్లు సెట్ చేసే ప్రధాన విషయాలలో ఒకటి " హైపర్లింక్ " అనే భావన.
సాధారణంగా "లింకులు" అని పిలువబడే హైపర్ లింక్లు, వెబ్ను ఎంతగానో డైనమిక్ చేస్తుంది. మరొక వ్యాసం లేదా ఇతర వనరులను ప్రస్తావించే ముద్రిత ప్రచురణ వలె కాకుండా, వెబ్సైట్లు ఈ లింక్లను వాస్తవానికి సందర్శకులు ఇతర వనరులను మరియు వనరులను పంపేందుకు ఉపయోగించవచ్చు. ఇతర ప్రసార మాధ్యమం చేయలేము. మీరు రేడియోలో లేదా టీవీలో వీక్షించగల ప్రకటనను వినవచ్చు, కాని ఆ వెబ్ సైట్ సులభంగా చేయగల విధంగా ఆ ప్రకటనలలోని కంపెనీలకు మిమ్మల్ని పంపే హైపర్ లింక్లు లేవు. లింకులు నిజంగా అద్భుతమైన సమాచార మరియు పారస్పరిక ఉపకరణం!
తరచుగా, వెబ్సైట్లో కనిపించే లింకులు అదే సైట్ యొక్క ఇతర పేజీలకు సందర్శకులను దర్శించే టెక్స్ట్ కంటెంట్. ఒక వెబ్ సైట్ యొక్క నావిగేషన్ అనేది ఆచరణలో టెక్స్ట్ లింకులకు ఒక ఉదాహరణ, కానీ లింకులను టెక్స్ట్-ఆధారితం అవసరం లేదు. మీరు సులభంగా మీ వెబ్సైట్లో చిత్రాలను లింక్ చేయవచ్చు. ఇది ఎలా జరుగుతుందో చూద్దాం, తర్వాత మీరు చిత్రం-ఆధారిత హైపర్లింక్లను ఉపయోగించాలనుకుంటున్న కొన్ని సందర్భాల్లో చూద్దాం.
ఒక చిత్రం లింక్ ఎలా
మీరు చేయవలసినది మొదటి విషయం మీ HTML పత్రంలో ఇమేజ్ని ఉంచడం. చిత్రం-ఆధారిత లింక్ యొక్క సాధారణ ఉపయోగం సైట్ యొక్క లోగో గ్రాఫిక్, ఇది సైట్ యొక్క హోమ్పేజీకి తిరిగి లింక్ చేయబడుతుంది. క్రింద ఉన్న మా ఉదాహరణ కోడ్లో, మేము ఉపయోగిస్తున్న ఫైల్ మా లోగో కోసం SVG . ఇది మా చిత్రం వివిధ తీర్మానాలు కోసం కొలవటానికి అనుమతిస్తుంది ఎందుకంటే, ఇది ఒక మంచి ఎంపిక ఉంది, అన్ని సమయం నాణ్యత నిర్వహించడం మరియు ఒక చిన్న మొత్తం పరిమాణం.
మీరు HTML పత్రంలో మీ చిత్రాన్ని ఎలా ఉంచాలో ఇక్కడ ఉంది:
చిత్రం ట్యాగ్ చుట్టూ, మీరు ఇప్పుడు యాంకర్ లింక్ను జోడించి, చిత్రం ముందు యాంకర్ మూలకాన్ని తెరిచి చిత్రం తర్వాత యాంకర్ను మూసివేస్తారు. మీరు టెక్స్ట్ను ఎలా లింక్ చేస్తారో అదే విధంగా ఉంటుంది, బదులుగా మీరు యాంకర్ ట్యాగ్లతో లింక్ చేయాలనుకుంటున్న పదాలను కత్తిరించేటప్పుడు, మీరు చిత్రాన్ని మూసివేయాలి. క్రింద మా ఉదాహరణలో, మేము "index.html" ఇది మా సైట్ యొక్క హోమ్ పేజీకి లింక్ చేస్తున్నాము.
ఈ పేజీని మీ పేజీకి జోడించేటప్పుడు, యాంకర్ ట్యాగ్ మరియు ఇమేజ్ ట్యాగ్ మధ్య ఖాళీలు ఉంచవద్దు. మీరు ఇలా చేస్తే, కొన్ని బ్రౌజర్లు చిత్రం పక్కన చిన్న పేలులను కలిగి ఉంటాయి, ఇది బేసి కనిపిస్తుంది.
లోగో చిత్రం ఇప్పుడు కూడా ఒక హోమ్ బటన్గా పని చేస్తుంది, ఇది ఈ రోజుల్లో అందంగా చాలా వెబ్ ప్రమాణం. మేము మా HTML మార్కప్లో చిత్రం యొక్క వెడల్పు మరియు ఎత్తు వంటి దృశ్య శైలులను కలిగి ఉండవని గమనించండి. మేము ఈ దృశ్య శైలులను CSS కు వదిలి, HTML నిర్మాణం మరియు CSS శైలుల యొక్క క్లీన్ విభజనను నిర్వహిస్తాము.
ఒకసారి మీరు CSS కు, మీరు ఈ లోగో గ్రాఫిక్ లక్ష్యంగా వ్రాయడానికి శైలులు బహుళ పరికర స్నేహపూర్వక చిత్రాలు అలాగే మీరు సరిహద్దులు లేదా CSS వంటి చిత్రం / లింక్ జోడించడానికి ఇష్టం ఏ విజువల్స్ కోసం బాధ్యతాయుతంగా శైలులు , డ్రాప్ షాడోస్. మీరు మీ CSS శైలులతో ఉపయోగించడానికి అదనపు "హుక్స్" అవసరమైతే మీ చిత్రం ఇవ్వండి లేదా తరగతి లక్షణాన్ని లింక్ చేయవచ్చు.
చిత్రం లింకులు కోసం కేసులు ఉపయోగించండి
కాబట్టి ఒక చిత్రం లింక్ జోడించడం అందంగా సులభం. మేము ఇప్పుడే చూసినట్లుగా, మీరు తప్పనిసరిగా అన్నింటినీ తగిన యాంకర్ ట్యాగ్లతో చిత్రీకరించాలి. మీ తర్వాతి ప్రశ్న "పైన పేర్కొన్న లోగో / హోమ్పేజీ లింక్ ఉదాహరణతో పాటుగా మీరు నిజంగా దీన్ని ఎప్పుడు చేస్తారు?"
ఇక్కడ కొన్ని ఆలోచనలు ఉన్నాయి:
- ఆ చిత్రాల పెద్ద సంస్కరణలకు లింకున్న ఒక గ్యాలరీలో కూర్పు చిత్రాలు.
- ఒక e- కామర్స్ వెబ్సైట్ కోసం ఉత్పత్తి ఫోటోల వంటి కంటెంట్ను సూచించడానికి మాత్రమే ఉపయోగించబడే చిత్రాలు.
- బ్లాగ్ వ్యాసం లేదా ప్రెస్ రిలీజ్ వంటి ఇతర కంటెంట్లో భాగమైన టీజర్ చిత్రాలు, ఆ కంటెంట్ని గమనించడానికి ప్రజలకు ప్రవేశాన్ని కల్పించడం ద్వారా పూర్తి కథనాన్ని చదవడానికి లేదా క్లిక్ చేయడానికి వారికి లక్ష్యంగా ఇవ్వండి.
- నిర్దిష్ట కార్యాచరణ లేదా సైట్లోని పేజీలకు కనెక్ట్ చేయడానికి బటన్లుగా ఉపయోగించిన చిహ్నం చిత్రాలు.
- ఆ సైట్ లేదా కంపెనీకి ముఖ్యమైన వివిధ సామాజిక మీడియా సైట్ల గుర్తించదగిన చిహ్నాలను ఉపయోగించే సోషల్ మీడియా లింకులు.
- రూపం సమర్పణలు వంటి కొన్ని కార్యాచరణ కోసం బటన్లు ఉపయోగిస్తారు చిత్రాలు (ఉత్తమ పద్ధతులు గమనిక - ఒక వెబ్ సైట్ పనితీరు కోణం నుండి, CSS పూర్తిగా శైలి బటన్లు చిత్రం బటన్లు కంటే మెరుగైన ఎంపిక ఉన్నాయి).
చిత్రాలు ఉపయోగించినప్పుడు ఒక రిమైండర్
వెబ్ సైట్ యొక్క విజయాలలో చిత్రాలు ముఖ్యమైన పాత్ర పోషిస్తాయి. పైన పేర్కొన్న ఉదాహరణలు ఒకటి, ఇతర విషయాలతోపాటు, కంటెంట్ను దృష్టికి తీసుకురావడానికి మరియు ప్రజలను చదివేందుకు ఇతర అంశాలతో పాటు ఉపయోగించడం.
చిత్రాలను ఉపయోగిస్తున్నప్పుడు, మీరు మీ అవసరాలకు సరైన చిత్రాన్ని ఎంచుకోవడంలో జాగ్రత్త వహించాలి, సరైన చిత్రం విషయం, ఫార్మాట్ మరియు మీరు మీ వెబ్ సైట్ లో ఉపయోగించే ఏ చిత్రాలను సరిగ్గా వెబ్సైట్ డెలివరీ కోసం ఆప్టిమైజ్ చేస్తారో చూసుకోవాలి . ఈ చిత్రాలు చాలా జోడించడానికి పని చాలా అనిపించవచ్చు ఉండవచ్చు, కానీ చెల్లింపు అది విలువ! చిత్రాలు నిజంగా ఒక సైట్ విజయం చాలా జోడించవచ్చు.
మీ సైట్లో సముచితమైన చిత్రాలను ఉపయోగించడానికి సంకోచించవద్దు మరియు మీ కంటెంట్కు పరస్పరం జోడించడం కోసం అవసరమైనప్పుడు ఆ చిత్రాలను లింక్ చేయవద్దు, కానీ ఈ చిత్రం ఉత్తమ అభ్యాసాలను గుర్తుంచుకోండి మరియు మీ వెబ్ డిజైన్ పనిలో సరిగ్గా మరియు బాధ్యతాయుతంగా ఈ గ్రాఫిక్స్ / లింక్లను ఉపయోగించండి.