HTML పేజీని ఎలా వ్రాయాలి

రచయిత: Laura McKinney
సృష్టి తేదీ: 3 ఏప్రిల్ 2021
నవీకరణ తేదీ: 1 జూలై 2024
Anonim
HTML ట్యుటోరియల్ - సూపర్ సింపుల్ వెబ్‌సైట్‌ను ఎలా తయారు చేయాలి
వీడియో: HTML ట్యుటోరియల్ - సూపర్ సింపుల్ వెబ్‌సైట్‌ను ఎలా తయారు చేయాలి

విషయము

HTML (హైపర్‌టెక్స్ట్ మార్కప్ లాంగ్వేజ్) వెబ్ పేజీలను నిర్మించడానికి ఒక ప్రాథమిక భాష. ఇది సులభమైన మరియు సౌకర్యవంతమైన కోడింగ్ భాషగా సృష్టించబడింది. ఇంటర్నెట్‌లోని దాదాపు ప్రతి వెబ్ పేజీ ఈ కోడ్ యొక్క కొన్ని రూపాలతో అభివృద్ధి చేయబడింది (కోల్డ్‌ఫ్యూజన్, XML, XSLT). HTML గ్రహించడం సులభం, కానీ మీరు దాని సమగ్ర కార్యాచరణపై ఆసక్తి కలిగి ఉంటే మీరు దాని గురించి చాలా కాలం నేర్చుకోవచ్చు. మీ వెబ్‌సైట్‌కు రంగు మరియు ఆహ్లాదాన్ని జోడించడానికి, మీరు ప్రాథమిక HTML పేజీకి అలవాటుపడిన వెంటనే మీరు CSS యొక్క ప్రాథమికాలను నేర్చుకోవచ్చు.

దశలు

