సాధారణంగా వెబ్ పేజీని సవరించేటప్పుడు మేము అడోబ్ డ్రీమ్వీవర్, కాఫీకప్, బ్లూ ఫిష్ లేదా ఇతర అభివృద్ధి సాధనాల్లో ఒకటి వంటి నిర్దిష్ట ఎడిటింగ్ సాధనాన్ని ఉపయోగిస్తాము. కానీ మనం కలవరపెడుతున్నా లేదా ప్రత్యక్ష పేజీలో ఏదైనా ప్రయత్నించాలనుకుంటే? మన ఎంపిక సాధనంలో పేజీ యొక్క కాపీని తయారు చేసి, దానితో ఆడుకోవచ్చు. లేదా మేము దీన్ని మా వెబ్ బ్రౌజర్లోనే చేయగలం. ఈ ట్యుటోరియల్ మీ బ్రౌజర్లో వెబ్ పేజీని ఎలా సవరించాలో మీకు చూపించబోతోంది.
డెవలపర్ సాధనాలుగా సూచించబడిన, ఫైర్ఫాక్స్ ఫీచర్ను ఇన్స్పెక్ట్ ఎలిమెంట్ అని పిలుస్తుంది, అయితే క్రోమ్ దీనిని ఇన్స్పెక్ట్ అని పిలుస్తుంది. ఎలాగైనా, బ్రౌజర్ మీ డిజైన్ యొక్క షీన్ వెనుకకు చూడటానికి మరియు దానిని నడిపించే కోడ్ను పరిశీలించడానికి ఇది ఒక మార్గం. ఈ లక్షణం బాగా తెలుసు మరియు చాలా ఉపయోగించబడుతుంది. ఫ్లైలో ఆ కోడ్లో మార్పులు చేయగల సామర్థ్యం అంతగా తెలియదు.
మీరు చేసే ఏ మార్పు అయినా సేవ్ చేయబడదు మరియు ఇది ప్రత్యక్షంగా ప్రభావితం కాదు. మీరు మీ డెవలపర్ సాధనంలో పేజీని లోడ్ చేయకూడదనుకుంటే, ఇది ప్రయోగానికి చక్కని మార్గం.
మీ బ్రౌజర్లో ఏదైనా వెబ్ పేజీని సవరించండి
డ్రీమ్వీవర్ మరియు దాని వంటి సాధనాలు అంతర్నిర్మిత బ్రౌజర్ ఎమెల్యూటరును కలిగి ఉంటాయి, ఇది వివిధ బ్రౌజర్లలో డిజైన్ ఎలా ఉంటుందో అనుకరిస్తుంది. అవి అంత మంచివి, అవి ఎల్లప్పుడూ ఖచ్చితమైనవి కావు మరియు మీ డెవలపర్ సాధనంలో అద్భుతంగా కనిపించినవి స్వతంత్ర బ్రౌజర్లో కొద్దిగా భిన్నంగా కనిపిస్తాయని ఒక సైట్ను ప్రారంభించేటప్పుడు మీరు తరచుగా కనుగొంటారు.
సాధారణంగా మీరు సైట్ను అంతర్గత వెబ్ సర్వర్లో ప్రారంభిస్తారు మరియు ఈ కారణంతో ప్రత్యక్ష ప్రసారం చేయడానికి ముందు బ్రౌజర్లో పరీక్షించండి. ఒక పేజీ ఇప్పటికే ప్రత్యక్షంగా ఉంటే లేదా మీరు ఏదైనా ప్రయత్నించాలనుకుంటే, దాన్ని మీ అభివృద్ధి సాధనంలో కాపీ చేసి లోడ్ చేయవలసిన అవసరం లేదు, మీరు బ్రౌజర్ యొక్క డెవలపర్ సాధనాన్ని ఉపయోగించవచ్చు.
నేను ఫైర్ఫాక్స్ని ఉపయోగిస్తాను కాబట్టి దాన్ని ఎలా ఉపయోగించాలో చూపిస్తాను. Chrome అయితే అదే విధంగా ఉంటుంది.
- మీరు మీ బ్రౌజర్లో ప్రయోగాలు చేయాలనుకుంటున్న వెబ్పేజీని తెరవండి.
- పేజీలో ఎక్కడైనా కుడి క్లిక్ చేసి తనిఖీ చేయండి ఎంచుకోండి.
మీ పేజీని రెండు కోడ్లుగా విభజించి కొత్త పేన్ దిగువన కొన్ని కోడ్తో కనిపిస్తుంది. ఈ కోడ్ మీరు ఎంచుకున్న పేజీ యొక్క చోదక శక్తి. దిగువ ట్యాబ్ ఎగువన ఉన్న ట్యాబ్ల నుండి వేర్వేరు పేజీ మూలకాలను ప్రాప్యత చేయవచ్చు. ఉదాహరణకు, ఫైర్ఫాక్స్లో ఇన్స్పెక్టర్, కన్సోల్, డీబగ్గర్, స్టైల్ ఎడిటర్ మరియు మొదలైనవి చూస్తాము.
మీరు మీ కర్సర్ను దిగువ పేన్లోని పంక్తులపై నడుపుతుంటే వెబ్ పేజీ హైలైట్ యొక్క వివిధ భాగాలను మీరు చూస్తారు. హైలైట్ సమయంలో మీరు ఉన్న కోడ్ యొక్క పంక్తి పేజీ యొక్క ఆ భాగాన్ని ప్రభావితం చేసే కోడ్.
- పేజీ ఎలా ఉందో మీరు ఆడాలనుకుంటే, స్టైల్ ఎడిటర్ను ప్రయత్నించండి.
- పేజీ ఎలా పనిచేస్తుందో మీరు ఆడాలనుకుంటే, కన్సోల్ లేదా యాక్సెసిబిలిటీని ప్రయత్నించండి.
- మీరు దోషాలను అరికట్టాలనుకుంటే లేదా సమస్యను పరిష్కరించాలనుకుంటే, కన్సోల్ లేదా డీబగ్గర్ ఉపయోగించండి
ఆన్సైట్ SEO కోసం పనితీరు ఉపయోగపడుతుంది కాని మెమరీ, నెట్వర్క్ మరియు నిల్వ అంతగా ఉపయోగించబడవు.
గుర్తుంచుకోండి, మీరు మీకు నచ్చిన విధంగా డెవలపర్ సాధనాలలో గందరగోళానికి గురిచేయవచ్చు మరియు ఇది సైట్ను ప్రభావితం చేయదు. మీ వ్యక్తిగత బ్రౌజర్లో పేజీ ఎలా ప్రదర్శించబడుతుందో మాత్రమే మార్పులు చేయబడతాయి, మీరు వెబ్సైట్ను కూడా ప్రభావితం చేయరు. మీరు సాధనాన్ని మూసివేసిన తర్వాత, అన్ని మార్పులు పోతాయి.
పేజీకి మార్పులు చేస్తోంది
అసలు వెబ్సైట్ను ప్రభావితం చేయకుండా మీకు నచ్చినదాన్ని మార్చవచ్చని ఇప్పుడు మీకు తెలుసు, కొంచెం ఆనందించండి. మీరు సవరించదలిచిన పేజీలోని ఒక మూలకాన్ని కనుగొనండి. మీరు ఫాంట్, ఫాంట్ రంగు, నేపథ్య చిత్రం లేదా మీకు నచ్చినదాన్ని మార్చవచ్చు. ఈ ఉదాహరణ కోసం, నేను బ్యానర్ శీర్షిక యొక్క ఫాంట్ రంగును మార్చబోతున్నాను.
- మీరు మార్చదలిచిన ఖచ్చితమైన మూలకాన్ని కుడి క్లిక్ చేసి తనిఖీ చేయండి ఎంచుకోండి.
- 'శీర్షిక' లేదా 'H1' తో పంక్తిని హైలైట్ చేయండి, తద్వారా వచనం ఎగువ పేన్లో హైలైట్ అవుతుంది.
- ఎడమ రెండు పేన్లకు నావిగేట్ చేయండి మరియు ఫాంట్ రంగును కనుగొనండి.
- విలువను వేరే వాటికి మార్చండి లేదా సెలెక్టర్ను ఉపయోగించడానికి కలర్ డాట్ను ఎంచుకోండి.
మీరు మార్పును పూర్తి చేస్తున్నప్పుడు మీ మార్పు డైనమిక్గా కనిపిస్తుంది. మీరు రంగు, పరిమాణం, ఫాంట్, నేపథ్యం మరియు ఫాంట్ గురించి ప్రతిదీ మార్చవచ్చు. మీరు పనిని సేవ్ చేయలేరు కాని మీ మార్పులు ఆ సెషన్లో ఉంటాయి.
మీకు ఒక ఆలోచన ఉంటే మరియు మీ అన్ని అభివృద్ధి అనువర్తనాలను కాల్చడానికి ముందు దాన్ని త్వరగా తనిఖీ చేయాలనుకుంటే అనువైన పేజీ గురించి మీరు ప్రతిదీ మార్చవచ్చు. మీరు చేయాల్సిందల్లా మీరు ఏ మార్పులు చేశారో గుర్తుంచుకోండి మరియు మీరు వాటిని ఇక్కడ సేవ్ చేయలేరు. మీరు స్క్రీన్షాట్ తీసుకోవాలి లేదా మార్పులను రికార్డ్ చేయాలి మరియు వాటిని అంటుకునేలా చేయడానికి మీ డెవలపర్ సాధనాల్లో వాటిని ప్రతిరూపం చేయాలి.
మీ బ్రౌజర్లో వెబ్ పేజీని సవరించడం అనేది పేజీలతో ప్రయోగాలు చేయడానికి లేదా ఆడటానికి చక్కని మార్గం. ఖరీదైన డెవలపర్ సాధనాలలో కొనుగోలు చేయకుండా వెబ్ అభివృద్ధి గురించి కొంచెం తెలుసుకోవడానికి ఇది మంచి మార్గం. ఇప్పుడు మీకు ఎలా తెలుసు, వెళ్లి నాటకం చేయండి!
