Hinnavaatlus.ee Wiki - Kasutaja kaastööd [et]

Kuidas teha veebilehte

2007-11-02T11:51:21Z

JannoT: /* Inglise keeles */

Üldjoontes on veebileht lihtsalt üks tekstifail, milles olev tekst on markeeritud spetsiaalsete märgenditega kujul <code><märgend></code> ... <code></märgend></code>, ning veebilehe valmistamiseks pole tarvis keerukamat tarkvara Notepadi laadsest tekstiredaktorist.

See, [[millist programmi kasutada veebilehtede tegemiseks|millist konkreetset programmi kasutada veebilehtede tegemiseks]], on suuresti isikliku eelistuse küsimus - märksa olulisemad tarkvarast on aga teadmised, mida lehe koostamisel kasutada.

==HTML==

HTML (''HyperText Markup Language'' - hüperteksti ülestähendamise keel) on keel, millest veebi tegemise juures ei üle ega ümber, sest just selles keeles pannaksegi veebilehed kirja. Muidugi on olemas ka hulganisti programme, millega saab lehekülgi koostada ka see, kes HTML-ist kuulnudki pole. Oluline on aga meeles pidada, et oma tõelise potensiaalini sirutavad sellised programmid vaid nende kasutajate kätes, kes mõistavad HTML-i ka käsitsi kirjutada.

Pealegi on HTML niivõrd lihtne keel, et seda oleks lausa patt õppimata jätta, ning õppematerjali HTML-i kohta leidub lausa hunnikute viisi:

===Eesti keeles===

(Suur osa eestikeelsetest HTML-i õpetustest on kahjuks kaunikesti aegunud, mistõttu on mitmed lingid, mis ehk muidu peaksid selles nimekirjas olema, välja jäetud.)