4 యొక్క 1 వ భాగం: పత్రాన్ని నిర్మించడం

  1. సాధారణ టెక్స్ట్ ఎడిటర్‌ను తెరవండి. నోట్‌ప్యాడ్ మంచి ఎంపిక మరియు ఉచితంగా డౌన్‌లోడ్ చేసుకోవచ్చు. మీరు చాలా టెక్స్ట్ ఎడిటర్లతో HTML ను వ్రాయవచ్చు, కానీ ఆటోమేటిక్ ఫార్మాటింగ్ సామర్థ్యాలతో మరింత క్లిష్టమైన సాఫ్ట్‌వేర్ మీ HTML పేజీని నిర్వహించడం కష్టతరం చేస్తుంది.
    • టెక్స్ట్ఎడిట్ ఉపయోగించవద్దు, ఎందుకంటే ఇది సాధారణంగా మీ బ్రౌజర్ HTML గా గుర్తించలేని ఫార్మాట్‌లో ఫైల్‌ను సేవ్ చేస్తుంది.
    • మీరు ఆన్‌లైన్ HTML ఎడిటర్‌ను కూడా ఉపయోగించవచ్చు. అంకితమైన HTML ఎడిటింగ్ ప్రోగ్రామ్‌లు ప్రారంభకులకు సిఫార్సు చేయబడవు.

  2. ఫైల్‌ను వెబ్ పేజీగా సేవ్ చేయండి. ఎగువ మెనులో ఫైల్ → సేవ్ ఎంచుకోండి. ఫైల్ ఆకృతిని "వెబ్ పేజీ", ".html" లేదా ".htm" గా మార్చండి. మీరు సులభంగా కనుగొనగలిగే ఫైల్‌ను సేవ్ చేయండి.
    • ఈ మూడు ఎంపికల మధ్య తేడా లేదు.
  3. ఫైల్‌ను బ్రౌజర్‌లో తెరవండి. ఫైల్‌పై డబుల్ క్లిక్ చేయండి మరియు ఇది మీ బ్రౌజర్‌లో ఖాళీ వెబ్ పేజీగా స్వయంచాలకంగా తెరవబడుతుంది. ప్రత్యామ్నాయంగా, మీరు ఫైర్‌ఫాక్స్ లేదా ఇంటర్నెట్ ఎక్స్‌ప్లోరర్ వంటి బ్రౌజర్‌ను తెరవవచ్చు, ఆపై పత్రాన్ని ఎంచుకోవడానికి ఫైల్ → ఓపెన్ ఫైల్‌ను ఉపయోగించవచ్చు.
    • ఈ వెబ్‌సైట్ ఆన్‌లైన్‌లో లేదు. ఇది మీ కంప్యూటర్‌లో మాత్రమే చూడవచ్చు.

  4. వెబ్ పేజీని రిఫ్రెష్ చేయండి మరియు చేసిన మార్పులను చూడండి. మీ ఖాళీ పత్రంలో కింది వాటిని టైప్ చేయండి: హలో. పత్రాన్ని సేవ్ చేయండి. మీ బ్రౌజర్‌లో ఖాళీ వెబ్ పేజీని రిఫ్రెష్ చేయండి మరియు పేజీ ఎగువన బోల్డ్‌లో "హలో" అనే పదాన్ని మీరు చూడాలి. ఈ ట్యుటోరియల్ సమయంలో మీరు మీ క్రొత్త HTML ని పరీక్షించాలనుకున్నప్పుడు, .htm పత్రాన్ని సేవ్ చేసి, ఆపై HTML ఎలా కంపైల్ చేయబడిందో చూడటానికి మీ బ్రౌజర్ విండోను రిఫ్రెష్ చేయండి.
    • మీరు పదాలు చూస్తే ""మరియు"మీ బ్రౌజర్‌లో కనిపిస్తుంది, ఫైల్ HTML లో సరిగ్గా కంపైల్ చేయబడలేదు. వేరే టెక్స్ట్ ఎడిటర్ లేదా వేరే బ్రౌజర్ ప్రయత్నించండి.

  5. ట్యాగ్‌లను తెలుసుకోండి. HTML ఆదేశాలు "ట్యాగ్‌లలో" వ్రాయబడతాయి, ఇవి మీ వెబ్ పేజీని ఎలా కంపైల్ చేయాలి మరియు ప్రదర్శించాలో బ్రౌజర్‌కు తెలియజేస్తాయి. అవి ఎల్లప్పుడూ ఒకే కోట్స్ లోపల వ్రాయబడతాయి , మరియు పై ఉదాహరణలో మీరు వాటిని ఉపయోగించినట్లు వెబ్ పేజీలో ప్రదర్శించబడవు:
    • "ప్రారంభ కార్డు" లేదా "ప్రారంభ కార్డు". ఈ ట్యాగ్ తర్వాత వ్రాయబడిన ఏదైనా "బోల్డ్" (వెబ్ పేజీలో బోల్డ్) గా నిర్వచించబడుతుంది.
    • ఇది "ఎండ్ ట్యాగ్" లేదా "క్లోజింగ్ ట్యాగ్", ఇది మీరు గుర్తు / గుర్తు ద్వారా వేరు చేయవచ్చు. ఇది బోల్డ్ టెక్స్ట్ ముగింపును సూచిస్తుంది. చాలా (అన్నీ కాదు) ట్యాగ్‌లు పనిచేయడానికి ముగింపు ట్యాగ్ అవసరం, కాబట్టి దీన్ని ఖచ్చితంగా చేర్చండి.
  6. మీ పత్రాన్ని రూపొందించండి. మీ HTML పత్రంలోని ప్రతిదాన్ని తొలగించండి. కింది వచనంతో వ్రాసినట్లే ప్రారంభించండి (బుల్లెట్ పాయింట్లకు మైనస్). ఈ HTML కోడ్ మీరు ఏ రకమైన HTML ను ఉపయోగిస్తున్నారో బ్రౌజర్‌కు చెబుతుంది మరియు మీ HTML అన్నీ ట్యాగ్‌ల లోపల ఉంచబడతాయి. మరియు .
  7. తల (తల) మరియు బాడీ ట్యాగ్‌లను జోడించండి. HTML పత్రాలు రెండు భాగాలుగా విభజించబడ్డాయి. "టాప్" విభాగం పేజీ యొక్క శీర్షిక వంటి ప్రత్యేక సమాచారం కోసం. "బాడీ" విభాగం పేజీ యొక్క ప్రధాన కంటెంట్‌ను కలిగి ఉంది. ఈ రెండు విభాగాలను మీ పత్రానికి జోడించి, ముగింపు ట్యాగ్‌లను చేర్చాలని గుర్తుంచుకోండి. కొత్తగా జోడించిన వచనం బోల్డ్:
  8. మీ పేజీకి శీర్షిక ఇవ్వండి. హెడ్ ​​విభాగంలో చాలా కార్డులు ఒక అనుభవశూన్యుడుతో నేర్చుకోవడం ముఖ్యం కాదు. టైటిల్ ట్యాగ్ ఉపయోగించడం సులభం, అయితే, బ్రౌజర్ విండో పేరు లేదా బ్రౌజర్ టాబ్‌లో ఏమి కనిపిస్తుందో నిర్ణయిస్తుంది. హెడ్ ​​ట్యాగ్‌లలో మీ హెడ్‌లైన్ ప్రారంభ మరియు ముగింపు ట్యాగ్‌లను ఉంచండి మరియు ఆ ట్యాగ్‌ల మధ్య మీకు నచ్చిన శీర్షికలను రాయండి:
    • నా మొదటి HTML పేజీ.
    ప్రకటన

