efektivní nahrazení <table></table>

caradoc:
Proč to chcete nahrazovat? Podle té ukázky to vypadá na tabulková data, která do značky <table> patří.

caradoc:
„v různých článcích“
- to citujete články, které brojí proti dělání celého webu jako obří tabulky, jak se to kdysi dělalo (web byl obrovská tabulka, hlavička byla jedna buňka ve které byla další tabulka, atd. - a takhle na stránce byly třeba čtyři, pět, nebo úrovní vnořených tabulek). Tohle ano, tohle je zneužívání značky <table>.

Nicméně tady jste v úplně jiné situaci- chcete do stránky vložit tabulku. Na to je značka <table> vhodná a správná a naopak je nesprávné to dělat přes <div> a <span>.

„Jeden z důvodů je ten, že prohlížeč zobrazí data až po načtení celé tabulky“
Myslím, že prohlížeče už umí zobrazovat tabulky postupně, ale hlavně: Kolik dat v té tabulce plánujete mít? Jestli to bude tabulka jako je ten příklad a nebude nějaká skutečně monstrózní, nejspíš nebude problém s jejím načítáním ani na připojení přes GPRS.

„...jsem se dočetl že (údajně) CSS usnadňuje práci“
Ano, když celý web bude pomocí vnořených tabulek a předěláte ho do sémantického HTML plus CSS, dostanete obvykle daleko menší a snáze udržovatelný kód.
Když ale předěláte tabulku z <table> na nastylované <div> a <span>, dopadne to přesně opačně- kód bude větší a práce s ním složitější.
Jinak samozřejmě i na tabulky lze aplikovat CSS ;-)

Uvedený příklad vypadá na typická tabulková data. V takovém případě by nebylo vhodné nahrazovat tabulku něčím jiným. Jinak pokud tě zajímá design bez tabulek, můžeš si přečíst něco o CSS, konkrétně o obtékání nebo o pozicování (nejlíp o obojím). Je dobré si ale uvědomit, že tabulka a CSS se navzájem nevylučují. Tabulka je blok a jako kterýkoli jiný blok se dá přes CSS např. pozicovat nebo floatovat. Také prvky tabulky se dají stylovat přes CSS (pozadí, písmo...). Ne vždy funguje všechno podle očekávání, ale to už je potřeba konkrétně vyzkoušet. Zajímavá možnost řešit dvousloupcový layout je taky definiční seznam (někdy neprávem opomíjený).

Dodatek: Koukám, že částečně cituji Jokera, ale aspoň je vidět, že se shodnem. Tabulková data zkrátka patří do tabulky. :-)

caradoc:
„prohlížeč zobrazí data až po načtení celé tabulky“
To nemusí platiť, dá sa použiť CSS vlastnosť Table-layout s hodnotou fixed.

caradoc:
„každá buňka v řádku má danou šíři, dané pozadí, orámování, font apod. na dalším řádku se vše opakuje“
Myslíš tohle?
http://diskuse.jakpsatweb.cz/?action=vthread&forum=7&topic=100978#10
http://diskuse.jakpsatweb.cz/?action=vthread&forum=7&topic=38211
http://llook.wz.cz/weblog/ruzny-soubory/col/nahrada-colgroup.html

caradoc:
„mě se zdálo že tabulky dělané div a span jsou složitější na psaní“
hlavně <div>y a <span>y nevytvoří tabulku, nýbrž divy na na<dív>aném webu.