*[http://et.wikibooks.org/wiki/HTML HTML-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav
*[http://lepo.it.da.ut.ee/~ajaeger/html-juhend.html HTML keele lühijuhend] sobib hästi kiireks sissejuhatuseks (pea meeles, et lõpetad lugemise, kui kohtad peatükki "NETSCAPE-LAIENDUSED")

===Inglise keeles===

*[http://www.w3schools.com/html/default.asp W3Schools'i HTML-i õpetus] ja *[http://www.w3schools.com/xhtml/default.asp XHTML-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://www.w3.org/TR/html4/ HTML 4.01 spetsifikatsioon]
*[http://tizag.com/htmlT/ HTML algajatele ja ka edasijõudnutele]

==CSS==

CSS on soovituslik keel veebilehtede kujundamiseks. Kui sinu veebilehed näevad välja robustsed ja kõledad, siis on just CSS-i puudutus arvatavasti see, mida vajad. CSS-i tasuks hakata õppima niipea, kui oled hakkama saanud oma esimeste HTML-i katsetustega. Kuigi, ka HTML-is on vahendeid lehekülje kujundamiseks, pakub CSS hulga rohkem võimalusi ning lisaks pääsed määratult väiksema hulga klaviatuuriklõbistamisega, sest muutes vaid ühtainust rida CSS-failis saad korraga ümber kujundada sadu või isegi tuhandeid veebilehti.

===Eesti keeles===

*[http://et.wikibooks.org/wiki/CSS CSS-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav

===Inglise keeles===

*[http://www.w3schools.com/css/default.asp W3Schools'i CSS-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://css.maxdesign.com.au/ Listutorial, Floatutorial, Selectutorial] - suurepärased õpetused CSS-iga listide kujundamiseks, ning float-idest ja selektoritest arusaamiseks.
*[http://css-discuss.incutio.com/ CSS-Discuss wiki] - põhjalik CSS-i wiki
*[http://www.w3.org/TR/2004/CR-CSS21-20040225/ CSS 2.1 spetsifikatsioon]
*[http://tizag.com/cssT/ CSS algajatele ja ka edasijõudnutele]

==JavaScript ja DOM==

JavaScriptiga on nõnda, et 90% lehekülgedest, kes seda kasutavad, tegelikult seda ei vaja, ning 90% nendest lehtedest, kes seda vajavad, kasutavad seda valesti. Ehkki JavaScripti massiliselt väärkasutatakse, ei tähenda see sugugi seda, et tegemist olekski kehva tehnoloogiaga. JavaScript on lihtsalt väga võimas tööriist, ning oskamatu meistrimees võib sellega oma lehekülje kergesti ära rikkuda.

Document Object Model ehk DOM kujutab endast liidest, mille kaudu programmeerija pääseb ligi HTML (või XML) dokumendi struktuurile. DOM võimaldab skriptil otsida välja vajalikud elemendid ning neid siis muuta ja neile uusi alamelemente lisada.

JavaScript on programmeerimiskeel, milles kirjutatud programme saab veebilehte külastavas brauseris jooksutada. JavaScript omakorda pääseb läbi DOM-i ligi HTML-ile. (Alates 1999. aastast vastab JavaScript ECMA-262 ehk ECMAScripti standardile.)

===Eesti keeles===

*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/js/juht.html Jaagup Kippari JavaScripti tutvustav lehekülg] pakub hulganisti näiteid, ehkki mitte kõik neist ei pruugi olla nn soovituslikud praktikad.

===Inglise keeles===

*[http://developer.mozilla.org/en/docs/JavaScript JavaScripti osa Mozilla Developer Center'is]
*[http://www.onlinetools.org/articles/unobtrusivejavascript/index.html Unobtrusive JavaScript] õpetab kasutama JavaScripti ja DOM-i nõnda, et hundid oleks söönud ja lambad terved
*[http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/ DOM Level 1 spetsifikatsioon]
*[http://www.ecma-international.org/publications/standards/Ecma-262.htm ECMAScripti spetsifikatsioon]
*[http://tizag.com/javascriptT/ JavaScript algajatele]
*[http://www.elated.com/articles/cat/javascript/ JavaScript algajatele scriptide näitel]

==Serveripoolne skriptimine==

Kui sa soovid, et sinu veebilehte külastav kodanik saaks teha midagi, millest ka peale tema leheküljelt lahkumist jälg maha jääks (näiteks võimalus leheküljele kommentaare jätta), siis pead kasutama mõne serveripoolse tehnoloogia abi.

Eestis on levinuim ja kõige kergemini kätte saadav (ka tasuta) PHP. Levinuimatest vahenditest võib veel nimetada järgmisi: Perl, Zope, J2EE, Ruby on rails, Microsoft ASP.NET, Macromedia Coldfusion.

Tüüpiliselt kuulub dünaamilise lehekülje juurde ka andmebaas. Loetlegem järgmisi: MySQL, PostrgeSQL, Microsoft SQL Server.

===Eesti keeles===

*[http://www.php.ee php.ee]
*[http://php.center.ee PHP Center]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/python/juht.html Jaagup Kippari leht Pythoni ja Zope-i kohta]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/perl/juht.html Sealtsamast ka Jaagupi õpetus Perli kohta]

===Inglise keeles===

*[http://www.php.net PHP ametlik kodulehekülg] sealt leiab ka [http://www.php.net/manual/en/ manuaali]
*[http://www.hudzilla.org/phpbook/ PHP in a Nutshell] on O'Reilly poolt kirjastatud raamat, mida aga saab läbi veebi täiesti tasuta lugeda
*[http://www.phpinfo.net/articles/article_php-coding-standard.html PHP kodeerimise standard]
*[http://tizag.com/phpT/ PHP algajatele ja ka edasijõudnutele]
*[http://phpsec.org/projects/guide/ PHP Security Guide]
*[http://www.zope.org Zope.org] - Pythoni põhine veebiserveritarkvara
*[http://dev.mysql.com/doc/refman/5.0/en/index.html MySQL-i manuaal]
*[http://www.perl.com/pub/q/documentation perl.com-i dokumentatsiooni leht] sisaldab palju-palju kasulikku infot Perli kohta. Kui standardsest funktsionaalsusest puudu jääb, saab alati pöörduda [http://www.perl.com/CPAN/README.html CPAN-i] poole.

==Veebitegemisest üldiselt==

Küllaltki palju kasulikku nõu kõige kohta, mis seondub veebitegemisega, saab järjekordsest tasuta kättesaadavast raamatust, millel nimeks [http://www.webstyleguide.com/index.html Web Style Guide].

Palju sisukaid artikleid leiab veebistandarditele orienteeritud ajakirjast [http://www.alistapart.com/ A List Apart].

===Käideldavus ja kasutatavus===

Kaks kohta, mida kindlasti tuleks külastada on Vincent Flanders'i [http://www.webpagesthatsuck.com/ Web Pages That Suck] ning Jakob Nielseni [http://www.useit.com/alertbox/ Alertbox].

Eesti kodanikuna ei maksaks ära unustada, et on olemas [http://www.riik.ee/kord/wwwjuhend.html Soovitused Eesti riigiasutuste avalike veebilehtede koostamiseks] ning [http://www.eki.ee/itstandard/sisukord.html Infotehnoloogia reeglid eesti keele ja kultuuri keskkonnas].

Ära ei tasu unustada ka [http://www.hot.ee/jurand/index2.html Jurandi kodukat].

Kuna käsikaudu võib lehekülgede käideldavuse hindamine vaevarikkaks tegevuseks osutuda, siis on olemas hulganisti vahendeid, mis sind aitavad:

*[http://www.contentquality.com/ Cynthia Says] kontrollib lehkülje vastavust WCAG ja Section 508 nõuetele.
*[http://webxact.watchfire.com/ Watchfire WebXACT] testib lehekülgi väga mitmetest aspektidest lähtuvalt
*[http://www.w3.org/2003/12/semantic-extractor.html W3C Semantic data extractor] proovib leheküljelt välja lugeda võimalikult palju semantilist infot
*[http://colorfilter.wickline.org/ Värvipimedust teesklev veebilehe filter], et sa oskaksid aimata, kuidas võivad värvipimedad su lehte näha
*Firefoxi laiendus [http://www.standards-schmandards.com/index.php?show/fangs Fangs] võimaldab sul aga ette kujutada, milline "näeb" veeb välja pimedate jaoks

===Validaatorid===

Eksimine on inimlik ning seetõttu tuleb kasuks, kui kontrollida oma lehekülje koodi validaatoritega:

*[http://validator.w3.org W3C HTML-i validaator]
*[http://www.htmlhelp.com/tools/validator/ WDG HTML-i validaator] (võimalus valideerida kogu lehekülg, kui lehtede arv jääb alla saja)
*[http://jigsaw.w3.org/css-validator/ W3C CSS-i validaator]
*[http://feedvalidator.org/ RSS ja Atom uudisvoogide validaator]
*[http://www.jslint.com/lint.html JSLint] kontrollib JavaScripti koodi võimalike vigade suhtes.

Ning mitte üksnes koodi:

*[http://www.filosoft.ee/html_speller_et/ Eesti keele speller]

===Varia===

*[http://www.lipsum.com/ Lipsum generator] - kui sul mõlgub meeles Lorem ipsum dolor...
*[http://typetester.maratz.com/ Typetester] - võimalus kõrvutada ekraanil erinevaid fonte ja valida oma veebilehe jaoks seeläbi sobivaim.

[[Kategooria:Tarkvara]]

Kuidas teha veebilehte

2007-11-02T11:48:58Z

JannoT: /* Inglise keeles */

Üldjoontes on veebileht lihtsalt üks tekstifail, milles olev tekst on markeeritud spetsiaalsete märgenditega kujul <code><märgend></code> ... <code></märgend></code>, ning veebilehe valmistamiseks pole tarvis keerukamat tarkvara Notepadi laadsest tekstiredaktorist.

See, [[millist programmi kasutada veebilehtede tegemiseks|millist konkreetset programmi kasutada veebilehtede tegemiseks]], on suuresti isikliku eelistuse küsimus - märksa olulisemad tarkvarast on aga teadmised, mida lehe koostamisel kasutada.

==HTML==

HTML (''HyperText Markup Language'' - hüperteksti ülestähendamise keel) on keel, millest veebi tegemise juures ei üle ega ümber, sest just selles keeles pannaksegi veebilehed kirja. Muidugi on olemas ka hulganisti programme, millega saab lehekülgi koostada ka see, kes HTML-ist kuulnudki pole. Oluline on aga meeles pidada, et oma tõelise potensiaalini sirutavad sellised programmid vaid nende kasutajate kätes, kes mõistavad HTML-i ka käsitsi kirjutada.

Pealegi on HTML niivõrd lihtne keel, et seda oleks lausa patt õppimata jätta, ning õppematerjali HTML-i kohta leidub lausa hunnikute viisi:

===Eesti keeles===

(Suur osa eestikeelsetest HTML-i õpetustest on kahjuks kaunikesti aegunud, mistõttu on mitmed lingid, mis ehk muidu peaksid selles nimekirjas olema, välja jäetud.)

*[http://et.wikibooks.org/wiki/HTML HTML-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav
*[http://lepo.it.da.ut.ee/~ajaeger/html-juhend.html HTML keele lühijuhend] sobib hästi kiireks sissejuhatuseks (pea meeles, et lõpetad lugemise, kui kohtad peatükki "NETSCAPE-LAIENDUSED")

===Inglise keeles===

*[http://www.w3schools.com/html/default.asp W3Schools'i HTML-i õpetus] ja *[http://www.w3schools.com/xhtml/default.asp XHTML-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://www.w3.org/TR/html4/ HTML 4.01 spetsifikatsioon]
*[http://tizag.com/htmlT/ HTML algajatele ja ka edasijõudnutele]

==CSS==

CSS on soovituslik keel veebilehtede kujundamiseks. Kui sinu veebilehed näevad välja robustsed ja kõledad, siis on just CSS-i puudutus arvatavasti see, mida vajad. CSS-i tasuks hakata õppima niipea, kui oled hakkama saanud oma esimeste HTML-i katsetustega. Kuigi, ka HTML-is on vahendeid lehekülje kujundamiseks, pakub CSS hulga rohkem võimalusi ning lisaks pääsed määratult väiksema hulga klaviatuuriklõbistamisega, sest muutes vaid ühtainust rida CSS-failis saad korraga ümber kujundada sadu või isegi tuhandeid veebilehti.

===Eesti keeles===

*[http://et.wikibooks.org/wiki/CSS CSS-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav

===Inglise keeles===

*[http://www.w3schools.com/css/default.asp W3Schools'i CSS-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://css.maxdesign.com.au/ Listutorial, Floatutorial, Selectutorial] - suurepärased õpetused CSS-iga listide kujundamiseks, ning float-idest ja selektoritest arusaamiseks.
*[http://css-discuss.incutio.com/ CSS-Discuss wiki] - põhjalik CSS-i wiki
*[http://www.w3.org/TR/2004/CR-CSS21-20040225/ CSS 2.1 spetsifikatsioon]
*[http://tizag.com/cssT/ CSS algajatele ja ka edasijõudnutele]

==JavaScript ja DOM==

JavaScriptiga on nõnda, et 90% lehekülgedest, kes seda kasutavad, tegelikult seda ei vaja, ning 90% nendest lehtedest, kes seda vajavad, kasutavad seda valesti. Ehkki JavaScripti massiliselt väärkasutatakse, ei tähenda see sugugi seda, et tegemist olekski kehva tehnoloogiaga. JavaScript on lihtsalt väga võimas tööriist, ning oskamatu meistrimees võib sellega oma lehekülje kergesti ära rikkuda.

Document Object Model ehk DOM kujutab endast liidest, mille kaudu programmeerija pääseb ligi HTML (või XML) dokumendi struktuurile. DOM võimaldab skriptil otsida välja vajalikud elemendid ning neid siis muuta ja neile uusi alamelemente lisada.

JavaScript on programmeerimiskeel, milles kirjutatud programme saab veebilehte külastavas brauseris jooksutada. JavaScript omakorda pääseb läbi DOM-i ligi HTML-ile. (Alates 1999. aastast vastab JavaScript ECMA-262 ehk ECMAScripti standardile.)

===Eesti keeles===

*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/js/juht.html Jaagup Kippari JavaScripti tutvustav lehekülg] pakub hulganisti näiteid, ehkki mitte kõik neist ei pruugi olla nn soovituslikud praktikad.

===Inglise keeles===

*[http://developer.mozilla.org/en/docs/JavaScript JavaScripti osa Mozilla Developer Center'is]
*[http://www.onlinetools.org/articles/unobtrusivejavascript/index.html Unobtrusive JavaScript] õpetab kasutama JavaScripti ja DOM-i nõnda, et hundid oleks söönud ja lambad terved
*[http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/ DOM Level 1 spetsifikatsioon]
*[http://www.ecma-international.org/publications/standards/Ecma-262.htm ECMAScripti spetsifikatsioon]

==Serveripoolne skriptimine==

Kui sa soovid, et sinu veebilehte külastav kodanik saaks teha midagi, millest ka peale tema leheküljelt lahkumist jälg maha jääks (näiteks võimalus leheküljele kommentaare jätta), siis pead kasutama mõne serveripoolse tehnoloogia abi.

Eestis on levinuim ja kõige kergemini kätte saadav (ka tasuta) PHP. Levinuimatest vahenditest võib veel nimetada järgmisi: Perl, Zope, J2EE, Ruby on rails, Microsoft ASP.NET, Macromedia Coldfusion.

Tüüpiliselt kuulub dünaamilise lehekülje juurde ka andmebaas. Loetlegem järgmisi: MySQL, PostrgeSQL, Microsoft SQL Server.

===Eesti keeles===

*[http://www.php.ee php.ee]
*[http://php.center.ee PHP Center]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/python/juht.html Jaagup Kippari leht Pythoni ja Zope-i kohta]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/perl/juht.html Sealtsamast ka Jaagupi õpetus Perli kohta]

===Inglise keeles===

*[http://www.php.net PHP ametlik kodulehekülg] sealt leiab ka [http://www.php.net/manual/en/ manuaali]
*[http://www.hudzilla.org/phpbook/ PHP in a Nutshell] on O'Reilly poolt kirjastatud raamat, mida aga saab läbi veebi täiesti tasuta lugeda
*[http://www.phpinfo.net/articles/article_php-coding-standard.html PHP kodeerimise standard]
*[http://tizag.com/phpT/ PHP algajatele ja ka edasijõudnutele]
*[http://phpsec.org/projects/guide/ PHP Security Guide]
*[http://www.zope.org Zope.org] - Pythoni põhine veebiserveritarkvara
*[http://dev.mysql.com/doc/refman/5.0/en/index.html MySQL-i manuaal]
*[http://www.perl.com/pub/q/documentation perl.com-i dokumentatsiooni leht] sisaldab palju-palju kasulikku infot Perli kohta. Kui standardsest funktsionaalsusest puudu jääb, saab alati pöörduda [http://www.perl.com/CPAN/README.html CPAN-i] poole.

==Veebitegemisest üldiselt==

Küllaltki palju kasulikku nõu kõige kohta, mis seondub veebitegemisega, saab järjekordsest tasuta kättesaadavast raamatust, millel nimeks [http://www.webstyleguide.com/index.html Web Style Guide].

Palju sisukaid artikleid leiab veebistandarditele orienteeritud ajakirjast [http://www.alistapart.com/ A List Apart].

===Käideldavus ja kasutatavus===

Kaks kohta, mida kindlasti tuleks külastada on Vincent Flanders'i [http://www.webpagesthatsuck.com/ Web Pages That Suck] ning Jakob Nielseni [http://www.useit.com/alertbox/ Alertbox].

Eesti kodanikuna ei maksaks ära unustada, et on olemas [http://www.riik.ee/kord/wwwjuhend.html Soovitused Eesti riigiasutuste avalike veebilehtede koostamiseks] ning [http://www.eki.ee/itstandard/sisukord.html Infotehnoloogia reeglid eesti keele ja kultuuri keskkonnas].

Ära ei tasu unustada ka [http://www.hot.ee/jurand/index2.html Jurandi kodukat].

Kuna käsikaudu võib lehekülgede käideldavuse hindamine vaevarikkaks tegevuseks osutuda, siis on olemas hulganisti vahendeid, mis sind aitavad:

*[http://www.contentquality.com/ Cynthia Says] kontrollib lehkülje vastavust WCAG ja Section 508 nõuetele.
*[http://webxact.watchfire.com/ Watchfire WebXACT] testib lehekülgi väga mitmetest aspektidest lähtuvalt
*[http://www.w3.org/2003/12/semantic-extractor.html W3C Semantic data extractor] proovib leheküljelt välja lugeda võimalikult palju semantilist infot
*[http://colorfilter.wickline.org/ Värvipimedust teesklev veebilehe filter], et sa oskaksid aimata, kuidas võivad värvipimedad su lehte näha
*Firefoxi laiendus [http://www.standards-schmandards.com/index.php?show/fangs Fangs] võimaldab sul aga ette kujutada, milline "näeb" veeb välja pimedate jaoks

===Validaatorid===

Eksimine on inimlik ning seetõttu tuleb kasuks, kui kontrollida oma lehekülje koodi validaatoritega:

*[http://validator.w3.org W3C HTML-i validaator]
*[http://www.htmlhelp.com/tools/validator/ WDG HTML-i validaator] (võimalus valideerida kogu lehekülg, kui lehtede arv jääb alla saja)
*[http://jigsaw.w3.org/css-validator/ W3C CSS-i validaator]
*[http://feedvalidator.org/ RSS ja Atom uudisvoogide validaator]
*[http://www.jslint.com/lint.html JSLint] kontrollib JavaScripti koodi võimalike vigade suhtes.

Ning mitte üksnes koodi:

*[http://www.filosoft.ee/html_speller_et/ Eesti keele speller]

===Varia===

*[http://www.lipsum.com/ Lipsum generator] - kui sul mõlgub meeles Lorem ipsum dolor...
*[http://typetester.maratz.com/ Typetester] - võimalus kõrvutada ekraanil erinevaid fonte ja valida oma veebilehe jaoks seeläbi sobivaim.

[[Kategooria:Tarkvara]]

Kuidas teha veebilehte

2007-11-02T11:47:51Z

JannoT: /* Inglise keeles */

Üldjoontes on veebileht lihtsalt üks tekstifail, milles olev tekst on markeeritud spetsiaalsete märgenditega kujul <code><märgend></code> ... <code></märgend></code>, ning veebilehe valmistamiseks pole tarvis keerukamat tarkvara Notepadi laadsest tekstiredaktorist.

See, [[millist programmi kasutada veebilehtede tegemiseks|millist konkreetset programmi kasutada veebilehtede tegemiseks]], on suuresti isikliku eelistuse küsimus - märksa olulisemad tarkvarast on aga teadmised, mida lehe koostamisel kasutada.

==HTML==

HTML (''HyperText Markup Language'' - hüperteksti ülestähendamise keel) on keel, millest veebi tegemise juures ei üle ega ümber, sest just selles keeles pannaksegi veebilehed kirja. Muidugi on olemas ka hulganisti programme, millega saab lehekülgi koostada ka see, kes HTML-ist kuulnudki pole. Oluline on aga meeles pidada, et oma tõelise potensiaalini sirutavad sellised programmid vaid nende kasutajate kätes, kes mõistavad HTML-i ka käsitsi kirjutada.

Pealegi on HTML niivõrd lihtne keel, et seda oleks lausa patt õppimata jätta, ning õppematerjali HTML-i kohta leidub lausa hunnikute viisi:

===Eesti keeles===

(Suur osa eestikeelsetest HTML-i õpetustest on kahjuks kaunikesti aegunud, mistõttu on mitmed lingid, mis ehk muidu peaksid selles nimekirjas olema, välja jäetud.)

*[http://et.wikibooks.org/wiki/HTML HTML-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav
*[http://lepo.it.da.ut.ee/~ajaeger/html-juhend.html HTML keele lühijuhend] sobib hästi kiireks sissejuhatuseks (pea meeles, et lõpetad lugemise, kui kohtad peatükki "NETSCAPE-LAIENDUSED")

===Inglise keeles===

*[http://www.w3schools.com/html/default.asp W3Schools'i HTML-i õpetus] ja *[http://www.w3schools.com/xhtml/default.asp XHTML-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://www.w3.org/TR/html4/ HTML 4.01 spetsifikatsioon]
*[http://tizag.com/htmlT/ HTML algajatele ja ka edasijõudnutele]

==CSS==

CSS on soovituslik keel veebilehtede kujundamiseks. Kui sinu veebilehed näevad välja robustsed ja kõledad, siis on just CSS-i puudutus arvatavasti see, mida vajad. CSS-i tasuks hakata õppima niipea, kui oled hakkama saanud oma esimeste HTML-i katsetustega. Kuigi, ka HTML-is on vahendeid lehekülje kujundamiseks, pakub CSS hulga rohkem võimalusi ning lisaks pääsed määratult väiksema hulga klaviatuuriklõbistamisega, sest muutes vaid ühtainust rida CSS-failis saad korraga ümber kujundada sadu või isegi tuhandeid veebilehti.

===Eesti keeles===

*[http://et.wikibooks.org/wiki/CSS CSS-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav

===Inglise keeles===

*[http://www.w3schools.com/css/default.asp W3Schools'i CSS-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://css.maxdesign.com.au/ Listutorial, Floatutorial, Selectutorial] - suurepärased õpetused CSS-iga listide kujundamiseks, ning float-idest ja selektoritest arusaamiseks.
*[http://css-discuss.incutio.com/ CSS-Discuss wiki] - põhjalik CSS-i wiki
*[http://www.w3.org/TR/2004/CR-CSS21-20040225/ CSS 2.1 spetsifikatsioon]
*[http://tizag.com/cssT/ CSS algajatele ja ka edasijõudnutele]

==JavaScript ja DOM==

JavaScriptiga on nõnda, et 90% lehekülgedest, kes seda kasutavad, tegelikult seda ei vaja, ning 90% nendest lehtedest, kes seda vajavad, kasutavad seda valesti. Ehkki JavaScripti massiliselt väärkasutatakse, ei tähenda see sugugi seda, et tegemist olekski kehva tehnoloogiaga. JavaScript on lihtsalt väga võimas tööriist, ning oskamatu meistrimees võib sellega oma lehekülje kergesti ära rikkuda.

Document Object Model ehk DOM kujutab endast liidest, mille kaudu programmeerija pääseb ligi HTML (või XML) dokumendi struktuurile. DOM võimaldab skriptil otsida välja vajalikud elemendid ning neid siis muuta ja neile uusi alamelemente lisada.

JavaScript on programmeerimiskeel, milles kirjutatud programme saab veebilehte külastavas brauseris jooksutada. JavaScript omakorda pääseb läbi DOM-i ligi HTML-ile. (Alates 1999. aastast vastab JavaScript ECMA-262 ehk ECMAScripti standardile.)

===Eesti keeles===

*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/js/juht.html Jaagup Kippari JavaScripti tutvustav lehekülg] pakub hulganisti näiteid, ehkki mitte kõik neist ei pruugi olla nn soovituslikud praktikad.

===Inglise keeles===

*[http://developer.mozilla.org/en/docs/JavaScript JavaScripti osa Mozilla Developer Center'is]
*[http://www.onlinetools.org/articles/unobtrusivejavascript/index.html Unobtrusive JavaScript] õpetab kasutama JavaScripti ja DOM-i nõnda, et hundid oleks söönud ja lambad terved
*[http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/ DOM Level 1 spetsifikatsioon]
*[http://www.ecma-international.org/publications/standards/Ecma-262.htm ECMAScripti spetsifikatsioon]

==Serveripoolne skriptimine==

Kui sa soovid, et sinu veebilehte külastav kodanik saaks teha midagi, millest ka peale tema leheküljelt lahkumist jälg maha jääks (näiteks võimalus leheküljele kommentaare jätta), siis pead kasutama mõne serveripoolse tehnoloogia abi.

Eestis on levinuim ja kõige kergemini kätte saadav (ka tasuta) PHP. Levinuimatest vahenditest võib veel nimetada järgmisi: Perl, Zope, J2EE, Ruby on rails, Microsoft ASP.NET, Macromedia Coldfusion.

Tüüpiliselt kuulub dünaamilise lehekülje juurde ka andmebaas. Loetlegem järgmisi: MySQL, PostrgeSQL, Microsoft SQL Server.

===Eesti keeles===

*[http://www.php.ee php.ee]
*[http://php.center.ee PHP Center]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/python/juht.html Jaagup Kippari leht Pythoni ja Zope-i kohta]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/perl/juht.html Sealtsamast ka Jaagupi õpetus Perli kohta]

===Inglise keeles===

*[http://www.php.net PHP ametlik kodulehekülg] sealt leiab ka [http://www.php.net/manual/en/ manuaali]
*[http://www.hudzilla.org/phpbook/ PHP in a Nutshell] on O'Reilly poolt kirjastatud raamat, mida aga saab läbi veebi täiesti tasuta lugeda
*[http://www.phpinfo.net/articles/article_php-coding-standard.html PHP kodeerimise standard]
*[http://phpsec.org/projects/guide/ PHP Security Guide]
*[http://www.zope.org Zope.org] - Pythoni põhine veebiserveritarkvara
*[http://dev.mysql.com/doc/refman/5.0/en/index.html MySQL-i manuaal]
*[http://www.perl.com/pub/q/documentation perl.com-i dokumentatsiooni leht] sisaldab palju-palju kasulikku infot Perli kohta. Kui standardsest funktsionaalsusest puudu jääb, saab alati pöörduda [http://www.perl.com/CPAN/README.html CPAN-i] poole.

==Veebitegemisest üldiselt==

Küllaltki palju kasulikku nõu kõige kohta, mis seondub veebitegemisega, saab järjekordsest tasuta kättesaadavast raamatust, millel nimeks [http://www.webstyleguide.com/index.html Web Style Guide].

Palju sisukaid artikleid leiab veebistandarditele orienteeritud ajakirjast [http://www.alistapart.com/ A List Apart].

===Käideldavus ja kasutatavus===

Kaks kohta, mida kindlasti tuleks külastada on Vincent Flanders'i [http://www.webpagesthatsuck.com/ Web Pages That Suck] ning Jakob Nielseni [http://www.useit.com/alertbox/ Alertbox].

Eesti kodanikuna ei maksaks ära unustada, et on olemas [http://www.riik.ee/kord/wwwjuhend.html Soovitused Eesti riigiasutuste avalike veebilehtede koostamiseks] ning [http://www.eki.ee/itstandard/sisukord.html Infotehnoloogia reeglid eesti keele ja kultuuri keskkonnas].

Ära ei tasu unustada ka [http://www.hot.ee/jurand/index2.html Jurandi kodukat].

Kuna käsikaudu võib lehekülgede käideldavuse hindamine vaevarikkaks tegevuseks osutuda, siis on olemas hulganisti vahendeid, mis sind aitavad:

*[http://www.contentquality.com/ Cynthia Says] kontrollib lehkülje vastavust WCAG ja Section 508 nõuetele.
*[http://webxact.watchfire.com/ Watchfire WebXACT] testib lehekülgi väga mitmetest aspektidest lähtuvalt
*[http://www.w3.org/2003/12/semantic-extractor.html W3C Semantic data extractor] proovib leheküljelt välja lugeda võimalikult palju semantilist infot
*[http://colorfilter.wickline.org/ Värvipimedust teesklev veebilehe filter], et sa oskaksid aimata, kuidas võivad värvipimedad su lehte näha
*Firefoxi laiendus [http://www.standards-schmandards.com/index.php?show/fangs Fangs] võimaldab sul aga ette kujutada, milline "näeb" veeb välja pimedate jaoks

===Validaatorid===

Eksimine on inimlik ning seetõttu tuleb kasuks, kui kontrollida oma lehekülje koodi validaatoritega:

*[http://validator.w3.org W3C HTML-i validaator]
*[http://www.htmlhelp.com/tools/validator/ WDG HTML-i validaator] (võimalus valideerida kogu lehekülg, kui lehtede arv jääb alla saja)
*[http://jigsaw.w3.org/css-validator/ W3C CSS-i validaator]
*[http://feedvalidator.org/ RSS ja Atom uudisvoogide validaator]
*[http://www.jslint.com/lint.html JSLint] kontrollib JavaScripti koodi võimalike vigade suhtes.

Ning mitte üksnes koodi:

*[http://www.filosoft.ee/html_speller_et/ Eesti keele speller]

===Varia===

*[http://www.lipsum.com/ Lipsum generator] - kui sul mõlgub meeles Lorem ipsum dolor...
*[http://typetester.maratz.com/ Typetester] - võimalus kõrvutada ekraanil erinevaid fonte ja valida oma veebilehe jaoks seeläbi sobivaim.

[[Kategooria:Tarkvara]]

Kuidas teha veebilehte

2007-11-02T11:47:03Z

JannoT: /* Inglise keeles */

Üldjoontes on veebileht lihtsalt üks tekstifail, milles olev tekst on markeeritud spetsiaalsete märgenditega kujul <code><märgend></code> ... <code></märgend></code>, ning veebilehe valmistamiseks pole tarvis keerukamat tarkvara Notepadi laadsest tekstiredaktorist.

See, [[millist programmi kasutada veebilehtede tegemiseks|millist konkreetset programmi kasutada veebilehtede tegemiseks]], on suuresti isikliku eelistuse küsimus - märksa olulisemad tarkvarast on aga teadmised, mida lehe koostamisel kasutada.

==HTML==

HTML (''HyperText Markup Language'' - hüperteksti ülestähendamise keel) on keel, millest veebi tegemise juures ei üle ega ümber, sest just selles keeles pannaksegi veebilehed kirja. Muidugi on olemas ka hulganisti programme, millega saab lehekülgi koostada ka see, kes HTML-ist kuulnudki pole. Oluline on aga meeles pidada, et oma tõelise potensiaalini sirutavad sellised programmid vaid nende kasutajate kätes, kes mõistavad HTML-i ka käsitsi kirjutada.

Pealegi on HTML niivõrd lihtne keel, et seda oleks lausa patt õppimata jätta, ning õppematerjali HTML-i kohta leidub lausa hunnikute viisi:

===Eesti keeles===

(Suur osa eestikeelsetest HTML-i õpetustest on kahjuks kaunikesti aegunud, mistõttu on mitmed lingid, mis ehk muidu peaksid selles nimekirjas olema, välja jäetud.)

*[http://et.wikibooks.org/wiki/HTML HTML-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav
*[http://lepo.it.da.ut.ee/~ajaeger/html-juhend.html HTML keele lühijuhend] sobib hästi kiireks sissejuhatuseks (pea meeles, et lõpetad lugemise, kui kohtad peatükki "NETSCAPE-LAIENDUSED")

===Inglise keeles===

*[http://www.w3schools.com/html/default.asp W3Schools'i HTML-i õpetus] ja *[http://www.w3schools.com/xhtml/default.asp XHTML-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://www.w3.org/TR/html4/ HTML 4.01 spetsifikatsioon]
*[http://tizag.com/htmlT/ HTML algajatele ja ka edasijõudnutele]

==CSS==

CSS on soovituslik keel veebilehtede kujundamiseks. Kui sinu veebilehed näevad välja robustsed ja kõledad, siis on just CSS-i puudutus arvatavasti see, mida vajad. CSS-i tasuks hakata õppima niipea, kui oled hakkama saanud oma esimeste HTML-i katsetustega. Kuigi, ka HTML-is on vahendeid lehekülje kujundamiseks, pakub CSS hulga rohkem võimalusi ning lisaks pääsed määratult väiksema hulga klaviatuuriklõbistamisega, sest muutes vaid ühtainust rida CSS-failis saad korraga ümber kujundada sadu või isegi tuhandeid veebilehti.

===Eesti keeles===

*[http://et.wikibooks.org/wiki/CSS CSS-i raamat Vikiraamatukogus] on samamoodi nagu HV viki vabalt igaühe poolt täiendatav

===Inglise keeles===

*[http://www.w3schools.com/css/default.asp W3Schools'i CSS-i õpetus]
*[http://www.htmldog.com/ HTML Dog] pakub õpetusi nii päris algajatele kui ka edasijõudnutele
*[http://css.maxdesign.com.au/ Listutorial, Floatutorial, Selectutorial] - suurepärased õpetused CSS-iga listide kujundamiseks, ning float-idest ja selektoritest arusaamiseks.
*[http://css-discuss.incutio.com/ CSS-Discuss wiki] - põhjalik CSS-i wiki
*[http://www.w3.org/TR/2004/CR-CSS21-20040225/ CSS 2.1 spetsifikatsioon]

==JavaScript ja DOM==

JavaScriptiga on nõnda, et 90% lehekülgedest, kes seda kasutavad, tegelikult seda ei vaja, ning 90% nendest lehtedest, kes seda vajavad, kasutavad seda valesti. Ehkki JavaScripti massiliselt väärkasutatakse, ei tähenda see sugugi seda, et tegemist olekski kehva tehnoloogiaga. JavaScript on lihtsalt väga võimas tööriist, ning oskamatu meistrimees võib sellega oma lehekülje kergesti ära rikkuda.

Document Object Model ehk DOM kujutab endast liidest, mille kaudu programmeerija pääseb ligi HTML (või XML) dokumendi struktuurile. DOM võimaldab skriptil otsida välja vajalikud elemendid ning neid siis muuta ja neile uusi alamelemente lisada.

JavaScript on programmeerimiskeel, milles kirjutatud programme saab veebilehte külastavas brauseris jooksutada. JavaScript omakorda pääseb läbi DOM-i ligi HTML-ile. (Alates 1999. aastast vastab JavaScript ECMA-262 ehk ECMAScripti standardile.)

===Eesti keeles===

*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/js/juht.html Jaagup Kippari JavaScripti tutvustav lehekülg] pakub hulganisti näiteid, ehkki mitte kõik neist ei pruugi olla nn soovituslikud praktikad.

===Inglise keeles===

*[http://developer.mozilla.org/en/docs/JavaScript JavaScripti osa Mozilla Developer Center'is]
*[http://www.onlinetools.org/articles/unobtrusivejavascript/index.html Unobtrusive JavaScript] õpetab kasutama JavaScripti ja DOM-i nõnda, et hundid oleks söönud ja lambad terved
*[http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/ DOM Level 1 spetsifikatsioon]
*[http://www.ecma-international.org/publications/standards/Ecma-262.htm ECMAScripti spetsifikatsioon]

==Serveripoolne skriptimine==

Kui sa soovid, et sinu veebilehte külastav kodanik saaks teha midagi, millest ka peale tema leheküljelt lahkumist jälg maha jääks (näiteks võimalus leheküljele kommentaare jätta), siis pead kasutama mõne serveripoolse tehnoloogia abi.

Eestis on levinuim ja kõige kergemini kätte saadav (ka tasuta) PHP. Levinuimatest vahenditest võib veel nimetada järgmisi: Perl, Zope, J2EE, Ruby on rails, Microsoft ASP.NET, Macromedia Coldfusion.

Tüüpiliselt kuulub dünaamilise lehekülje juurde ka andmebaas. Loetlegem järgmisi: MySQL, PostrgeSQL, Microsoft SQL Server.

===Eesti keeles===

*[http://www.php.ee php.ee]
*[http://php.center.ee PHP Center]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/python/juht.html Jaagup Kippari leht Pythoni ja Zope-i kohta]
*[http://minitorn.tpu.ee/~jaagup/kool/java/naited20/html/perl/juht.html Sealtsamast ka Jaagupi õpetus Perli kohta]

===Inglise keeles===

*[http://www.php.net PHP ametlik kodulehekülg] sealt leiab ka [http://www.php.net/manual/en/ manuaali]
*[http://www.hudzilla.org/phpbook/ PHP in a Nutshell] on O'Reilly poolt kirjastatud raamat, mida aga saab läbi veebi täiesti tasuta lugeda
*[http://www.phpinfo.net/articles/article_php-coding-standard.html PHP kodeerimise standard]
*[http://phpsec.org/projects/guide/ PHP Security Guide]
*[http://www.zope.org Zope.org] - Pythoni põhine veebiserveritarkvara
*[http://dev.mysql.com/doc/refman/5.0/en/index.html MySQL-i manuaal]
*[http://www.perl.com/pub/q/documentation perl.com-i dokumentatsiooni leht] sisaldab palju-palju kasulikku infot Perli kohta. Kui standardsest funktsionaalsusest puudu jääb, saab alati pöörduda [http://www.perl.com/CPAN/README.html CPAN-i] poole.

==Veebitegemisest üldiselt==

Küllaltki palju kasulikku nõu kõige kohta, mis seondub veebitegemisega, saab järjekordsest tasuta kättesaadavast raamatust, millel nimeks [http://www.webstyleguide.com/index.html Web Style Guide].

Palju sisukaid artikleid leiab veebistandarditele orienteeritud ajakirjast [http://www.alistapart.com/ A List Apart].

===Käideldavus ja kasutatavus===

Kaks kohta, mida kindlasti tuleks külastada on Vincent Flanders'i [http://www.webpagesthatsuck.com/ Web Pages That Suck] ning Jakob Nielseni [http://www.useit.com/alertbox/ Alertbox].

Eesti kodanikuna ei maksaks ära unustada, et on olemas [http://www.riik.ee/kord/wwwjuhend.html Soovitused Eesti riigiasutuste avalike veebilehtede koostamiseks] ning [http://www.eki.ee/itstandard/sisukord.html Infotehnoloogia reeglid eesti keele ja kultuuri keskkonnas].

Ära ei tasu unustada ka [http://www.hot.ee/jurand/index2.html Jurandi kodukat].

Kuna käsikaudu võib lehekülgede käideldavuse hindamine vaevarikkaks tegevuseks osutuda, siis on olemas hulganisti vahendeid, mis sind aitavad:

*[http://www.contentquality.com/ Cynthia Says] kontrollib lehkülje vastavust WCAG ja Section 508 nõuetele.
*[http://webxact.watchfire.com/ Watchfire WebXACT] testib lehekülgi väga mitmetest aspektidest lähtuvalt
*[http://www.w3.org/2003/12/semantic-extractor.html W3C Semantic data extractor] proovib leheküljelt välja lugeda võimalikult palju semantilist infot
*[http://colorfilter.wickline.org/ Värvipimedust teesklev veebilehe filter], et sa oskaksid aimata, kuidas võivad värvipimedad su lehte näha
*Firefoxi laiendus [http://www.standards-schmandards.com/index.php?show/fangs Fangs] võimaldab sul aga ette kujutada, milline "näeb" veeb välja pimedate jaoks

===Validaatorid===

Eksimine on inimlik ning seetõttu tuleb kasuks, kui kontrollida oma lehekülje koodi validaatoritega:

*[http://validator.w3.org W3C HTML-i validaator]
*[http://www.htmlhelp.com/tools/validator/ WDG HTML-i validaator] (võimalus valideerida kogu lehekülg, kui lehtede arv jääb alla saja)
*[http://jigsaw.w3.org/css-validator/ W3C CSS-i validaator]
*[http://feedvalidator.org/ RSS ja Atom uudisvoogide validaator]
*[http://www.jslint.com/lint.html JSLint] kontrollib JavaScripti koodi võimalike vigade suhtes.

Ning mitte üksnes koodi:

*[http://www.filosoft.ee/html_speller_et/ Eesti keele speller]

===Varia===

*[http://www.lipsum.com/ Lipsum generator] - kui sul mõlgub meeles Lorem ipsum dolor...
*[http://typetester.maratz.com/ Typetester] - võimalus kõrvutada ekraanil erinevaid fonte ja valida oma veebilehe jaoks seeläbi sobivaim.

[[Kategooria:Tarkvara]]