4 యొక్క పార్ట్ 2: టెక్స్ట్ ఫార్మాటింగ్

  1. మీ శరీరానికి వచనాన్ని జోడించండి. ఈ విభాగం కోసం, మేము బాడీ ట్యాగ్‌లతో మాత్రమే పని చేస్తాము. ఇతర వచనం ఇప్పటికీ మీ పత్రంలో ఉంటుంది, కానీ మేము ఈ ట్యుటోరియల్‌లో పునరావృతం చేయకుండా స్థలాన్ని ఆదా చేస్తాము. కార్డుల మధ్య మీకు కావలసినది రాయండి మరియు , మరియు ఇది మీ పేజీలోని మొదటి కంటెంట్‌గా కనిపిస్తుంది. ఉదాహరణకి:
    • నేను HTML పేజీని వ్రాయడానికి వికీహో సూచనలను అనుసరించాను.
  2. టెక్స్ట్ కోసం శీర్షికలను జోడించండి. మీ పేజీని శీర్షిక ట్యాగ్‌లతో నిర్వహించండి, అవి వాటి మధ్య వచనాన్ని పెద్ద ఫాంట్ పరిమాణంలో ప్రదర్శించమని బ్రౌజర్‌కు సూచించాయి. ఈ ట్యాగ్‌లను సెర్చ్ ఇంజన్లు మరియు ఇతర సాధనాలు కూడా ఉపయోగిస్తాయి, మీ వెబ్‌సైట్ గురించి మరియు అది ఎలా నిర్వహించబడుతుందో తెలుసుకోవడానికి.

    అతిపెద్ద శీర్షిక, మరియు మీరు చిన్న శీర్షికలను సృష్టించవచ్చు
    . మీ పేజీలో వాటిని ప్రయత్నించండి:
    • నా పేజీకి స్వాగతం.

    • నేను HTML పేజీని వ్రాయడానికి వికీహో సూచనలను అనుసరించాను.
    • ఈ రోజు నా లక్ష్యం:

    • పూర్తి లక్ష్యాలు:
    • శీర్షికలను ఎలా ఉపయోగించాలో తెలుసుకోండి.
    • అసంపూర్తిగా ఉన్న లక్ష్యాలు:
    • టెక్స్ట్ ఫార్మాటింగ్ ట్యాగ్‌లను మరింత తెలుసుకోండి.
  3. టెక్స్ట్ ఫార్మాటింగ్ ట్యాగ్‌లను మరింత తెలుసుకోండి. మీరు ఇప్పటికే "బలమైన" ట్యాగ్‌ను చూసారు, కానీ మీ వచనాన్ని ఫార్మాట్ చేయడానికి ఇతర మార్గాలు చాలా ఉన్నాయి. ఒకే టెక్స్ట్ స్ట్రింగ్ కోసం ఈ ట్యాగ్‌లను ప్రయత్నించండి లేదా ఒకేసారి బహుళ ట్యాగ్‌లతో ప్రయత్నించండి. వెనుక భాగంలో ముగింపు ట్యాగ్‌లను జోడించడం గుర్తుంచుకోండి!
    • ముఖ్యమైన వచనం, బ్రౌజర్‌లో బోల్డ్‌లో ప్రదర్శించబడుతుంది.
    • నొక్కిచెప్పిన వచనం, బ్రౌజర్‌లో ఇటాలిక్స్‌లో ప్రదర్శించబడుతుంది.
    • సాధారణం కంటే కొంచెం చిన్నగా టెక్స్ట్ చేయండి. శీర్షికలో ఉపయోగించినట్లయితే ఈ వచనం స్వయంచాలకంగా పరిమాణం మారుతుంది.
    • టెక్స్ట్ ఇకపై సంబంధితంగా ఉండదు, బాడీ డాష్‌తో ప్రదర్శించబడుతుంది.
    • టెక్స్ట్ ఇతర పత్రాల కంటే తరువాత చేర్చబడుతుంది, అండర్లైన్లతో ప్రదర్శించబడుతుంది.
  4. మీ పేజీలో వచనాన్ని నిర్వహించండి. టెక్స్ట్ మరొక పంక్తిలో చూపించడానికి "ఎంటర్" కీని నొక్కడం సరిపోదని మీరు గమనించవచ్చు. ఈ ట్యాగ్‌లు పేరాగ్రాఫ్‌లు మరియు లైన్ బ్రేక్‌లను సృష్టించడానికి లేదా మీ వచనాన్ని ఇతర మార్గాల్లో ఏర్పాటు చేయడంలో మీకు సహాయపడతాయి:
    • "పేరా" కోసం చిన్నది, ఈ ట్యాగ్ ఈ ట్యాగ్‌ల మధ్య ఉన్న అన్ని వచనాలను పేరాలో ఉంచుతుంది మరియు దానిని పైన మరియు క్రింద ఉన్న టెక్స్ట్ నుండి వేరు చేస్తుంది.


    • ఈ ట్యాగ్ లైన్ విరామాలను సృష్టిస్తుంది. దీనికి ఎండ్ ట్యాగ్‌ను జోడించవద్దు, ఎందుకంటే ఇది ఇతర కంటెంట్‌తో జోక్యం చేసుకోదు. ఈ ట్యాగ్‌ను పేరాగ్రాఫ్‌లు కాకుండా పద్యాలు లేదా చిరునామా పంక్తులలో ఉపయోగించండి.
    • మీరు వచనాన్ని చాలా ఖచ్చితంగా ప్రదర్శించాల్సిన అవసరం ఉంటే, ఈ ట్యాగ్ దానిలోని వచనాన్ని స్థిర వెడల్పు ఫాంట్‌కు సెట్ చేస్తుంది (ప్రతి అక్షరానికి ఒకే వెడల్పు ఉంటుంది), మరియు విరామాలను సృష్టించడానికి మిమ్మల్ని అనుమతిస్తుంది ట్యాగ్‌లను ఉపయోగించకుండా సాధారణ ఎడిటింగ్ కోసం మీకు నచ్చిన ఖాళీలు మరియు పంక్తి విరామాలు.
    • ఈ ట్యాగ్ మూలం నుండి కోట్ చేయబడిన వచన రకాన్ని నిర్వచిస్తుంది.
      మీరు తరువాత మూలాన్ని వివరించవచ్చు కార్డును ఉదహరించండి.
  5. అదృశ్య శీర్షిక వచనాన్ని జోడించండి. వ్యాఖ్య ట్యాగ్‌లు వెబ్ పేజీలో ప్రదర్శించబడవు. కంటెంట్‌ను ప్రభావితం చేయకుండా మిమ్మల్ని HTML పత్రంలోకి వ్యాఖ్యానించడానికి అవి మిమ్మల్ని అనుమతిస్తాయి. ముగింపు ట్యాగ్‌ను జోడించవద్దు.
    • ట్యాగ్‌లను ముగించకుండా ఒంటరిగా వెళ్ళే కార్డులను "ఖాళీ ట్యాగ్‌లు" అంటారు.
  6. వాటిని కలపండి. ఈ ట్యాగ్‌లను గుర్తుంచుకోవడానికి ఉత్తమ మార్గం వాటిని మీ వెబ్‌సైట్‌లో ఉపయోగించడం. మీరు ఇప్పటివరకు నేర్చుకున్న దశల్లో కార్డులను ఉపయోగించే ఉదాహరణ ఇక్కడ ఉంది. అవి బ్రౌజర్‌లో ఎలా కనిపిస్తాయో to హించడానికి ప్రయత్నించండి, ఆపై వాటిని మీ పత్రానికి కాపీ చేసి తెలుసుకోండి.
    • నా మొదటి HTML పేజీ.
    • నా వెబ్‌సైట్‌కు స్వాగతం.

    • మీరు ఈ పేజీని ఆనందిస్తారని ఆశిస్తున్నాము!

      నేను మీ కోసం మాత్రమే చేసాను.

    • పార్ట్ 1: నేను HTML ను ఎలా కనుగొన్నాను

    • నేను ఇప్పటికే HTML నేర్చుకున్నాను ఒకటి రెండుగంటలు, కాబట్టి ఇప్పుడు నేను నిపుణుడిని.
    ప్రకటన

