Nefunguji mi stranky pod Operou a Mozillou

Podívej, před několika lety, se začal internet rychle vyvíjet a html nějak přestalo svými možnostmi (hlavně po stránce vzhledu) dostačovat fantazii autorů. Proto se začaly všude používat např. tagy <font>, <table>, <b>, <u>, <i> a různé podobné "psí kusy", aby se docílilo pěkného designu stránek. Narušilo to ale úplně původní představu html, jehož úkolem je vystihovat (popisovat) obsah dokumentu.

Takto vypadal třeba kód, který byl dříve vidět (a bohužel často ještě dnes) na webových stránkách.

<head>
<titile>moje stranky</title>
</head>
<body margin=3 color=#123655 alink=#15613 vlink=#86466 bgcolor=#45433>
<font size=5 color=#46335>Nadpis stránky</font><br>
Text agb kbakfasj, dsfkb fjlasd <img .....><br> saygd fjasj asds
sdlj sdaknvka <font color=red><a>odkaz</a></font>
<p style="line-height: 180%; margin-top: 0; margin-bottom: 0"> </p>

atd.

</body>


Všimni si, že takovýto kód nevypovídá vůbec nic o struktuře stránky. Přitom právě o to jde. Různé elementy v html nejsou jen pro srandu, ale aby se pomocí nich co nejlépe posala struktura obsahu.

Nový (vlastně "staronový") způsob:
<!DOCTYPE HTML PUBLIC ................>


<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<title>moje stranky</title>
</head>
<body>
<h1>Nadpis stránky</h1>
<img src="logo_stranek.gif" alt="">

<h2>Menu stranek</h2>
<ul>
<li><a ...>prvni stranka</a></li>
<li><a ...>druha stranka</a></li>
<li><a ...>treti stranka</a></li>
</ul>

<h2>Vlastni obsah</h2>
<p>Prvni odstavec - tetx, agb kbakfasj, <img .....> dsfkb fjlasd saygd fjasj asds
sdlj sdaknvka</p>
<p>Druhy odstavec - tetx, agb kbakfasj, <img .....> dsfkb fjlasd saygd fjasj asds
sdlj sdaknvka</p>

<h2>Autoři stránek</h2>
<address>
adresa autoru stranek
</address>

atd.
</body>


Takovýto kód (zatím) nevypadá v prohlížeči dobře - je bez grafiky. Důležité ale je, že má jakousi logiku ve své struktuře a obsahu. Nyní se můžeme pustit do designu (pomocí CSS), kód doplníme o případně potřebné <div>y či <span>y a máme vyhráno.

Tak asi tak nějak! ;-O
> Tag FONT je "depreciated" podle W3C.org

Když už tak DEPRECATED = neschválený

(DEPRECIATED = zůstatkový :-)
2DoubleThink: Tys asi nepochopil, ze tu nejde o gramatiku, ale VYZNAM, proc se to nepouziva. Ale diky za opravu.
Diky vam vsem moc, vcera jsem si koupila knizku o CSS, kde presne tohle moc pekne popisuji, takze ted to uz chapu.
Tak se ode dneska zacinam ucit :-)).
Mejte se :-)
Dobrá volba ;-)
A smím se zeptat, jak se ona knížka jmenuje?

Taky by nebylo od věci si přečíst něco o správném psaní (x)html, ale tady se to snad bez knížky obejde. Na internetu je materiálů dost, ikdyž ty kvalitní se musí vybírat.
Pavel: hlavne mi nerikej, ze jsem si vybrala spatnou...stravila jsem tam hledanim asi pul hodiny :-)

CSS Kaskadove styly kompletni pruvodce - Petr Stanicek
(Computor press Brno 2003)
Ne, vybrala jsi VÝBORNĚ :-)

A co se týče toho "přehledného" (lépe "správného") kódu, tak se mrkni na str. 13. Takto vypadá kód jednoduchý a validní, na jehož základě se potom dá postavit dobrý web i s dobrou grafikou.

Samozřejmě je to jen ukázka a žádnému obsáhlejšímu webu se moc nepodobá, ale princip je pořád stejný.
Pavel: Tak jsi me potesil :-), mne z tech knizek prisla nejsrozumitelnejsi a taky, ze v ni je toho tak nejvic (alespon z tech knih, co tam zrovna meli)
Zrovna ted do do sebe soukam :-))))
Tak tady je ma prvni, jeste neostylovana stranka:

http://www.punkie.mysteria.cz/a/zkouska.htm

Doufam, ze jsem to pochopila dobre.
Je to o hodně lepší ;-)

Jen pár připomínek:
- tagy piš raději malými písmeny, vyšší verze xhtml (-> xml) už to vyžadují
- element <meta> s kódováním dej v <head> na první místo. Jelikož definuje kódování, měl by být ještě před <title>, aby prohlížeči bylo jasné, které použít už u titulku. Ale to už je jen maličkost.

Tak hodně štěstí v dalším studiu!
Pavel:Diky :-)