HTML lehtede loomine
tekstitöötlusprotsessori Microsoft Word abil.

HTML lehekülgede loomine ja muutmine võib olla teostatud erinevaid vahendeid kasutades. Interneti ajastu sünniaja ja arengu ajal kasutas suurem osa selleks tavalisi tekstitöötlusvahendeid. Seejuures vajalikud HTML keele teegid lisati käsitsi dokumendi loomise käigus. Selline moodus on täiesti lubatav ka tänapäeval, kuid nõuab HTML keele head tundmist ja olulisi ajalisi kulutusi teekide sissetrükkimiseks ja parandamiseks. Aja jooksul ilmusid spetsiaalsed vahendid HTML dokumentide redigeerimiseks, mis muutsid töö dokumentidega lihtsamaks ja efektiivsemaks.

HTML dokumentide redaktorid jaotatakse tavaliselt kahte gruppi. Esimesse gruppi kuuluvad nn teekide redaktorid, mis võimaldavad teekide kirjutamist vahetult HTML keeles ja omavad spetsiaalseid lisavõimalusi mitmesuguste teekide dokumenti lisamise protsessi kergendamiseks. Tänapäeval omavad teekide redaktorid lisainstrumente HTML elementide genereerimiseks. Nende alla kuuluvad targad (Wizard), mallid ja muud vahendid, mis lihtsustavad tööd tüüpiliste HTML keele elementidega - loendid, tabelid, vormid ja paanid. Mõned programmid kontrollivad isegi teekide kirja süntaksi, mis võimaldab kiiremini leida HTML dokumentide vormindamise vigu. Üheks selle grupi populaarseimaks programmiks on HotDog Web Editor, mis on loodud kompaniis Sausage Software. Seda redaktorit kasutatakse HTML dokumentide loojate poolt juba paljude aastate jooksul.

Teise gruppi kuuluvad nn WYSIWYG (What You See Is What You Get) redaktorid, mis tõlkes inimeste keelde tähendab umbes, et mida näed seda saad. Selle grupi tüüpilisteks esindajateks on: Netscape Composer ja Microsoft FrontPage. Sellist tüüpi redaktorid võimaldavad HTML dokumentide kujundust ja struktuuri muuta visuaalselt ilma vajaduseta tunda HTML keele teeke üksikasjalikumalt. Seejuures luuakse resultatiivne HTML kood automaatselt. Töös nende redaktoritega võib lehekülje looja üldse mitte omada ettekujutust HTML keele teekide õigekirjast ja täielikult usaldada vastava redaktori võimalusi. Teiselt poolt aga ei või sellist tüüpi redaktorid tagada seda paindlikkust, mida on võimalik saavutada töös teekide tasemel ja ei oma sellist tüüpi redaktorid reeglina kõiki HTML keele võimalusi.

Tänapäeval on selline redaktorite jagamine kahte gruppi saamas üha enam ja enam tinglikuks. Teekide redaktorid lähenevad oma võimaluste ja töö mugavuse poolest üha enam WYSIWYG redaktoritele. Viimased omakorda muutuvad üha võimsamaks ja pindlikumaks võimaldades kasutada ühe keerulisemaid elemente. Arvata võib, et lähitulevikus redaktorite jagamine kahte erinevasse gruppi kaob.

Üheks HTML dokumentide loomise ja redigeerimise vahendiks on tarkvarapaketi Microsoft Office koosseisu kuuluv tekstiredaktor Microsoft Word. Põhimõtteliselt suvalist selle programmi versiooni võib kasutada HTML redaktorina. Suur hulk inimesi kes kasutavad oma igapäevases töös Microsoft Wordi on potentsiaalsed HTML lehekülgede loojad. Alates versioonist Word 97 on programmi lisatud ka spetsiaalsed vahendid HTML dokumentidega töötamiseks, mis muudavad ta interneti lehekülgede loomise võimsaks vahendiks.

Interneti lehekülgede loomine.

Ülesanne 1. Loome töölauale uue kausta.