4 యొక్క 3 వ భాగం: లింకులు మరియు చిత్రాలను కలుపుతోంది

  1. లక్షణాల గురించి తెలుసుకోండి. ట్యాగ్‌లు వాటి లోపల గుణాలు అని పిలువబడే అదనపు సమాచారాన్ని కలిగి ఉంటాయి. ఈ లక్షణాలను ట్యాగ్‌లలోనే అదనపు పదాల ద్వారా సూచిస్తారు ఆస్తి పేరు = "నిర్దిష్ట విలువ". ఉదాహరణకు, ఏదైనా HTML ట్యాగ్ టైటిల్ లక్షణాన్ని కలిగి ఉంటుంది:
    • పరిచయం పేరా ఇక్కడ ఉంది.

      "గురించి" పేరాకు శీర్షిక పెట్టండి, ఇది మీరు వెబ్ పేజీలోని పేరాపై హోవర్ చేసినప్పుడు కనిపిస్తుంది.
  2. ఇతర వెబ్‌సైట్‌లకు లింక్‌లు. కార్డుల వాడకం ఏదైనా ఇతర వెబ్ పేజీకి హైపర్ లింక్ సృష్టించడానికి. Href లక్షణాన్ని ఉపయోగించడానికి లింక్ చేయడానికి వెబ్ పేజీ యొక్క URL ని చొప్పించండి. మీరు చదువుతున్న వెబ్ పేజీకి లింక్ చేసే ఉదాహరణ ఇక్కడ ఉంది:
  3. ట్యాగ్‌కు ఐడి లక్షణాన్ని జోడించండి. ఏదైనా HTML ట్యాగ్ ఉపయోగించగల మరొక లక్షణం "ఐడి" మూలకం. ఏదైనా కార్డులో, వ్రాయండి id = "vidu" లేదా ఖాళీలు లేని ఏదైనా పేరును ఉపయోగించండి. ఇది కనిపించే ప్రభావాన్ని ఉత్పత్తి చేయదు, కాని మేము దానిని తదుపరి దశలో ఉపయోగిస్తాము.
    • ఉదాహరణకు, మీ పత్రానికి కింది వాటిని జోడించండి:

      ఐడి గుణం ఎలా పనిచేస్తుందో వివరించడానికి ఈ పేరా ఉదాహరణగా ఉపయోగించబడుతుంది.

  4. నిర్దిష్ట ఐడితో మూలకానికి లింక్ చేయండి. ఇప్పుడు మనం హైపర్ లింక్ ట్యాగ్ ను ఉపయోగించవచ్చు, , అదే పేజీలోని మరొక ప్రదేశానికి లింక్ చేయడానికి. URL కు బదులుగా, మేము # గుర్తును ఉపయోగిస్తాము, దాని తరువాత మనం లింక్ చేయదలిచిన ఐడి విలువ. ఉదాహరణకి, ఈ వచనం "విదు" ఐడితో వచనానికి లింక్ అవుతుంది.
    • అన్ని HTML విలువలు కేస్ సెన్సిటివ్. "#VIDU" మరియు "#vidu" రెండూ ఒకే స్థానానికి లింక్ చేయబడతాయి.
    • మీ పేజీ మొత్తం పేజీని ఒకేసారి ప్రదర్శించేంత చిన్నదిగా ఉంటే, మీ బ్రౌజర్‌లోని లింక్‌ను క్లిక్ చేయడం ద్వారా ఏదైనా జరగడం మీరు గమనించలేరు. స్క్రోల్ బార్ కనిపించే వరకు విండో పరిమాణాన్ని మార్చండి, ఆపై మళ్లీ ప్రయత్నించండి.
  5. ఫోటోలను జోడించండి. కార్డు ఖాళీ ట్యాగ్, అంటే ముగింపు ట్యాగ్ అవసరం లేదు. చిత్రాన్ని ప్రదర్శించడానికి బ్రౌజర్‌కు అవసరమైన మొత్తం సమాచారం లక్షణాలను ఉపయోగించి జోడించబడుతుంది. వికీహో లోగోను ప్రదర్శించడానికి ఇక్కడ ఒక ఉదాహరణ ఉంది, వెనుక ఉన్న ప్రతి లక్షణానికి వివరణతో:
    • వికీహో లోగో
    • లక్షణాలు src = "" ఫోటో ఉన్న బ్రౌజర్‌కు చెబుతుంది. (వేరొకరి సైట్ నుండి ఫోటోను పోస్ట్ చేయడం తగదని భావిస్తారు - మరియు పేజీ ఇకపై చురుకుగా లేనప్పుడు ఫోటో అదృశ్యమవుతుంది.)
    • లక్షణాలు style = "" ఇది చాలా పనులు చేయగలదు, కానీ ముఖ్యంగా ఇది చిత్రం యొక్క వెడల్పు మరియు ఎత్తును పిక్సెల్‌లలో సెట్ చేయడానికి ఉపయోగించబడుతుంది. (మీరు బదులుగా వెడల్పు = "" మరియు ఎత్తు = "" అనే ప్రత్యేక లక్షణాలను కూడా ఉపయోగించవచ్చు, కానీ మీరు CSS ను ఉపయోగిస్తే ఇది విచిత్రమైన పున izing పరిమాణం సమస్యలకు దారితీస్తుంది.)
    • లక్షణాలు alt = "" చిత్రం లోడ్ చేయడంలో విఫలమైతే వినియోగదారు చూసే చిత్రం యొక్క సంక్షిప్త వివరణ. ఇది అంధులైన వెబ్‌సైట్ సందర్శకుల కోసం స్క్రీన్ రీడర్ల కోసం ఉపయోగించబడుతున్నందున ఇది ఒక అవసరంగా పరిగణించబడుతుంది.
    ప్రకటన

