HTML ja CSS algajatele

HTML ja CSS algajatele (Osa 01): Esimene pilk HTMLile, CSSile ja muule.

Kõik õpetuse videod HTML ja CSS algajatele

Hüpertekstimärgistuskeel on WWW maja- ja kodukeel. Selle keele esimene versioon avaldati aastal 1992. Alates sellest ajast on HTML läbinud ja kogenud mitmeid muudatusi ning on nüüdseks jõudnud versioonini 5. (Kuigi versioon 5 pole tegelikult siiani ametlikult standardiks kinnitatud, toetatakse seda praegustes brauserites siiski juba üsna hästi).

HTML on nn märgistuskeel, mis võimaldab sisusid struktureerida. Sisu vormindamise eest vastutavad stiililehed. Lisateavet nende kohta tuleb järgmisena.

HTML edasiarendamise eest vastutab World Wide Web Consortium (lühend W3C).

W3C veebisaidil tasuks regulaarselt silma peal hoida, et olla kursis veebialaste viimaste arengutega.

Kui tegelete HTML-iga, on üks oluline küsimus: millist versiooni peaksite kasutama? Mõistetav on, et keel nagu HTML saab pidevalt uuendusi. Uued elemendid lisanduvad, vanad eemaldatakse.

Siin on olulisemad keeleversioonid või verstapostid HTML-s:

• HTML (november 1992): See oli esimene versioon. Siin oli rõhk ainult tekstidokumentidel.

• HTML 2.0 (november 1995): Nüüd on olemas ka pildi- ja vormielemendid.

• HTML 4.0 (detsember 1997): Lisati stiililehed, raamistikud ja skriptid.

• XHTML 1.0 (jaanuar 2000): See on HTML 4.0 uusvorm, kasutades XML-i.

• HTML5 (aprill 2009): See on endiselt tööprojekt, seega pole veel ametlik standard.

Järgmistes õpetustes keskendutakse HTML5-le. HTML5-ga peaks lõpuks taas läbi minema muutus HTML-maailmas. Uus spetsifikatsioon pakub mitmeid huvitavaid uuendusi, näiteks oluliselt mugavamad vormid, edusammude näitajad, märkelemendid ja parendatud dokumendistruktuur. Lisaks saab uue standardiga videoid veebisaitidele lisada pistikprogrammita ning on olemas lohistamis- ja mahapanemissisend.

HTML5 esimene ettepanek avaldati juba aastal 2004 veebihüperteksti rakendustöörühma (WHATWG) poolt nimega Veebirakendused 1.0.

Siiani pole HTML5 ametlikku standardit avaldatud, kuid brauseritootjad on juba paljusid HTML5-funktsioone oma toodetesse integreerinud. See pole üllatav, kuna WHATWG on brauseritootjate Apple, Mozilla ja Opera liit. WHATWG asutati reaktsioonina W3C poolt veebistandardite aeglaselt käimasolevale arengule.

Siinkohal võib küsida, mis pani brauseritootjaid oma HTML-standardi väljatöötama. Kuna seni oli HTML arendus olnud W3C kätes kindlalt, algasid probleemid brauseritootjate jaoks sellega, et W3C muutis HTML 4.01 enam-vähem korrektsete sisuliste parandusteta XHTML 1-ks. Alguses soovis W3C kehtestada XHTML 1 esimese sammuna suundumist XML-põhise veebi poole. Arengu lõpupoole pidi seisma XHTML 2. Just see W3C keskendumine XML-ile pani brauseritootjaid segadusse. Nende arvates on XML- lähenemine vaevalt praktiline ja ei kajasta tegelikult kasutajate soove. (Mida W3C loomulikult teisiti näeb).

Aastast 2007 alates arendavad W3C ja WHATWG koos HTML5 spetsifikatsiooni või töötavad selle kallal. HTML5 teemal on viimased arengud saadaval aadressil http://www.w3.org/TR/html5/.

Järgnevates õpetustes keskendutakse just HTML5-le.

Vormindamiseks CSS

Olete ilmselt juba kokku puutunud Wordi või muude tekstiredaktorite dokumentimallidega. Näiteks kui valite rea, saate valida vormindusmalli.

Sõltuvalt dokumendimalli vormindusest kuvatakse seejärel pealkiri. Dokumendimalli vahetamisel muutub ka pealkirja välimus.

Mis seos on nüüd Wordil HTML-iga? HTML-dokumentide jaoks on ka vormindusmalle. Need mallid saab määratleda CSS-i (Cascading Stylesheets) abil. Tänu CSS-ile saab näiteks määrata, et põhipealkirjad (h1) peaksid olema 22 pikslit suured ning rohelises Ariali kirjas.

Vajalikud elemendid

Järgnevates õpetustes õpite järk-järgult tundma HTML-i ja CSS-i. Veebilehtede loomiseks HTML-i ja CSS-i baasil pole vaja keerukat tarkvara. Lihtsaimal juhul saate kasutada Windowsi standardredaktorit.

Ta pole eriti mugav, kuid on alguseks piisav. Kes eelistab veidi mugavamat lahendust, peaks siiski otsima pigem "tõelist" HTML-redaktorit. Üheks klassikaks on muidugi Dreamweaver.

See redaktor pole aga tasuta.

HTML ja CSS algajatele (osake 01): Esimene pilk HTML-ile, CSS-ile ja muule.

Eratarbijatele on aga tasuta phase5 (http://www.phase5.info/). Kui soovite redaktorit kasutada eraotstarbel, siis saate siit hea ja tasuta tööriista.

HTML ja CSS algajatele (Osa 01): Esimene pilk HTML-ile, CSS-ile ja kaaslastele.



Peale redaktori peaksite omama ka kõige olulisemaid brausereid veebilehe testimiseks. Tegelikult tõlgendavad brauserid HTML-i ja CSS-i aeg-ajalt üsna omapäraselt. Selle taustal on erinevates brauserites põhjalik testimine kohustuslik. Omama peaksite vähemalt Internet Explorerit, Google Chrome'i ja Mozilla Firefoxi. Ideaalis testige veebilehte ka Operas ja tahvelarvutis/nutitelefonis.