1. Klõpsake töölaual hiire parempoolset klahvi ja valige avanenud kontekstmenüüst element New.
2. Seejärel valige kontekstmenüü alammenüüst element Folder.
3. Sisestage uue kausta nimeks: "word97html".
4. Klõpsake hiireklahvi töölaual.

Ülesanne 2. Käivitame programmi Microsoft Word.

1. Klõpsake töölaual asuval tegumisribal nupule Start.
2. Valige stardimenüüst element Programs.
3. Valige avanenud alammenüüst element Microsoft Word.

Luua uue interneti dokumendi Microsoft Wordi abil võib ühega järgnevatest moodustest:

1. HTML lehekülje loomise targa või malli abil;
2. Salvestada olemasolev Word dokument HTML formaadis.

Interneti lehekülje loomiseks targa abiga tuleb valida dialoogiaknas New (avaneb kui valida punktist File korraldus New) lipik Web Pages. Seejärel tuleb avada tark, mis asub lipiku alamaknas element: Web Page Wizard.wiz ja klõpsata korraldusnupul OK. Seejärel tuleb vastata vaid targa küsimustele, täita vastavaid lahtreid vajaliku tekstiga või siis valida ühe pakutavatest variantidest. Nende tegevuste täitmine ei ole raske inimesele kes on juba tuttav töö põhivõtetega Microsoft Wordis.

Interneti lehekülje loomine olemasoleva dokumendi formaadi muutmise teel on teiseks võimalikuks variandiks.

Olles loonud HTML dokumendi ühe ülaltoodus moodusega võib edaspidi seda dokumenti redigeerida. Selleks on Wordis ette nähtud spetsiaalsed tööriistaribad, menüüpunktid ja funktsioonid.

Ülesanne 3. Loome uue tühja HTML dokumendi.

1. Käivitage (või aktiveerige kuva) Microsoft Word.
2. Valige punktist File korraldus New.
3. Avage dialoogiaknas New lipik Web Pages.
4. Valige lipiku Web Pages alamaknast element Blank Web Page.
5. Klõpsake korraldusnupul OK.
6. Valige punktist File korraldus Save või Save As…
7. Salvestage uus HTML dokument kausta "word97html" nimega: uus.
8. Lõpetage töö programmiga Microsoft Word 97.

Ülesanne 4. Vaatleme dokumendi "uus.htm" HTML koodi.

1. Käivitage programm Notepad (Start - Run … notepad - Enter).
2. Avage kaustast "word97html" dokument "uus.htm".
   
   Nagu näeme on olemas kõik juba tuttavad HTML elemendid. Juures on täiesti tühjal HTML dokumendil vaid järgmised teegid:
   
   <META NAME="Generator" CONTENT="Microsoft Word 97">
   <META NAME="Version" CONTENT="8.0.3410">
   <META NAME="Date" CONTENT="10/11/96">
   <META NAME="Template" CONTENT="C:\Program Files\Microsoft Office\Office\HTML.DOT">
   
   Teegis <META> olev informatsioon osutab sellele, et HTML dokument on loodud Microsoft Word 97 abil. Samuti antakse siin dokumendi loomise kuupäev ja mallina kasutatud šablooni nimetus. Loomulikult on need teegid minu koduarvutis oleva Microsoft Wordiga loodud tühjas HTML dokumendis, teie dokumendis võivad andmed olla erinevad. Leian, et kogu see informatsioon on üleliigne ja mittevajalik.
   
   
3. Kustutage ülaltoodud teegid.
4. Salvestage muudatus Notepadis ja sulgege programm.
   

Tärnidega- ja nummerdatud loendite loomine interneti lehekülgedel.

Nagu ka Wordi dokumentides võib ka HTML dokumentides luua loendeid. Loendid võivad HTML keeles olla tärnidega (Bulleted) ja numbritega (Numbered). Tärnidega loendis saab kasutada standardseid tärne, mille kuju realiseerimine on lehitseja ülesandeks ja ka graafilisi tärne, mida laaditakse kuvale eraldi failist. Nummerdatud loendite jaoks võib kasutada nii araabia kui ka rooma numbreid aga ka ladina tähti. Üksikasjalikum informatsioon loendite loomise kohta on toodud käesoleva kursuse II osas.