4 యొక్క 4 వ భాగం: మరింత తెలుసుకోండి మీ వెబ్‌సైట్‌ను ఆన్‌లైన్‌లో చేర్చడం మరియు పొందడం

  1. మీ HTML ని నిర్ధారించండి. మీ కోడ్‌లోని లోపాలను HTML ధ్రువీకరణ తనిఖీ చేస్తుంది. మీ సైట్ సరిగ్గా ప్రదర్శించబడకపోతే, సమస్యకు కారణమయ్యే లోపాన్ని కనుగొనడానికి ధ్రువీకరణ మీకు సహాయపడుతుంది. డిస్ప్లేలో కోడ్ బాగుంది అని నిర్ణయించడం ద్వారా ఇది HTML గురించి మీకు మరింత నేర్పుతుంది, కానీ HTML ప్రమాణంలో కొత్త నవీకరణల కారణంగా ఇది ఇకపై సిఫార్సు చేయబడదు. చెల్లని HTML ని ఉపయోగించడం వల్ల మీ సైట్ నిరుపయోగంగా ఉండదు, కానీ సమస్యలను కలిగిస్తుంది లేదా వేర్వేరు బ్రౌజర్‌లలో అస్థిరంగా ప్రదర్శిస్తుంది.
    • W3C నుండి ఉచిత ఆన్‌లైన్ ధ్రువీకరణ సేవను ప్రయత్నించండి లేదా ఆన్‌లైన్‌లో మరొక HTML 5 ధ్రువీకరణ సాధనం కోసం శోధించండి.
  2. మరింత ట్యాగ్‌లు మరియు లక్షణాలను తెలుసుకోండి. అనేక ఇతర HTML ట్యాగ్‌లు మరియు గుణాలు ఉన్నాయి మరియు వాటిని తెలుసుకోవడానికి చాలా ప్రదేశాలు ఉన్నాయి:
    • మరిన్ని ట్యుటోరియల్స్ మరియు ట్యాగ్‌ల పూర్తి జాబితాల కోసం w3 పాఠశాలలు మరియు HTML డాగ్‌ను ప్రయత్నించండి.
    • మీకు నచ్చిన వెబ్ పేజీని కనుగొనండి, ఆపై HTML కోడ్‌ను మీరే పొందడానికి మీ బ్రౌజర్ యొక్క "పేజీ మూలాన్ని వీక్షించండి" ఫంక్షన్‌ను ఉపయోగించండి. దీన్ని మీ పత్రంలోకి కాపీ చేసి, అది ఎలా పనిచేస్తుందో అధ్యయనం చేయండి.
    • ఇతర కథనాలను చదవండి మరియు HTML లో పట్టికలను ఎలా సృష్టించాలో తెలుసుకోండి, సెర్చ్ ఇంజన్ల ద్వారా మీ అవకాశాలను పెంచడానికి మెటా ట్యాగ్‌లను ఉపయోగించండి లేదా విభాగాన్ని ఉపయోగించండి. CSS ద్వారా శైలికి సహాయపడటానికి పేజీలో ఒక ప్రాంతాన్ని సెట్ చేయండి) మరియు span (టెక్స్ట్ ఎలిమెంట్ యొక్క శైలిని పేర్కొనడానికి ఉపయోగిస్తారు).
  3. మీ వెబ్‌సైట్‌ను ఆన్‌లైన్‌లో పొందండి. మీ వెబ్‌సైట్‌ను హోస్ట్ చేయడానికి ఒక సేవను ఎంచుకోండి, ఆపై మీరు మీ వ్యక్తిగత వెబ్ డొమైన్‌కు కావలసినన్ని HTML పేజీలను అప్‌లోడ్ చేయవచ్చు. దీన్ని చేయడానికి, మీరు FTP అప్‌లోడ్ సాఫ్ట్‌వేర్‌ను ఉపయోగించాల్సి ఉంటుంది, కానీ చాలా వెబ్ అద్దె సేవలు ఈ సేవను కూడా అందిస్తున్నాయి.
    • మీ సైట్‌లో నేరుగా ఉన్న పేజీలు లేదా చిత్రాలకు లింక్ చేసినప్పుడు, మీరు పూర్తి చిరునామాను ఉపయోగించాల్సి ఉంటుంది. ఉదాహరణకు, మీ డొమైన్ పేరు www.chuyengiahtmlsieudang.com అయితే, అప్పుడు టెక్స్ట్ ఈ ట్యాగ్లలో ఉంది "www.chuyengiahtmlsieudang.com/nhatky/thuhai.html" కు లింక్ చేస్తుంది
  4. CSS తో శైలులను జోడించండి. మీ HTML పేజీ కొంచెం మార్పులేనిదిగా కనిపిస్తే, రంగులు, విభిన్న ఫాంట్‌లు మరియు మూలకాలను ఎక్కడ ఉంచారో దానిపై మంచి నియంత్రణను జోడించడానికి CSS యొక్క ప్రాథమికాలను తెలుసుకోవడానికి ప్రయత్నించండి. ఒక CSS "స్టైల్షీట్" ను ఒక HTML పేజీకి లింక్ చేయడం వలన ఫ్లైలో తీవ్రమైన మార్పులు చేయటానికి మిమ్మల్ని అనుమతిస్తుంది, ఇచ్చిన ట్యాగ్‌లోని అన్ని టెక్స్ట్ యొక్క శైలిని స్వయంచాలకంగా సర్దుబాటు చేస్తుంది. మీరు ఇక్కడ ప్రాథమిక ఆకృతీకరణ పొరతో కొంచెం ఆడవచ్చు లేదా HTML డాగ్ యొక్క CSS ట్యుటోరియల్‌లో మరింత వివరణాత్మక ట్యుటోరియల్‌తో మరింత త్రవ్వవచ్చు.
  5. మీ వెబ్‌సైట్‌కు జావాస్క్రిప్ట్‌ను జోడించండి. జావాస్క్రిప్ట్ అనేది మీ HTML పేజీలకు చాలా కార్యాచరణను జోడించడానికి ఉపయోగించే ప్రోగ్రామింగ్ భాష. ప్రారంభ మరియు ముగింపు ట్యాగ్‌ల మధ్య జావాస్క్రిప్ట్ ఆదేశాలు చేర్చబడతాయి , మరియు ఇంటరాక్టివ్ బటన్లను జోడించడానికి, గణిత సమస్యలను లెక్కించడానికి మరియు మరెన్నో ఉపయోగించవచ్చు. W3c ఉదాహరణలలో మరింత తెలుసుకోండి. ప్రకటన

