HTML UΦebnice

┌vod

Co to je HTML?

HTML (HyperText Markup Language) je vyznaΦovacφ jazyk, kter² je zßkladem pro vytvß°enφ webov²ch strßnek. Pokud ho Φlov∞k ovlßdne, dokß₧e spolu s grafick²m layoutem vytvo°it skv∞lΘ lφbivΘ weby :)

index

Co budeme pot°ebovat ke tvorb∞ WWW strßnek?

Ke tvorb∞ strßnek nßm dokß₧e poslou₧it jak²koliv textov² editor. Strßnky m∙₧eme vytvß°et nap°. v Poznßmkov²m bloku ve Windows. Jß osobn∞ ke svΘ prßci pou₧φvßm program 1st Page 2000, kter² se vyrovnß velice znßmΘmu programu Homesite. Je to freeware a stßhnout si ho m∙₧ete ze strßnek www.evrsoft.com/1stpage, kde se takΘ doΦtete, kolik v∞cφ umφ. Podle m∞ nejlepÜφ volba. Jestli Vßm p°ipadß moc slo₧it², sßhn∞te nap°. po programu Microsoft FrontPage co₧ je WYSIWYG (What You See Is What You Get), kde vidφte p°φmo jak strßnky vypadajφ. Program si m∙₧ete stßhnout na strßnkßch firmy Microsoft a myslφm, ₧e je souΦßstφ instalace Windows. Dßle k prßci budeme pot°ebovat internetovΘ prohlφ₧eΦe. T∞mi nejznßm∞jÜφmi jsou Internet Explorer a Netscape Navigator. DoporuΦuji mφt nainstalovanΘ oba dva, pro sprßvnΘ zobrazovßnφ v obou prohlφ₧eΦφch. ZaΦßteΦnφci Φasto vytvß°ejφ strßnky a testujφ je nap°. v Internet Exploreru. Po uvedenφ strßnek na internet se na n∞ n∞kdo podφvß s Netscapem a hned je tu problΘm!

index

Co budeme pot°ebovat ke tvorb∞ grafiky?

Bez grafick²ch prvk∙ na strßnkßch by se dnes obeÜel jen mßlokdo. K tomu, aby strßnky dokßzaly upoutat, je pot°eba vytvo°it grafick² design strßnek. A jak grafiku vytvo°φte? Samoz°ejm∞ existuje mnoho grafick²ch editor∙. Nejpou₧φvan∞jÜφ (a takΘ nejdra₧Üφ a nejprofesionßln∞jÜφ) je program Adobe Photoshop. Jß se budu v tΘto uΦebnici v∞novat jen jednomu freewarovΘmu editoru - Gimp. Tento grafick² editor je zcela zdarma ke sta₧enφ na adrese www.gimp.org. Umφ vÜe co Adobe Photoshop, akorßt si s nφm musφte chvilku pohrßt, ne₧ se ho nauΦφte dokonale ovlßdat. Gimp je p∙vodn∞ vytvo°en pod Linux, ale nedßvno se objevil i ve verzi pro Windows95/98/NT. Podle m∞ to je nejlepÜφ freewarov² grafick² editor. Samoz°ejm∞ m∙₧ete pou₧φvat jak²koliv jin² editor nap°.

iGrafx Image - www.micrografx.com
Paint Shop Pro - www.jasc.com
Ulead Photoimpact - www.ulead.com
Wright Design - www.wright.com.au
Zoner Callisto - www.zoner.cz

index