Ülesanne 5. Loome uue HTML dokumendi.

1. Käivitage Microsoft Word ja avage dokument "uus.htm".
2. Salvestage HTML dokument kausta uue nimega "loendid.htm".

Ülesanne 6. Loome tärnidega loendi.

1. Trükkige dokumendile "loendid.htm" pealkirjaks: Loendid.
2. Trükkige nüüd dokumenti järgmine lühike loendikatke:
   
   Eesti Telefon on loonud eraklientidele mitmeid sissehelistamise teenuseid:
   Atlas dial-up
   Atlas Boonus
   Atlas Surf
   Atlas Free
   
   
3. Märgistage loendi kõik neli elementi.
4. Valige punktist Format korraldus Bullets and Numbering …
   
   Tärnidega loendi loomisel on võimalus valida kas üks kolmest standardset tärnist (joonisel 1. ülemine rida) või siis graafilise tärni. Kui aga klõpsata korraldusnupule More…, siis saab valida tärniks suvalise olemasoleva graafilise faili.
   
   
5. Valige üks lipiku Bulleted tärnide standardtüüpidest (esimese rea kolm viimas elementi) ja klõpsake korraldusnupul OK.
   
   Loend vormindatakse teegi <UL> abil. Loendi elemendid aga teegi <LI> abil. Sõltuvalt valitud tärni tüübist on loendi teegis järgmised parameetrid:
   
   <UL> - kui on valitud esimene standardne tärn (must ring),
   <UL TYPE="circle"> - teine tärn (ruut),
   <UL TYPE="square"> - kolmas tärn (värvitud ruut).
   
   
6. Valige punktist View korraldus HTML Source …
   
   Dokumendi asemel kuvatakse selle HTML kood. Kui tärnina oli valitud esimene tärn, siis on HTML koodi lisatud järgmine teek:
   
   <UL>
   <LI>Atlas dial-up</LI>
   <LI>Atlas Boonus</LI>
   <LI>Atlas Surf</LI>
   <LI>Atlas Free</LI></UL>
   
   
7. HTML teegi redigeerimise režiimist väljumiseks klõpsake tööriistariba nupul Exit HTML Source.
8. Eemaldame standard tärnid loendi elementide eest.
9. Märgistage loendi elemendid ja valige punktist Format korraldus Bullets and Numbering …
10. Klõpsake lipiku Bulleted esimese rea esimesel elemendil None ja klõpsame ka korraldusnupule OK.
    
    Tärnid "kaovad" loendi elementide eest.
    
    
11. Jätke loendi elemendid märgistatuks.
12. Valige punktist Format korraldus Bullets and Numbering …
13. Klõpsake lipiku Bulleted suvalisel mittestandardsel graafilisel tärnil ja siis klõpsake ka korraldusnupul OK.
    
    Kui tärnidega loendi tärniks on valitud graafiline tärn, siis HTML koodis loendit tegelikul ei loodagi, st spetsiaalset teeki <UL> ei kasutata. Siin tuuakse iga loendi element esile lõigu teegiga <P>, millele eelneb kujutise teek <IMG>. tärni graafiline fail salvestatakse automaatselt kausta, milles asub ka HTML dokument.
    
    
14. Avage kaust ""word97html" " ja veenduge selles, et sinna on ilmunud tärni fail.
15. Valige punktist View korraldus HTML Source …
    
    Dokumendi asemel kuvatakse selle HTML kood. Kui tärnina oli valitud esimene graafiline tärn, siis on HTML koodi lisatud järgmine teek:
    
    <P><IMG SRC="Bullet1.gif" WIDTH=13 HEIGHT=13>&nbsp;Atlas dial-up </P>
    <P><IMG SRC="Bullet1.gif" WIDTH=13 HEIGHT=13>&nbsp;Atlas Boonus </P>
    <P><IMG SRC="Bullet1.gif" WIDTH=13 HEIGHT=13>&nbsp;Atlas Surf </P>
    <P><IMG SRC="Bullet1.gif" WIDTH=13 HEIGHT=13>&nbsp;Atlas Free</P></DIR>
    
    
