HTML IMG ట్యాగ్ వెబ్ పేజీలో చిత్రాలు మరియు ఇతర స్టాటిక్ గ్రాఫికల్ వస్తువులు చొప్పించడాన్ని నియంత్రిస్తుంది. ఈ సాధారణ ట్యాగ్ ఒక ఆకర్షణీయమైన, ఇమేజ్-ఫోకస్ చేసిన వెబ్సైట్ని రూపకల్పన చేసే మీ సామర్థ్యానికి గొప్పతనాన్ని జోడించే పలు తప్పనిసరి మరియు ఐచ్ఛిక లక్షణాలను అందిస్తుంది.
ఒక పూర్తిగా ఏర్పడిన HTML IMG ట్యాగ్ యొక్క ఒక ఉదాహరణ ఇలా కనిపిస్తుంది:
అవసరమైన IMG ట్యాగ్ గుణాలు
SRC.మీరు ఒక వెబ్ పేజీలో ప్రదర్శించడానికి ఒక చిత్రం పొందడానికి మాత్రమే లక్షణం SRC లక్షణం. ఈ లక్షణం ప్రదర్శించబడే ప్రతిబింబ ఫైలు పేరు మరియు స్థానం గుర్తిస్తుంది.
ALT.చెల్లుబాటు అయ్యే XHTML మరియు HTML4 రాయడానికి, ది ALT లక్షణం కూడా అవసరం. ఈ విశేషణం చిత్రం వివరిస్తుంది టెక్స్ట్ తో కాని వినూత్న బ్రౌజర్లు అందించడానికి ఉపయోగిస్తారు. బ్రౌజర్లు ప్రత్యామ్నాయ పాఠాన్ని వివిధ మార్గాల్లో ప్రదర్శిస్తాయి. చిత్రంపై మీ మౌస్ను ఉంచినప్పుడు కొందరు దీనిని పాప్-అప్గా ప్రదర్శిస్తారు, ఇతరులు మీరు చిత్రంపై కుడి క్లిక్ చేసినప్పుడు లక్షణాల్లో దాన్ని ప్రదర్శిస్తారు మరియు కొంతమంది దీనిని ప్రదర్శించరు.
వెబ్ పేజీ యొక్క పాఠ్యానికి సంబంధించని లేదా ముఖ్యమైనవి లేని చిత్రం గురించి అదనపు వివరాలను అందించడానికి alt టెక్స్ట్ను ఉపయోగించండి. కానీ స్క్రీన్ రీడర్లు మరియు ఇతర టెక్స్ట్ మాత్రమే బ్రౌజర్లు, టెక్స్ట్ పేజీ మిగిలిన టెక్స్ట్ తో ఇన్లైన్ చదవబడుతుంది గుర్తుంచుకోవాలి. గందరగోళాన్ని నివారించడానికి, కేవలం "లోగో" కు బదులుగా "వెబ్ డిజైన్ అండ్ HTML గురించి" (ఉదాహరణకు), వివరణాత్మక alt టెక్స్ట్ను ఉపయోగించండి.
HTML5 లో ALT మీరు మరింత వివరణని జోడించడానికి శీర్షికను ఉపయోగించవచ్చు ఎందుకంటే లక్షణం ఎల్లప్పుడూ అవసరం లేదు. మీరు లక్షణాన్ని కూడా ఉపయోగించవచ్చు ARIA-DESCRIBEDBY పూర్తి వివరాలను కలిగి ఉన్న ID ని సూచించడానికి.
ఇమేజ్ పూర్తిగా అలంకరించబడినట్లయితే Alt టెక్స్ట్ కూడా అవసరం లేదు, వెబ్ పేజీ లేదా చిహ్నాల ఎగువ భాగంలో గ్రాఫిక్ వంటివి. కానీ మీరు ఖచ్చితంగా తెలియకపోతే, కేవలము కేవలము alt text ను చేర్చండి.
సిఫార్సు చేసిన IMG గుణాలు
వెడల్పు మరియు ఎత్తు. మీరు ఎప్పుడూ ఉపయోగించుకునే అలవాటులోకి రావాలి వెడల్పు మరియు ఎత్తు గుణాలు. మరియు మీరు ఎల్లప్పుడూ నిజమైన పరిమాణాన్ని ఉపయోగించాలి మరియు మీ చిత్రాలను బ్రౌజర్తో పునఃపరిమాణం చేయకూడదు.
ఈ లక్షణం పేజీ యొక్క రెండరింగ్ను వేగవంతం చేస్తుంది ఎందుకంటే బ్రౌజర్ ప్రతిబింబం కోసం స్థలంలో కేటాయించగలదు, ఆపై మొత్తం చిత్రం డౌన్లోడ్ కోసం ఎదురుచూడకుండా, మిగిలిన కంటెంట్ను డౌన్లోడ్ చేయడాన్ని కొనసాగించండి.
ఇతర ఉపయోగకరమైన IMG గుణాలు
TITLE. లక్షణం ఏ HTML మూలకానికి వర్తించగల ప్రపంచ లక్షణం. అంతేకాదు TITLE లక్షణం మీరు చిత్రం గురించి అదనపు సమాచారాన్ని జోడించడానికి అనుమతిస్తుంది.
చాలా బ్రౌజర్లు మద్దతు TITLE లక్షణం, కానీ వారు వివిధ మార్గాల్లో అది. కొంతమంది పాప్-అప్గా టెక్స్ట్ను ప్రదర్శిస్తున్నప్పుడు ఇతరులు తెరపై కుడి-క్లిక్ చేసినప్పుడు ఇతరులు దీనిని తెరపై ప్రదర్శిస్తారు. మీరు ఉపయోగించవచ్చు TITLE చిత్రం గురించి అదనపు సమాచారం రాయడానికి లక్షణం, కానీ ఈ సమాచారం దాగి ఉండటం లేదు లేదా కనిపించే. శోధన ఇంజిన్ల కోసం కీలక పదాలను దాచడానికి మీరు దీన్ని ఖచ్చితంగా ఉపయోగించకూడదు. ఈ అభ్యాసం ఇప్పుడు చాలా శోధన ఇంజిన్ల ద్వారా జరిమానా విధించబడుతుంది.
USEMAP మరియు ISMAP. ఈ రెండు లక్షణాలను మీ చిత్రాలకు క్లయింట్-వైపు () మరియు సర్వర్-వైపు (ISMAP) చిత్రం మ్యాప్లను సెట్ చేస్తుంది.
longdesc. లక్షణం URL యొక్క పొడవైన వివరణకు URL లకు మద్దతు ఇస్తుంది. ఈ ఫీచర్ మీ చిత్రాలను మరింత అందుబాటులోకి తెస్తుంది.
నిరాశ మరియు వాడుకలో లేని IMG గుణాలు
అనేక లక్షణాలను ఇప్పుడు HTML5 లో వాడుకలో లేదా HTML4 లో డీప్రికేటెడ్ చేయబడ్డాయి. ఉత్తమ HTML కోసం, మీరు ఈ లక్షణాలను ఉపయోగించి బదులుగా ఇతర పరిష్కారాలను కనుగొనాలి.
BORDER. లక్షణం చిత్రం చుట్టూ ఏ సరిహద్దులో పిక్సెల్స్లో వెడల్పును నిర్వచిస్తుంది. ఇది HTML4 లో CSS కు అనుకూలంగా తీసిపోయింది మరియు HTML5 లో వాడుకలో ఉంది.
align. ఈ లక్షణం మీరు టెక్స్ట్ లోపల ఒక చిత్రం ఉంచడానికి మరియు దాని చుట్టూ టెక్స్ట్ ప్రవాహం కలిగి అనుమతిస్తుంది. మీరు ఒక చిత్రం కుడి లేదా ఎడమకు సమలేఖనం చేయవచ్చు. ఇది HTML4 లో ఫ్లోట్ CSS ఆస్తికి అనుకూలంగా నిలిపివేయబడింది మరియు HTML5 లో వాడుకలో ఉంది.
hspace మరియు vspace. ది hspace మరియు vspace లక్షణాలను తెలుపు స్థలం అడ్డంగా చేర్చండి (hspace) మరియు నిలువుగా (vspace). గ్రాఫిక్ (ఎగువ మరియు దిగువ లేదా ఎడమ మరియు కుడి) రెండింటికీ వైట్ స్పేస్ జోడించబడుతుంది, కాబట్టి మీరు ఒక వైపున స్పేస్ అవసరం అయితే, మీరు CSS ను ఉపయోగించాలి. ఈ లక్షణాలు HTML4 లో మార్జిన్ CSS ఆస్తికి అనుకూలంగా నిలిపివేయబడ్డాయి మరియు అవి HTML5 లో వాడుకలో ఉన్నాయి.
LOWSRC. ది LOWSRC మీ ఇమేజ్ మూలం చాలా నెమ్మదిగా డౌన్ లోడ్ అయ్యేటప్పుడు లక్షణం ఒక ప్రత్యామ్నాయ చిత్రాన్ని అందిస్తుంది. ఉదాహరణకు, మీరు మీ వెబ్ పేజీలో ప్రదర్శించాలని కోరుకుంటున్న 500KB చిత్రం ఉండవచ్చు, కానీ 500KB డౌన్లోడ్ చేయడానికి చాలా కాలం పడుతుంది. సో మీరు చిత్రం యొక్క చాలా చిన్న కాపీని సృష్టించడానికి, బహుశా నలుపు మరియు తెలుపు లేదా కేవలం చాలా ఆప్టిమైజ్, మరియు ఆ లో ఉంచండి LOWSRC గుణం. చిన్న చిత్రం మొదటి డౌన్ లోడ్ చేసి ప్రదర్శిస్తుంది, ఆపై పెద్ద చిత్రం కనిపించినప్పుడు తక్కువ మూలం ఒకటి భర్తీ చేస్తుంది.
ది LOWSRC లక్షణం Netscape Navigator 2.0 కు జోడించబడింది IMG ట్యాగ్. ఇది DOM స్థాయి 1 లో భాగంగా ఉంది కానీ DOM స్థాయి 2 నుండి తొలగించబడింది. ఈ లక్షణం కోసం బ్రౌజర్ మద్దతు స్కెచ్కి ఉంది, అయినప్పటికీ అన్ని ఆధునిక బ్రౌజర్లచే మద్దతు ఇవ్వబడుతుందని అనేక సైట్లు పేర్కొన్నాయి. ఇది HTML4 లో డీప్రికేటెడ్ చేయబడలేదు లేదా HTML5 లో వాడుకలో లేనిది కాదు, ఎందుకంటే ఇది అధికారిక భాగం గాని వివరణాత్మక భాగం కాదు.
ఈ లక్షణాన్ని ఉపయోగించడం మానుకోండి మరియు బదులుగా మీ చిత్రాలను ఆప్టిమైజ్ చేయండి, తద్వారా అవి వేగంగా లోడ్ అవుతాయి. పేజీ లోడింగ్ వేగవంతం మంచి వెబ్ డిజైన్ యొక్క కీలకమైన భాగం, మరియు పెద్ద చిత్రాలు నెమ్మదిగా డౌన్ నెమ్మదిగా పేజీలు-మీరు ఉపయోగిస్తున్నప్పటికీ LOWSRC గుణం.