Pravidla pro navrhovßnφ strßnek

  1. Sna₧te se, aby strßnky m∞ly co nejmenÜφ velikost a co nejkratÜφ dobu naΦφtßnφ na modemu 56Kbps.

  2. M∞jte v₧dy strßnky zßlohovanΘ pro p°φpad selhßnφ serveru a nßslednΘ ztrßty dat.

  3. Zßsadn∞ pou₧φvejte standartnφ fonty (Arial, Verdana, Courier, Courier New, Helvetica, Times a Times New Roman).

  4. Pou₧φvejte malß pφsmena v nßzvech soubor∙, obrßzk∙ a odkazech. N∞kterΘ servery rozeznßvajφ malß i velkß pφsmena.

  5. Rozvrhn∞te si adresß°ovou strukturu webu pro p°ehlednost. T°i∩te grafiku a informace do odliÜn²ch adresß°∙.

  6. Nestahujte grafiku z cizφch strßnek a nepou₧φvejte je na sv²ch. Sna₧te si vytvß°et vlastnφ grafiku.

  7. Co p°inesou strßnky nßvÜt∞vnφkovi? Zva₧te, pro koho jsou strßnky urΦeny a co ud∞lat, aby se nßvÜt∞vnφk vrßtil. Strßnky aktualizujte!

  8. Strßnky vytvß°ejte i pro rozliÜenφ 640x480. I v dneÜnφ dob∞ je mnoho u₧ivatel∙, kte°φ si v∞tÜφ monitor dovolit nemohou. ZkouÜejte si doma strßnky prohlΘdnout v rozliÜenφ 640x480 a 800x600.

  9. Po ka₧dΘ zm∞n∞ si strßnky prohlφ₧ejte v Internet Exploreru a Netscape Navigatoru.

  10. Obrßzku VÄDY p°ipisujte parametry velikosti! P°edejdete tak rozhßzenφ strßnky p°ed naΦtenφm obrßzk∙.

  11. Pou₧φvejte svojφ fantazii :)

index

Kde si mßm na internetu strßnky ulo₧it

Strßnky mßme vytvo°enΘ a jedin² problΘm je umφstit je na internetu. Existujφ dv∞ varianty, kde strßnky ulo₧it. Prvnφ, a asi nejvφce vyu₧φvanß, je tzv. FreeWebHosting - v²hoda t∞chto server∙ je takovß, ₧e strßnky umφs¥ujete zdarma. Podmφnkou je akorßt umφst∞nφ reklamnφho prou₧ku. Druhou variantou je placen² Webhosting - za umφst∞nφ strßnek musφte zaplatit, ale majφ oproti FreeWebHostingu mnoho v²hod. Jen pßr slov k FreeWebHostingu - po zaregistrovßnφ dostanete FTP p°φstup k poskytnutΘmu mφstu (standart je nad 30MB), e-mail, n∞kdy i povolenφ k pou₧φvßnφ CGI a PHP. A jakΘ jsou FreeWebHostingovΘ servery u nßs? Jß doporuΦuji server webzdarma.cz. Ale existujφ i jinΘ nap°.

FreeWeb - freeweb.coco.cz
MujWeb - www.mujweb.cz
Reflektor - www.reflektor.cz
Samuel - www.samuel.cz
MultiWeb - www.multiweb.cz

index

Jak si mßm strßnky na internetu ulo₧it??

K tomu, abyste si mohli ulo₧it strßnky na server, pot°ebujete n∞jakΘho FTP-Klienta. FTP-klient pomocφ protokolu FTP (File Transfer Protocol) p°ehraje soubory (strßnky) na server. Zde nezßle₧φ na tom, jak² program pou₧ijete. M∞ se osv∞dΦil Cute-FTP, kter² jsem pozd∞ji vym∞nil za freewarovΘho ftp-klienta 1st Transfer 2000, kterΘho si m∙₧ete stßhnout na www.evrsoft.com/1stpage. P°i registraci na serveru poskytujφcφ mφsto obdr₧φte p°φstupovΘ jmΘno, p°φstupovΘ heslo a ftp adresu. Tyto ·daje vyplnφte v FTP-Klientovi a p°enos m∙₧e zaΦφt.

index

Pßr tip∙ pro jednoduÜÜφ prßci

  1. Pro psanφ znak∙ < > pou₧φvejte kombinaci klßves prav² ALT+<>
  2. Vytiskn∞te si tabulky zßklad∙ HTML pro usnadn∞nφ prßce (v sekci Download).

index


Copyright © Ladislav Kovß° 2000