16. HTML teegi redigeerimise režiimist väljumiseks klõpsake tööriistariba nupul Exit HTML Source.
17. Eemaldame standard tärnid loendi elementide eest.
18. Märgistage loendi elemendid ja valige punktist Format korraldus Bullets and Numbering …
19. Klõpsake lipiku Bulleted esimese rea esimesel elemendil None ja klõpsame ka korraldusnupule OK.
    
    Tärnid "EI KAO" loendi elementide eest. Nüüd tulebki esile erinevus standardsete ja graafiliste tärnide kasutamisel. Kui olid valitud standardsed tärnid, siis moodustati HTML koodis loend ja seega on töö sellise loendi eemaldamiseks sarnane tavalises Wordi dokumendis tehtava tööga. Piisab sellest, et märgistada vastav loend ja valida punktist Format korraldus Bullets and Numbering …ning siis lipikult Bulleted element None. Kui aga olid valitud graafilised tärnid, siis nii "lihtsalt" läbi ei saa. Graafiliste tärnide eemaldamiseks tuleb nad märgistada ühekaupa ja vajutada sõrmisele "Delete".
    
    
20. Kustutage nüüd loendi eest graafilised tärnid, märgistades neid ühekaupa ja vajutades sõrmisele "Delete".
    

Ülesanne 7. Loome nummerdatud loendi.

1. Märgistage loend.
2. Valige punktist Format korraldus Bullets and Numbering … ja seejärel avage lipik Numbered (vt. joon 2.).
   
   
3. Valige meelepärane numbritüüp ja vajutage korraldusnupule OK.
   
   Numeratsioon interneti lehekülgedel ei erine oluliselt numeratsioonist Wordi dokumentides. Erinevus seisneb selles, et interneti lehekülgedel ei ole võimalik automaatne struktuursete loendite ja pealkirjade numeratsioon.
   
   Sõltuvalt sellest, millise numeratsiooni tüübi te valisite genereeritakse järgmised koodid:
   
   <OL> - numeratsioon araabia numbritega,
   <OL TYPE="I"> - suurte rooma numbritega,
   <OL TYPE="i"> - väikeste rooma numbritega,
   <OL TYPE="A"> - suurte ladina tähtedega,
   <OL TYPE="a"> - väikeste ladina tähtedega.
   
   
4. Valige punktist View korraldus HTML Source …
   
   Dokumendi asemel kuvatakse selle HTML kood. Kui numbrina olid valitud suured rooma numbrid, siis on HTML koodi lisatud järgmine teek:
   
   <OL TYPE="I">
   <LI>Atlas dial-up </LI>
   <LI>Atlas Boonus </LI>
   <LI>Atlas Surf </LI>
   <LI>Atlas Free</LI></OL>
   
   
5. HTML teegi redigeerimise režiimist väljumiseks klõpsake tööriistariba nupul Exit HTML Source.
   

Ülesanne 8. Loome mitmetasemelise loendi.

1. Märgistage loendi teine rida.
2. Klõpsake tabulatsiooni sõrmist, mis asub vahetult Q tähest vasakul pool.
3. Märgistage loendi neljas rida.
4. Klõpsake tabulatsiooni sõrmist, mis asub vahetult Q tähest vasakul pool.
5. Salvestage muudatused dokumendis "loendid.htm" valides punktist File korralduse Save.

Märkus: Vaatamata sellele, et toodud loendite ehitamise soovitused on antud Word 97 loojate poolt ei tööta need alati korrektselt. Nii mõnigi kord on vaja soovitud tulemuse saavutamiseks käsitsi kohendada HTML koodi.