See Selgitatud õpetab HTML-i abil veebilehte looma. Mõned teie veebilehe elemendid võivad sisaldada teksti, linke ja pilte.
1
Avage lihtne tekstiredaktor. Windowsi arvutites on vaikimisi lihtne tekstiredaktor Notepad, samas kui Maci kasutajatel on programm nimega TextEdit: Windows – klõpsake nuppu Start , tippige märkmik ja klõpsake nuppu Notepad.Mac – klõpsake nuppu Spotlight , tippige tekstiredaktor ja klõpsake tulemustes nuppu TextEdit.
2
HTML-märgendite mõistmine. HTML-is kirjutades tähistatakse lehe erinevaid elemente avatud siltidega (<>) ja suletud siltidega (>), kusjuures elemendi tekst mahub siltide vahele. Näiteks luuakse lõik, tippides avatud lõigumärgend (
), sisestades teksti, mida soovite kasutada, ja seejärel sisestades suletud lõigu märgendi
.Iga koodirida peab kulgema eraldi real, nii et tavaliselt vajutate ↵ Sisestage pärast koodirea kirjutamist.
3
Vaadake üle põhiline HTML-vorming. Iga loodud HTML-dokumendi puhul alustate dokumenti märgendiga “dokumendi tüüp” (), HTML-märgendiga () ja märgendiga BODY (
4
Kaaluge CSS-i õppimist. CSS on keel, mis täiendab HTML-i; see hõlmab lehe vormindamist (nt värve, tsentreeritud teksti jne) ja muid veebilehe visuaalseid aspekte.
5
Seadistage dokument. Lisage oma dokumendi esialgne HTML-tekst:
6
Looge oma veebilehe pealkiri. Seda nimetatakse ka “peaks” ja see määrab brauseri vahekaardil kuvatava teksti. Selleks lisage oma dokumendile järgmine tekst, asendades kindlasti “Teie pealkiri” eelistatud tekstiga:
7
Lisage päis. Sisestage
Tekst
ja vajutage sisestusklahvi ↵. Saate paigutada mis tahes teksti, mida soovite kasutada siltide
ja
vahele. Päiseid saab virnastada kogu lehele. Iga päise puhul, mida kasutate pärast esimest, suurendage lihtsalt numbrit (nt teise päise jaoks kasutage
).
8
Loo lõik. Sisestage
Tekst
ja vajutage sisestusklahvi, et asendada “Tekst” kindlasti lõigu tekstiga. Iga tekstirea saate paigutada uuele reale, korrates
sildid iga tekstirea jaoks.
9
Korrake päise ja lõigu protsessi. Saate oma veebilehele lisada nii palju päiseid ja lõike, kui soovite.
10
Lisage lehele pause. Sisestage
Tekst ja vajutage sisestusklahvi ↵. See loob lõikude vahele leheküljevahed, kui soovite eri osade vahele jätta.
11
Vormindage oma lõikude tekst. Vorminduse tähistamiseks saate
-märgendite sees kasutada erinevaid silte (nt
):tekst – loob kaldkirja tekst.tekst – loob paksus kirjas teksti.tekst – loob allakriipsutatud teksti.tekst – Loob teksti, mille rida läbib.tekst< /small> – loob väikese teksti. – Loob nähtamatut teksti. Kasutatakse teie veebilehele märkmete lisamiseks.
12
Sulgege oma dokumendi BODY- ja HTML-märgendid. Kui olete teksti lisamise lõpetanud, tippige sisse ja vajutage sisestusklahvi ↵, seejärel tippige dokumendi sulgemiseks. Nüüd, kui teie tekstileht on tehniliselt valmis, saate sellele lisada muid asju, näiteks linke, täppe ja pilte.
13
Leidke oma veebilehel lingi lisamiseks koht. Kui soovite näiteks lõigu keskele lisada lingi veebilehele, minge selle lõigu juurde ja leidke sõna või fraas, mida soovite lingina kasutada.
14
Kopeerige veebisaidi URL. Minge veebisaidile, millele soovite linkida, seejärel valige selle aadress akna ülaosas asuvalt ribalt ja vajutage klahvikombinatsiooni Ctrl+C (Windows) või ⌘ Command+C (Mac).
15
Sisestage avatud lingi märgend. Sisestage tühjale sõnale või fraasile, mida soovite lingina kasutada.
16
Kleepige veebisaidi URL. Klõpsake nuppude href= ja > vahel ning seejärel vajutage klahvikombinatsiooni Ctrl+V (Windows) või ⌘ Command+V (Mac). Peaksite nägema linki href= tekstist paremal. Näiteks kui lingite YouTube’i, näete siin .
17
Lisage suletud lingi silt. Teksti teisele küljele, mida soovite lingina kasutada, tippige . Näiteks reas, mis ütleb “Jälgi mind Twitteris”, kus lingite Twitteriga ja kasutate lingina “Twitteris”, sarnaneks teie kood järgmisega:Twitteris
18
Lisage ID-märgend. ID-sildid võimaldavad teil linkida ühe tekstilõigu teise jaotisega sama lehe erinevas lõigus. Selleks: asendage märgend
märgendiga
Leidke tekst, mida soovite lingina kasutada. Tippige teksti ette . Veenduge, et “#” järel olev tekst ühtiks tekstiga “id=” here.Tippige teksti järele .
19
Leidke koht, kuhu lisada täppe. Täpipunktid sobivad kõige paremini teabe loetlemiseks või organiseeritud sammude loomiseks. Kui olete leidnud lõigu, mille alla soovite täppe lisada, jätkake.
20
Lisage lehekülje vahe. Tippige selle koha kohale, kuhu soovite oma täpploendi paigutada,
ja vajutage sisestusklahvi ↵.
21
Loo esimene täpp. Sisestage
ja vajutage sisestusklahvi ↵, asendades kindlasti “tekst” oma täppi tekstiga.
22
Lisage rohkem punkte. Seni kuni kasutate tekstiridade ümber silte
, vormindatakse siltide vahel olev tekst täppina.
23
Looge alampunkt. Sisestage
- tekst
ja vajutage sisestusklahvi ↵. Teie tekst kuvatakse taandena eelmise täpi all.
-märgenditega teksti ees ei ole täppe.
24
Sulgege lehepaus. Kui otsustasite kasutada lehevahet varem, tippige ja vajutage sisestusklahvi ↵. Teie täpploend jääb lehel eraldi seisma.
25
Otsige pildi sisestamiseks koht. Pilt ilmub veebilehel, kuhu sisestate pildi koodi.
26
Looge pildi silt. Selleks tippige sulg.
33
Vaadake üle oma pildi kood. See peaks sarnanema järgmisega:
34
Klõpsake nuppu Fail. See asub Notepadi akna vasakus ülanurgas. Ilmub rippmenüü.
35
Klõpsake nuppu Salvesta nimega. Selle leiate rippmenüü Fail ülaosast.
36
Valige salvestuskoht. Klõpsake akna vasakus servas kaustal (nt Töölaud).
37
Sisestage failile HTML-nimi. Tippige tekstiväljale “Faili nimi” mis tahes nimi, mida soovite faili jaoks kasutada, millele järgneb .html. Näiteks faili nimega “mjäu” sisestage siia mjäu.html.
38
Klõpsake rippmenüüd “Salvesta tüüp”. Ilmub rippmenüü.
39
Klõpsake nuppu Kõik failid. See on rippmenüüs.
40
Klõpsake nuppu Salvesta. Näete seda akna paremas alanurgas. See salvestab teie tekstifaili HTML-lehena. HTML-lehe faili saate avada enamikus brauserites, klõpsates ja lohistades faili avatud brauseriaknasse.
41
Klõpsake nuppu TextEdit. See asub ekraani vasakus ülanurgas. Ilmub rippmenüü.
42
Klõpsake valikul Eelistused. Selle leiate rippmenüü ülaosast. Avaneb eelistuste aken.
43
Klõpsake vahekaarti Ava ja salvesta. See on lehe ülaosas.
44
Tühjendage märkeruut “Lisa lihttekstifailidele laiend “.txt”. See on pealkirja “Faili salvestamisel” all.
45
Sulgege eelistuste aken. Selleks klõpsake punasel ringil akna vasakus ülanurgas.
46
Klõpsake nuppu Vorming. See on ekraani ülaosas olev menüü.
47
Klõpsake käsul Tee lihttekst. See valik on rippmenüüs.
48
Klõpsake nuppu Fail. See asub ekraani vasakus ülanurgas.
49
Klõpsake nuppu Salvesta. See asub rippmenüü ülaosas.
50
Sisestage failile HTML-nimi. Asendage nimi tekstiväljal “Salvesta nimega” mis tahes soovitud nimega, millele järgneb .html. Näiteks dokumendi “minu_veebisait” puhul sisestage siia my_website.html.
51
Klõpsake nuppu Salvesta. Teie HTML-dokument salvestatakse teie vaikesalvestuskohta (nt töölauale). HTML-lehe faili saate avada enamikus brauserites, klõpsates ja lohistades faili avatud brauseriaknasse.