సలహా

  • ఈ ట్యుటోరియల్‌లో ఉపయోగించిన డాక్టైప్ డిక్లరేషన్ (డాక్యుమెంట్ టైప్ డిక్లరేషన్) "లూస్ HTML 4.0.1 ట్రాన్సిషనల్" (HTML 4.0.1 టైట్ ట్రాన్సిషన్ కాదు), సులభమైన ఫార్మాట్. ఆరంభకుల కోసం. వా డు () బ్రౌజర్‌ను కఠినమైన HTML 5 ఆకృతిలో కంపైల్ చేయడానికి ప్రత్యామ్నాయం, ఇది సిఫార్సు చేయబడిన (తక్కువ సాధారణంగా ఉపయోగించినప్పటికీ) ప్రామాణిక శైలి.

హెచ్చరిక

  • HTML యొక్క ఉద్దేశ్యం కంటెంట్‌ను ప్రపంచ ఆకృతిలో ఉంచడం. ఇది మీ వెబ్‌సైట్ యొక్క నేపథ్య రంగు మరియు మూలకాల యొక్క ఖచ్చితమైన స్థానం వంటి ప్రదర్శనను నియంత్రించదు. దీన్ని చేయడానికి మిమ్మల్ని అనుమతించే ట్యాగ్‌లు ఇంకా ఉన్నప్పటికీ, మరింత నియంత్రించదగిన మరియు స్థిరమైన వెబ్‌సైట్‌ను సృష్టించడానికి CSS ను ఉపయోగించడం మంచిది.

నీకు కావాల్సింది ఏంటి

  • నోట్‌ప్యాడ్ లేదా టెక్స్ట్ ఎడిట్ వంటి సాధారణ టెక్స్ట్ ఎడిటర్
  • ఇంటర్నెట్ ఎక్స్‌ప్లోరర్ లేదా మొజిల్లా ఫైర్‌ఫాక్స్ వంటి వెబ్ బ్రౌజర్
  • (ఐచ్ఛికం) అడోబ్ డ్రీమ్‌వీవర్, ఆప్తానా స్టూడియో లేదా మైక్రోసాఫ్ట్ ఎక్స్‌ప్రెషన్ వెబ్ వంటి HTML ఎడిటర్