it-swarm-eu.dev

Proč nepoužívat tabulky pro rozvržení v HTML?

Zdá se, že obecný názor , že tabulky by neměly být použity pro rozložení v HTML.

Proč?

Nikdy jsem (nebo jen zřídka, abych byl upřímný) neviděl dobré argumenty. Obvyklé odpovědi jsou:

  • Je dobré oddělit obsah od rozložení
    Ale toto je klamný argument; Cliche myšlení . Myslím, že je pravda, že použití tabulkového prvku pro rozvržení má málo co do činění s tabulkovými daty. No a co? Má můj šéf péči? Péče mých uživatelů?

    Možná, že jsem já nebo moji kolegové vývojáři, kteří musí udržovat péči o webovou stránku ... Je stůl méně udržovatelný? Myslím, že použití tabulky je jednodušší než použití divs a CSS.

    Mimochodem ... proč je použití div nebo rozpětí dobré oddělení obsahu od rozložení a tabulky ne? Získání dobré rozložení s pouze divs často vyžaduje hodně vnořených divs.

  • Čitelnost kódu
    Myslím, že je to naopak. Většina lidí rozumí HTML, jen málokdo chápe CSS.

  • Je lepší pro SEO nepoužívat tabulky
    Proč? Může někdo ukázat nějaké důkazy, že je? Nebo prohlášení společnosti Google, že tabulky jsou odrazeny od perspektivy SEO?

  • Tabulky jsou pomalejší.
    Musí být vložen další prvek tbody. To jsou arašídy pro moderní webové prohlížeče. Ukažte mi několik benchmarků, kde použití tabulky významně zpomaluje stránku.

  • Generální oprava je jednodušší bez tabulek, viz css Zen Garden .
    Většina webových stránek, které vyžadují upgrade, potřebuje také nový obsah (HTML). Scénáře, kde nová verze webu potřebuje pouze nový soubor CSS, nejsou příliš pravděpodobné. Zen Garden je pěkný web, ale trochu teoretický. Nemluvě o jeho zneužití CSS.

Opravdu mě zajímají dobré argumenty pro použití divs + CSS místo tabulek.

665
Benno Richters

Budu procházet vaše argumenty jeden po druhém a pokusit se ukázat chyby v nich.

Je dobré oddělit obsah od rozložení. To je však klamný argument. Cliché myšlení.

Není to vůbec klamné, protože HTML bylo navrženo záměrně. Zneužití prvku nemusí být zcela mimo otázku (koneckonců, nové idiomy se vyvinuly i v jiných jazycích), ale možné negativní důsledky musí být vyváženy. Navíc, i kdyby neexistovaly žádné argumenty proti zneužití elementu <table> dnes, mohlo by to být zítra kvůli způsobu, jakým dodavatelé prohlížeče používají speciální prvek na prvek. Koneckonců vědí, že „<table> elementy jsou určeny pouze pro tabulková data“ a mohly by tuto skutečnost využít ke zlepšení vykreslovacího modulu, v procesu jemně se měnícím způsobem, jak se <table>s chovají, a tím pádem i v případech, kdy byly dříve zneužity.

No a co? Má můj šéf péči? Péče mých uživatelů?

Závisí. Je váš šéf špičatý vlasy? Pak se možná nestará. Pokud je kompetentní, pak se bude starat, protože uživatelé bude .

Možná, že já nebo moji kolegové vývojáři, kteří mají udržovat péči o webové stránky ... Je stůl méně udržovatelný? Myslím, že použití tabulky je jednodušší než použití divs a css.

Zdá se, že většina profesionálních webových vývojářů je proti vám[ nutná citace ]. Tabulky jsou ve skutečnosti méně udržitelné. Použití tabulek pro rozvržení znamená, že změna podnikového uspořádání bude ve skutečnosti znamenat změnu každé jednotlivé stránky. To může být velmi drahé. Na druhé straně, rozumné použití sémanticky smysluplného HTML v kombinaci s CSS může omezit takové změny na CSS a použité obrázky.

Mimochodem ... proč je použití div nebo rozpětí dobré oddělení obsahu od rozložení a tabulky ne? Získání dobré rozložení s pouze divs často vyžaduje hodně vnořených divs.

Hluboce vnořené <div>s jsou anti-pattern stejně jako rozložení tabulky. Dobrý web designéři nepotřebují mnoho z nich. Na druhé straně ani takové hluboce vnořené divs nemají mnoho problémů s rozvržením tabulek. Ve skutečnosti mohou dokonce přispět k sémantické struktuře logickým rozdělením obsahu na části.

Čitelnost kódu Myslím, že je to naopak. Většina lidí chápe html, málo rozumí css. Je to jednodušší.

„Většina lidí“ na tom nezáleží. Odborníci záleží. Pro profesionály, rozvržení tabulky vytvořit mnohem více problémů než HTML + CSS. To je jako říct, že bych neměl používat GVim nebo Emacs, protože Poznámkový blok je pro většinu lidí jednodušší. Nebo že bych neměl používat LaTeX, protože MS Word je pro většinu lidí jednodušší.

Je lepší pro SEO nepoužívat tabulky

Nevím, jestli je to pravda a nepoužil by to jako argument, ale bylo by to logické. Vyhledávače vyhledávají relevantní data. Tabulární data by samozřejmě mohla být relevantní, ale jen zřídka, co uživatelé hledají. Uživatelé hledají výrazy použité v názvu stránky nebo podobně prominentních pozicích. Bylo by proto logické vyloučit tabulkový obsah z filtrování a tím snížit dobu zpracování (a náklady!) Velkým faktorem.

Tabulky jsou pomalejší. Musí být vložen další prvek tbody. To jsou arašídy pro moderní webové prohlížeče.

Extra element nemá nic společného s tabulkami, které jsou pomalejší. Na druhou stranu, algoritmus rozvržení tabulek je mnohem těžší, prohlížeč musí často čekat, než se celý stůl načte, než začne rozložení obsahu. Mezipaměť rozvržení navíc nebude fungovat (CSS lze snadno ukládat do mezipaměti). To vše bylo zmíněno dříve.

Ukažte mi několik benchmarků, kde použití tabulky významně zpomaluje stránku.

Bohužel nemám žádná srovnávací data. Zajímalo by mě to, protože je správné, že tento argument postrádá jistou vědeckou přísnost.

Většina webových stránek, které potřebují upgrade, potřebuje také nový obsah (html). Scénáře, kde nová verze webového serveru potřebuje pouze nový soubor css, nejsou příliš pravděpodobné.

Vůbec ne. Pracoval jsem na několika případech, kdy změna designu byla zjednodušena oddělením obsahu a designu. Často je třeba změnit HTML kód, ale změny budou vždy mnohem omezenější. Změny návrhu musí být navíc prováděny dynamicky. Zvažte šablony motory, jako je ten, který používá blogovací systém WordPress. Rozložení tabulky by tento systém doslova zabilo. Pracoval jsem na podobném případě komerčního softwaru. Schopnost změnit design bez změny HTML kódu byla jednou z obchodních požadavků.

Další věc. Uspořádání tabulek činí automatizované zpracování webových stránek mnohem složitější. Mohlo by to znít triviálně, protože to, kdo to dělá? Byl jsem překvapen sám sebou. Scraping obrazovky může hodně pomoci, pokud dotyčná služba nenabízí alternativu WebService pro přístup k datům. Pracuji v bioinformatice, kde je to smutná realita. Moderní webové techniky a WebServices nedosáhly většiny vývojářů a často je scraping na obrazovce jediným způsobem, jak automatizovat proces získávání dat. Není divu, že mnoho biologů tyto úkoly stále provádí ručně. Pro tisíce datových sad.

497
Konrad Rudolph

Zde je moje odpověď programátora z simliar vlákno

Sémantika 101

Nejprve se podívejte na tento kód a zamyslete se nad tím, co je tady špatně ...

class car {
    int wheels = 4;
    string engine;
}

car mybike = new car();
mybike.wheels = 2;
mybike.engine = null;

Problémem samozřejmě je, že kolo není auto. Třída automobilu je nevhodnou třídou pro instanci motocyklu. Kód je bez chyb, ale je sémanticky nesprávný. Odráží špatně programátor.

Sémantika 102

Nyní to aplikujte na značení dokumentů. Pokud váš dokument potřebuje předložit tabulková data, pak příslušná značka bude <table>. Pokud však umístíte navigaci do tabulky, zneužijete zamýšlený účel prvku <table>. Ve druhém případě nepředkládáte tabulková data - jste (mis) pomocí elementu <table> k dosažení prezentačního cíle.

Závěr

Všimnou si návštěvníci? Ne. Má váš šéf péči? Možná. Někdy se jako programátoři stříhají rohy? Tak určitě. Ale měli bychom? Ne. Kdo má prospěch, pokud používáte sémantické značení? Vy - a vaše profesionální pověst. Teď jdi ​​a udělej správnou věc.

290
Carl Camera

Zjevná odpověď: Viz CSS Zen Garden . Pokud mi řeknete, že můžete snadno udělat to samé s tabulkovým rozvržením (nezapomeňte - HTML se nemění), pak všemi prostředky použijte tabulky pro rozvržení.

Další dvě důležité věci jsou přístupnost a SEO.

Obě se starají o to, v jakém pořadí informací jsou uvedeny. Nemůžete snadno prezentovat svou navigaci v horní části stránky, pokud ji vaše rozvržení založené na tabulce umístí do 3. buňky druhého řádku druhé vnořené tabulky na stránce.

Takže vaše odpovědi jsou udržovatelnost, dostupnost a SEO.

Nebuďte líní. Dělejte věci správným a správným způsobem, i když jsou o něco těžší se učit.

104
erlando

Viz tato duplicitní otázka.

Jednu položku, na kterou zapomínáte, je přístupnost. Rozvržení založená na tabulkách se nepřekládají také v případě, že potřebujete použít například čtečku obrazovky. A pokud pracujete pro vládu, podpora dostupných prohlížečů, jako jsou čtečky obrazovky, může být .

Také si myslím, že podceňujete dopad některých věcí, které jste uvedli v této otázce. Pokud jste například návrhář i programátor, nemusíte mít plné pochopení toho, jak dobře odděluje prezentaci od obsahu. Ale jakmile se dostanete do obchodu, kde jsou dvě odlišné role, výhody začnou být jasnější.

Pokud víte, co děláte a máte dobré nástroje, CSS má skutečně významné výhody oproti tabulkám pro rozvržení. A zatímco každá položka sama o sobě nemůže ospravedlnit opuštění tabulek, je to dohromady.

91
Joel Coehoorn

Bohužel, CSS Zen Garden již nelze použít jako příklad dobrého HTML/CSS designu. Prakticky všechny jejich nedávné návrhy používají grafiku pro nadpis sekce. Tyto grafické soubory jsou specifikovány v CSS.

Proto, webové stránky, jejichž účelem je ukázat výhodu udržet design mimo obsah, nyní pravidelně zavazuje UNSPEAKABLE SIN uvedení obsahu do designu. (Pokud by se změnilo záhlaví oddílu v souboru HTML, nezobrazí se záhlaví sekce).

Což jen dokazuje, že ani ti, kteří obhajují přísné náboženství DIV & CSS, nemohou dodržovat svá vlastní pravidla. Můžete ji použít jako vodítko pro to, jak je budete následovat.

54
James Curran

To není definitivní argument, jakýmkoliv způsobem, ale s CSS můžete mít stejné značení a změnit rozvržení v závislosti na médiu, což je pěkná výhoda. Pro tiskovou stránku můžete potichu potlačit navigaci, aniž byste museli například vytvořit stránku vhodnou pro tisk.

48
expedient

Jedna tabulka pro rozvržení by nebyla tak špatná. Ale nemůžete dostat rozložení, které potřebujete, jen s jednou tabulkou většinu času. Brzy máte 2 nebo 3 vnořené tabulky. To se stává velmi těžkopádným.

  • Je IS a LOT těžší číst. To není na názoru. Je tam jen více vnořených tagů, které na nich nemají žádné identifikační značky.

  • Oddělení obsahu od prezentace je dobrá věc, protože vám umožňuje zaměřit se na to, co děláte. Míchání dvou vede k nafoukaným stránkám, které je těžké číst.

  • CSS pro styly umožňuje vašemu prohlížeči ukládat soubory do mezipaměti a následné požadavky jsou mnohem rychlejší. Tohle je obrovský.

  • Tabulky vás zamknou do designu. Jistě, ne každý potřebuje flexibilitu CSS Zen Garden, ale nikdy jsem nepracoval na stránkách, kde jsem nemusel měnit design trochu tady a tam. S CSS je to mnohem jednodušší.

  • Tabulky jsou těžké. Nemáte s nimi velkou flexibilitu (tj. Stále potřebujete přidat atributy HTML, abyste mohli plně ovládat styly tabulky)

Tabulky pro data, která nejsou v tabulkách, jsem nepoužil asi za 4 roky. Neohlédl jsem se zpět.

Rád bych vám doporučil přečíst CSS Mastery Andy Budd. Je to fantastické.

Obrázek na adrese ecx.images-Amazon.com http://ecx.images-Amazon.com/images/I/41TH5NFKPEL._SL500_BO2,204,203,200_PIsitb-dp-500-arrow,TopRight,45,-64_OU01_AA240_SH20_.jpg

45
Ben Scheirman

Je dobré oddělit obsah od rozvržení
Ale toto je klamný argument; Cliche myšlení

Je to klamný argument, protože HTML tabulky jsou rozvrženy! Obsah je data v tabulce, prezentace je samotná tabulka. To je důvod, proč oddělování CSS od HTML může být občas velmi obtížné. Neoddělujete obsah od prezentace, oddělujete prezentaci od prezentace! Hromada vnořených divs není jiná než tabulka - je to jen jiná sada tagů.

Dalším problémem s oddělením HTML od CSS je, že potřebují vzájemné důvěrné znalosti - opravdu je nelze plně oddělit. Rozvržení tagu v HTML je pevně spojeno se souborem CSS bez ohledu na to, co děláte.

Myslím, že stoly vs divs přichází s potřebami vaší aplikace.

V aplikaci, kterou vyvíjíme v práci, jsme potřebovali rozvržení stránky, kde se kusy dynamicky přizpůsobily svému obsahu. Strávil jsem dny snahou o to, aby to fungovalo přes prohlížeč s CSS a DIV a byla to úplná noční můra. Přepnuli jsme na tabulky a to vše --- pracoval.

Máme však velmi uzavřené publikum pro náš produkt (prodáváme hardware s webovým rozhraním) a problémy s dostupností pro nás nejsou problémem. Nevím, proč si čtenáři na obrazovce nemohou dobře poradit s tabulkami, ale myslím, že pokud to tak je, vývojáři to musí zvládnout.

36
17 of 26

CSS/DIV - je to jen práce pro návrháře, ne. Stovky hodin, které jsem strávil laděním DIV/CSS problémů, hledal na internetu, abych získal část značek, které pracují s obskurním prohlížečem - mě to šílí. Uděláte jednu malou změnu a celé rozvržení jde strašně špatně - kde na tom je logika. Strávit hodiny přesouváním těchto 3 pixelů tímto způsobem, pak něco jiného než 2 pixely, aby je všechny zarovnaly. Zdá se mi, že se mi to nějak nedaří. Jen proto, že jste purista a něco "není to správné, co dělat", neznamená to, že byste jej měli používat v n-té míře a za všech okolností, zejména pokud to činí váš život 1000krát snadnějším.

Tak jsem se konečně rozhodl, čistě na komerčním základě, i když jsem stále na minimu, pokud očekávám 20 hodin práce, abych dostal DIV správně, budu se držet stolu. Je to špatně, ruší puristy, ale ve většině případů stojí méně času a je levnější řídit. Můžu se pak soustředit na to, aby aplikace fungovala tak, jak chce zákazník, spíše než potěšit puristy. Konec konců platí účty a můj argument manažerovi, který vynucuje používání CSS/DIV - poukazuji jen na to, že zákazníci platí také plat!

Jediný důvod, proč všechny tyto argumenty CSS/DIV vznikají, je v první řadě nedostatek CSS a protože prohlížeče nejsou navzájem kompatibilní a pokud by byly, polovina návrhářů na světě by byla bez práce .

Když navrhujete formulář pro Windows, nepokoušejte se pohybovat ovládacími prvky poté, co jste je položili, takže si myslím, že je to pro mě divné, proč byste to chtěli udělat s webovým formulářem. To logice prostě nechápu. Získejte právo rozvrhu začít a jaký je problém. Myslím, že je to proto, že designéři rádi flirtují s kreativitou, zatímco vývojáři aplikací se více zajímají o to, aby aplikace fungovala, vytvářeli obchodní objekty, prováděli obchodní pravidla, pracovali se na tom, jak se kousky dat o zákaznících navzájem týkají, a zajistili, že se věci setkají se zákazníky. požadavky - víte - jako věci z reálného světa.

Nechápejte mě špatně, oba argumenty jsou platné, ale prosím nekritizujte vývojáře za to, aby si vybrali jednodušší, logičtější přístup k navrhování formulářů. Často máme mnohem důležitější věci na starosti než správná sémantika použití tabulky nad div.

Případ v bodě - na základě této diskuse jsem převedl několik existujících tds a trs na divs. 45 minut se o tom snaží, aby se všechno postavilo vedle sebe a já jsem to vzdal. TDs zpět o 10 sekund později - funguje - hned - ve všech prohlížečích, nic víc dělat. Snažte se mě pochopit - jaké možné ospravedlnění máte pro to, abych to udělal jiným způsobem!

23
Tim Black

Uspořádání by mělo být snadné. Skutečnost, že existují články o tom, jak dosáhnout dynamického uspořádání tří sloupců s hlavičkou a zápatím v CSS, ukazuje, že se jedná o špatný systém rozložení. Samozřejmě, můžete si to do práce, ale tam jsou doslova stovky článků on-line o tom, jak to udělat. Tam jsou skoro žádné takové články pro podobné rozložení s tabulkami, protože je to zjevně zřejmé. Bez ohledu na to, co říkáte proti tabulkám a ve prospěch CSS, tato skutečnost to všechno zrušuje: základní rozložení tří sloupců v CSS se často nazývá "Svatý grál".

Pokud to neznamená, že říkáte "WTF", pak opravdu potřebujete odložit pomoc s koolem.

Mám rád CSS. Nabízí úžasné stylingové možnosti a několik skvělých polohovacích nástrojů, ale jako rozložení motoru je nedostatek. Musí existovat nějaký typ dynamického systému určování polohy sítě. Přímý způsob, jak zarovnat boxy na více osách, aniž byste nejprve znali jejich velikosti. Neposkytuju sakra, pokud tomu říkáte <table> nebo <gridlayout> nebo cokoliv, ale toto je základní funkce rozložení, která chybí v CSS.

Čím větší problém je, že tím, že nepřipustí, že chybí funkce, CSS fanatici drží CSS zpět od všeho, co by mohlo být. Byl bych naprosto rád, kdybych přestal používat tabulky, kdyby CSS poskytovala slušné umístění víceosých sítí, jako je v podstatě každý jiný motor na světě. (Uvědomujete si, že tento problém byl již mnohokrát vyřešen v mnoha jazycích všemi, kromě W3C, že? A nikdo jiný nepopřel, že by taková funkce byla užitečná.)

Povzdech. Dostatečné větrání. Pokračujte a strčte hlavu zpět do písku.

21
needlestack

Podle shody 508 (pro čtečky obrazovek pro vizuálně imparované) by tabulky měly být používány pouze k uchovávání dat a nikoli k rozložení, protože způsobí, že se čtečky obrazovek vymykají. Nebo to tak bylo řečeno.

Pokud každému z divs přiřadíte jména, můžete je všechny pomocí skinů CSS také skrýt. Jsou to jen trochu více bolesti, aby se dostali k tomu, jak je potřebujete.

19
Rob

Zde je část html z nedávného projektu:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>{DYNAMIC(TITLE)}</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <link rel="stylesheet" type="text/css" href="./styles/base.css" />
</head>
<body>
    <div id="header">
        <h1><!-- Page title --></h1>
        <ol id="navigation">
            <!-- Navigation items -->
        </ol>
        <div class="clearfix"></div>
    </div>
    <div id="sidebar">
        <!-- Sidebar content -->
    </div>
    <!-- Page content -->
    <p id="footer"><!-- Footer content --></p>
</body>
</html>

A tady je stejný kód jako rozvržení založené na tabulce.

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>{DYNAMIC(TITLE)}</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <link rel="stylesheet" type="text/css" href="./styles/base.css" />
</head>
<body>
    <table cellspacing="0">
        <tr>
            <td><!-- Page Title --></td>
            <td>
                <table>
                    <tr>
                        <td>Navitem</td>
                        <td>Navitem</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>

    <table>
        <tr>
            <td><!-- Page content --></td>
            <td><!-- Sidebar content --></td>
        </tr>
        <tr>
            <td colspan="2">Footer</td>
        </tr>
    </table>
</body>
</html>

Jediná čistota, kterou vidím v tomto rozložení podle tabulky, je skutečnost, že jsem se svým odsazením přehřátý. Jsem si jist, že obsahová část by měla další dvě vložené tabulky.

Další věc k zamyšlení: filesizes. Zjistil jsem, že rozložení tabulek je dvakrát větší než obvykle jejich CSS. Na našem vysokorychlostním širokopásmovém připojení, které není obrovský problém, ale je to na těch s dial up modemy.

18
Ross

Rád bych dodal, že div-založené rozložení jsou jednodušší mantain, vyvíjet a refactor. Jen některé změny v CSS pro změnu pořadí prvků a je hotovo. Z mé zkušenosti, redesign rozvržení, které používá tabulky, je noční můra (více pokud jsou vnořené tabulky).

Váš kód má také význam z sémantického hlediska.

14
Guido

Rozvržení CSS je obecně mnohem lepší pro přístupnost, za předpokladu, že obsah přichází v přirozeném pořádku a dává smysl bez stylového vzoru. A není to jen čtečka obrazovky, která zápasí s tabulkovým rozvržením: pro mobilní prohlížeče je také mnohem těžší vykreslit stránku správně.

Také s rozložením založeným na divu můžete velmi snadno dělat skvělé věci se stylem tisku, jako je například vyloučení záhlaví, zápatí a navigace z vytištěných stránek - myslím, že by to bylo nemožné, nebo přinejmenším mnohem obtížnější, to udělat s rozložení tabulky.

Máte-li pochybnosti o tom, že oddělení obsahu od rozvržení je jednodušší s divs než s tabulkami, podívejte se na div-založené HTML na CSS Zen Garden , podívejte se, jak změna stylů může drasticky změnit rozvržení a zamyslete se nad tím, zda byste mohli dosáhnout stejné škály rozvržení, pokud by HTML bylo založeno na tabulce ... Pokud děláte rozvržení podle tabulky, je nepravděpodobné, že používáte CSS ke kontrole všech mezer a výplně v buněk (pokud jste byli, téměř určitě zjistíte, že je snadnější použít plovoucí divs atd. na prvním místě). Bez použití CSS ke kontrole toho všeho a vzhledem k tomu, že tabulky specifikují pořadí v levém a pravém horním pořadí v HTML, mají tabulky tendenci znamenat, že se vaše rozvržení v HTML značně zafixuje.

Realisticky si myslím, že je velmi těžké zcela změnit uspořádání div-and-CSS-založené konstrukce bez změny divs trochu. Nicméně, s rozvržením založeným na div a CSS je mnohem snazší Tweak věci, jako je například vzdálenost mezi různými bloky a jejich relativní velikosti.

13
MB.

Skutečnost, že se jedná o hotly diskutovanou otázku, je důkazem selhání W3C předvídat rozmanitost návrhů uspořádání, které by se pokusily. Použití divs + css pro sémanticky přátelské uspořádání je skvělý koncept, ale detaily implementace jsou tak chybné, že skutečně omezují tvůrčí svobodu.

Pokusil jsem se přepnout jednu ze stránek naší společnosti ze stolů na divs a byla to taková bolest hlavy, že jsem úplně vyhodil hodiny práce, které jsem do ní nalil a vrátil se ke stolům. Snažit se zápasit s mými divs, abych získal kontrolu nad vertikálním vyrovnáním, mě proklínalo hlavními psychologickými problémy, které nikdy nebudu třást, dokud tato debata zuří.

Skutečnost, že lidé musí často přijít s komplexními a ošklivými řešeními k dosažení jednoduchých návrhových cílů (například vertikální zarovnání), silně naznačuje, že pravidla nejsou dostatečně flexibilní. Pokud jsou specifikace dostačující, pak proč stránky s vysokým profilem (jako SO) považují za nutné ohnout pravidla pomocí tabulek a dalších řešení?

13
DLH

Žádné argumenty ve prospěch DIVs ode mne.

Řekl bych: Pokud se bota hodí, nosí ji.

Stojí za zmínku, že je obtížné, ne-li nemožné najít dobrou metodu vykreslování obsahu ve formátu DIV + CSS ve dvou nebo třech sloupcích, což je konzistentní ve všech prohlížečích a stále vypadá přesně tak, jak jsem zamýšlel.

Toto tipuje trochu rovnováhu k tabulkám ve většině mých rozvržení, a když se cítím provinile, že je používám (dunny proč, lidé prostě říkají, že je to špatné, tak se snažím je naslouchat), nakonec je pragmatický pohled jen jednodušší a rychlejší pro mne je použití TABLE. Nejsem platil hodinu, takže tabulky jsou pro mě levnější.

13
Radu094

Myslím, že je pravda, že použití tabulkového prvku pro rozvržení má málo co do činění s tabulkovými daty. No a co? Má můj šéf péči? Péče mých uživatelů?

Google a další automatizované systémy do péče, a jsou stejně důležité v mnoha situacích. Sémantický kód je pro neinteligentní systém snazší analyzovat a zpracovávat.

12
ceejayoz

Když jsme museli pracovat s webovou stránkou, která zahrnovala 6 vrstev vnořených tabulek generovaných některou aplikací a která měla generovat neplatné HTML, bylo to ve skutečnosti 3hodinová práce, která ji napravila pro menší změnu.

To je samozřejmě případ Edge, ale design založený na tabulce je neudržitelný. Používáte-li css, oddělujete styl, takže při opravě HTML máte méně starostí o rozbití.

Zkuste to také pomocí JavaScriptu. Přesunout buňku jedné tabulky z jednoho místa na jiné místo v jiné tabulce. Spíše komplikované provedení tam, kde div/span by prostě fungovalo jako copy-paste-wise.

"Má starost mého šéfa"

Kdybych byl tvůj šéf. Budeš se starat. ;) Pokud si ceníte svého života.

8
Kent Fredric

Flexibilita rozvržení
Představte si, že vytváříte stránku s velkým počtem miniatur.
DIVs:
Pokud vložíte každou miniaturu do formátu DIV, zaplavíte doleva, možná 10 z nich zapadne do řady. Ujistěte se, že okno je užší, a BAM - je to 6 na řadě, nebo 2, nebo mnoho fit.
TABULKA:
Musíte explicitně říci, kolik buněk je v řadě. Pokud je okno příliš úzké, uživatel se musí posouvat vodorovně.

držovatelnost
Stejná situace jako výše. Nyní chcete přidat tři miniatury do třetího řádku.
DIVs
Přidejte je. Rozložení se automaticky upraví.
TABLE: Vložte nové buňky do třetího řádku. Oops! Tady je příliš mnoho položek. Vyjměte z ní řadu a položte je na čtvrtou řadu. Teď tam je příliš mnoho věcí. Vystřihněte z té řady ... (atd.)
(Samozřejmě, pokud generujete řádky a buňky se skriptováním na straně serveru, pravděpodobně to nebude problém.)

7
Nathan Long

Myslím, že loď pluje. Pokud se podíváte na směr, kterým se odvětví vydalo, všimnete si, že CSS a Open Standards jsou vítězi této diskuse. Což zase znamená pro většinu práce html, s výjimkou formulářů, návrháři budou používat divs místo tabulek. S tím mám těžké časy, protože nejsem guru CSS, ale je to tak.

7
Thomas Wagner

Nezapomeňte také, že tabulky se v mobilních prohlížečích nevykreslují dobře. Jistě, iPhone má kick-ass prohlížeč, ale každý nemá iPhone. Tabulka vykreslování může být arašídy pro moderní prohlížeče, ale je to spoustu melounů pro mobilní prohlížeče.

Osobně jsem zjistil, že mnoho lidí používá příliš mnoho značek <div>, ale s mírou může být velmi čisté a snadno čitelné. Zmiňujete, že lidé mají těžší čas na čtení CSS než tabulky; pokud jde o „kód“, který může být pravdivý; ale co se týče čtení obsahu (view> source) je to sakra mnohem snazší pochopit strukturu se styly, než s tabulkami.

5
Swati

Vypadá to, že jste zvyklí na stoly a to je vše. Uvedení rozvržení do tabulky vás omezuje pouze na toto rozvržení. S CSS můžete přesouvat bity kolem, podívejte se na http://csszengarden.com/ A ne, layout nepotřebuje mnoho vnořených divs.

Bez tabulek pro rozvržení a správné sémantiky je HTML mnohem čistší, proto je snadnější číst. Proč by to někdo, kdo nedokáže porozumět CSS, pokusil číst? A pokud se někdo domnívá, že je webdeveloper, pak je dobré pochopit CSS.

SEO výhody pocházejí ze schopnosti mít nejdůležitější obsah vyšší na stránce a mají lepší poměr obsahu k označení.

http://www.hotdesign.com/seybold/

5
Rimantas

Celá myšlenka kolem sémantického značení je separace značek a prezentací, která zahrnuje rozvržení.

Div nenahrazuje tabulky, mají své vlastní použití při oddělování obsahu do bloků souvisejícího obsahu (,). Pokud nemáte dovednosti a spoléháte se na tabulky, budete často muset oddělit svůj obsah v buňkách, abyste získali požadované rozvržení, ale nemusíte se dotknout značek, abyste dosáhli prezentace při použití sémantického značení. Toto je opravdu důležité, když je generováno značení místo statických stránek.

Vývojáři musí zastavit poskytování značek, což znamená, že ti z nás, kteří mají dovednosti, aby mohli prezentovat obsah, mohou pokračovat v práci a vývojáři se nemusejí vracet ke svému kódu, aby mohli provést změny, když se prezentace změní.

5
Steve Perks
  • 508 Compliance - schopnost screenreaderu dávat smysl vašemu značení.
  • Čekání na vykreslení - tabulky se v prohlížeči nevykreslují, dokud se nedostanou na konec prvku </table>.
5
Rick Glos

Nejde o to, zda jsou divs lepší než tabulky pro rozvržení. Někdo, kdo chápe CSS, může duplikovat jakýkoli návrh s použitím 'rozvržení tabulek' docela přímočaře. Skutečné vítězství je pomocí HTML prvků pro to, co tam jsou. Důvod, proč byste nepoužívali tabulky pro data bez tablalarních dat, je stejný důvod, proč neuchováváte celá čísla jako znakové řetězce - technologie funguje mnohem snadněji, když je používáte pro účely, pro které jsou určeny. Kdyby bylo někdy nutné použít tabulky pro rozvržení (kvůli nedostatkům prohlížeče na počátku 90. let), určitě tomu tak není.

4
domgblackwell

Stojí za to zjistit, CSS a divs, takže centrální obsah sloupec načte a vykreslí před postranní panel v rozložení stránky. Ale pokud se snažíte použít plovoucí divs k vertikálnímu zarovnání loga s nějakým sponzorským textem, stačí použít stůl a jít dál se životem. Náboženské zenové náboženství prostě nedává moc peněz za babku.

Myšlenka oddělit obsah od prezentace je rozdělení aplikace, takže různé druhy práce ovlivňují různé bloky kódu. Jedná se vlastně o řízení změn. Standardy kódování však mohou prozkoumat současný stav kódu pouze povrchním způsobem.

Protokol změn pro aplikaci, která závisí na standardech kódování, aby "oddělil obsah od prezentace", bude zobrazovat vzor paralelních změn napříč svislými silami. Pokud je změna na „obsah“ vždy doprovázena změnou na „prezentaci“, jak úspěšné je rozdělení?

Pokud chcete kód kódovat produktivně, použijte Subversion a zkontrolujte protokoly změn. Pak použijte nejjednodušší kódovací techniky - divs, tabulky, JavaScript, obsahuje, funkce, objekty, pokračování, cokoliv - pro strukturu aplikace tak, aby změny zapadly jednoduchým a pohodlným způsobem.

3
Patrick May

Tabulky nejsou obecně jednodušší nebo více udržovatelné než CSS. Existuje však několik specifických rozvržení problémů, kde tabulky jsou skutečně nejjednodušším a nejflexibilnějším řešením.

CSS je jednoznačně výhodnější v případech, kdy prezentační značení a CSS podporují stejný typ designu, nikdo v jejich správné mysli by netvrdil, že font- tagy jsou lepší než specifikovat typografii v CSS, protože CSS vám dává stejnou moc než font- tags, ale mnohem čistším způsobem.

Problém s tabulkami je však v podstatě to, že model rozložení tabulky v CSS není podporován v aplikaci Microsoft Internet Explorer. Tabulky a CSS jsou proto ne ekvivalentní ve výkonu. Chybějící část je chování podobné mřížce tabulek, kde se hrany buněk zarovnávají vertikálně i horizontálně, zatímco buňky se stále rozšiřují tak, aby obsahovaly jejich obsah. Toto chování není snadné dosáhnout v čistých CSS bez hardcodingu některých dimenzí, což dělá design tuhý a křehký (pokud musíme podporovat Internet Explorer - v jiných prohlížečích je to snadné dosáhnout pomocí display:table-cell).

Nejde tedy o otázku, zda jsou tabulky nebo CSS vhodnější, ale je to otázka rozpoznání konkrétních případů, kdy použití tabulek může učinit rozvržení flexibilnějším.

Nejdůležitějším důvodem pro not pomocí tabulek je přístupnost. Pokyny pro zpřístupnění webového obsahu http://www.w3.org/TR/WCAG10/ doporučení againt pomocí tabulek pro rozvržení. Pokud se obáváte dostupnosti (a v některých případech můžete být právně povinni), měli byste používat CSS, i když jsou tabulky jednodušší. Všimněte si, že můžete vždy vytvořit stejné rozvržení s CSS jako u tabulek, může to vyžadovat více práce.

3
JacquesB

Nástroje, které používají rozvržení tabulky, mohou být mimořádně těžké kvůli množství kódu potřebného k vytvoření rozvržení. SAP Netweaver Portal ve výchozím nastavení používá TABLE pro rozvržení svých stránek.

Portál produkční SAP na mém současném koncertu má domovskou stránku, jejíž HTML váží více než 60K a jde sedm stránek hluboko, třikrát uvnitř stránky. Přidat do Javascript, zneužití 16 iframes s podobnými otázkami tabulky uvnitř nich, příliš těžké CSS atd., A stránka váží více než 5 MB.

Vezmeme-li čas na snížení hmotnosti stránky, takže můžete využít šířku pásma k zapojení do aktivit s uživateli, stojí za to.

3
Mike Cornell

DOM Manipulation je obtížné v rozvržení tabulky.

Se sémantickými divs:

$('#myawesomediv').click(function(){
    // Do awesome stuff
});

S tabulkami:

$('table tr td table tr td table tr td.......').click(function(){
    // Cry self to sleep at night
});

Teď, když je uděleno, druhý příklad je tak trochu hloupý a můžete vždy použít ID nebo třídy na tabulku nebo prvek td, ale to by bylo přidáním sémantické hodnoty, což je to, co zastánci tabulky tak vehementně oponují.

3
Chris Fletcher

Byl jsem překvapen, když jsem viděl, že některé problémy nebyly již pokryty, takže zde jsou mé 2 centy, navíc ke všem platným bodům, které byly učiněny dříve:

.1. CSS & SEO:

a) CSS měl na SEO velmi významný vliv tím, že umožnil umístit obsah na stránku, kam chcete. Před několika lety, vyhledávače daly významný důraz na "on-page" faktory. Něco v horní části stránky bylo považováno za relevantnější pro stránku než něco, co se nachází v dolní části stránky. "Začátek stránky" pro pavouka znamená "na začátku kódu". Pomocí CSS můžete na začátku kódu uspořádat obsah bohatý na klíčová slova a stále jej umístit na libovolné místo. To je stále poněkud relevantní, ale na stránce jsou stránky méně důležité pro hodnocení stránek.

b) Když je rozvržení přesunuto do CSS, HTML stránka je lehčí a proto se rychleji načítá pro vyhledávač. (pavouci se neobtěžují stahovat externí css soubory). Rychlé načítání stránek je důležitým faktorem hodnocení pro několik vyhledávačů, včetně Google

c) SEO práce často vyžaduje testování a změny věcí, což je mnohem pohodlnější s rozložením založeným na CSS

.2. Generovaný obsah:

Generování tabulky je mnohem jednodušší než ekvivalentní rozvržení CSS.

foreach ($comment as $key=>$value)
{
   echo "<tr><td>$key</td><td>$value</td></tr>";
}

Generování tabulky je jednoduché a bezpečné. Je samostatná a dobře se integruje do každé šablony. To samé s CSS je značně těžší a nemusí být vůbec prospěšné: obtížně upravovat CSS stylesheet v letu a přidávání stylu inline se neliší od použití tabulky (obsah není oddělen od rozložení).

Dále, když je generována tabulka, obsah (v proměnných) je již oddělen od rozvržení (v kódu), takže je snadno upravitelný.

To je jeden z důvodů, proč některé velmi dobře navržené webové stránky (například SO) stále používají rozvržení tabulek.

Samozřejmě, pokud výsledky musí být jednat prostřednictvím JavaScriptu, divs stojí za potíže.

.3. Rychlé testování konverzí

Když přijde na to, co funguje pro konkrétní publikum, je užitečné mít možnost změnit rozložení v různých způsobech, jak zjistit, jaké výsledky jsou nejlepší. Rozvržení založené na CSS usnadňuje práci

.4. Různá řešení různých problémů

Rozvržení tabulky jsou obvykle dissed, protože "každý ví divs & CSS" jsou způsob, jak jít.

Faktem však zůstává, že tabulky jsou rychlejší, lépe srozumitelné a jsou robustnější než většina rozvržení CSS. (Ano, CSS může být tak robustní, ale rychlý pohled přes síť na různé prohlížeče a rozlišení obrazovky ukazuje, že to často není případ)

Existuje spousta slabých stránek u stolů, včetně údržby, nedostatku flexibility ... ale nenechejme dítě s vodou s vanou. Existuje spousta profesionálních využití pro řešení, které je rychlé a spolehlivé.

Před časem jsem musel přepsat čisté a jednoduché rozložení CSS pomocí tabulek, protože významná část uživatelů by používala starší verzi IE s opravdu špatnou podporou pro CSS

Já, pro jednoho, jsem nemocný a unavený z kolenní reakce "Oh noes! Tabulky pro rozvržení!"

Pokud jde o "to nebylo určeno pro tento účel, a proto byste ho neměli používat tímto způsobem" dav, není to pokrytectví? Co si myslíte o všech tricích CSS, které musíte použít, aby se to, co funguje ve většině prohlížečů, stalo? Byly k tomu určeny?

3
Sylverdrag

Protože je to HELL udržovat místo, které používá tabulky, a trvá LOT delší kód. Pokud máte strach z plovoucí divs, jděte si kurz v nich. Není to těžké pochopit a jsou přibližně 100 krát účinnější a milionkrát méně bolesti v zadku (pokud jim nerozumíte - ale hej, vítejte ve světě počítačů).

Každý, kdo uvažuje o jejich uspořádání s tabulkou, nečeká, že ji budu udržovat. Je to nejvhodnější způsob vykreslování webových stránek. Díky bohu, máme teď mnohem lepší alternativu. Nikdy bych se nevrátil.

Je to děsivé, že někteří lidé nemusí být vědomi času a energie výhody z vytvoření webu pomocí moderních nástrojů.

3
Chuck Le Butt
  1. Zkuste sloučit/rozdělit 10/20 něco hlubokého colspan/rowspan. Více než jednou jsem musela potlačit svůj instinkt, abych začala s někým bojovat. [?!]
  2. Zkuste změnit pořadí zdrojového kódu bez změny viditelného pořadí. [SEO, použitelnost, ...]
  3. Velmi (opravdu jednoduchá) stránka, na kterou se díváme, je ~ 150K. Vsadím se, že může být téměř na polovinu pomocí správné CSS. [SEO (Ano, SEO, přečtěte si nejnovější specifikace Google atd.), Perfo, ...]
  4. Zkuste vytvořit šablonu iterátoru, která bude fungovat v libovolné šířce.
  5. Diskuse o této záležitosti v tomto médiu SO může způsobit singularitu a zničit nás všechny
2
Halil Özgür

Problém striktně oddělující prezentaci a obsah mi připadá jako zhruba analogický s oddělením souborů záhlaví od implementačních souborů v C++. To dává smysl, ale může to být také bolest. Witness Java a C # kde třídy jsou definovány v jediném zdrojovém souboru. Autoři novějších jazyků si všimli něčeho, co způsobilo programátorské bolesti hlavy a zbavili se ho. To se zdá být podstatou této diskuse. Jedna strana říká, že CSS je příliš obtížné, druhá strana říká, že se člověk musí stát masterem CSS.

Pro jednoduché rozvržení otázky, proč ne ohýbat pravidlo, které říká, že prezentace musí být zcela oddělené? Co nový tag (nebo nějaké rozšíření tagu div), které nám umožňuje kontrolovat prezentaci přímo v HTML? Koneckonců, nejsme již unikající prezentací do HTML? Podívejte se na h1, h2 ... h6. Všichni známe tyto kontrolní prezentace.

Schopnost číst kód (a HTML je kód) je velmi důležitá. Guru mají tendenci přehlížet, jak důležité je, aby programové prostředí bylo co nejvíce přístupné masám. Je velmi krátkozraké si myslet, že záleží jen na profesionálních programátorech.

2
user825628

Obrovský problém pro mě je, že tabulky, zejména vnořené tabulky, trvá mnohem déle, než vykreslení řádně rozvržené css implementace. (Vy můžete dělat css stejně pomalu.

Všechny prohlížeče vykreslují css rychleji, protože každý div je samostatný prvek, takže může být načítána obrazovka při čtení uživatele. (Pro velké datové sady atd.). Použil jsem css místo tabulek v tomto případě ani o rozložení.

Vnořená tabulka (tabulky uvnitř buněk atd.) Nebude vykreslena do okna prohlížeče, dokud nebude nalezena poslední tabulka. Ještě horší je, že špatně definovaný stůl se někdy ani nevykreslí! Nebo když to dělá, věci se chovají špatně. (řádně nespolupracujte s „TD“ atd.)

Používám tabulky pro většinu věcí, ale pokud jde o velká data a touhu mít rychle vykreslenou obrazovku pro koncového uživatele - snažím se co nejlépe využít toho, co CSS nabízí.

2
Tim Fischer

Musel jsem dělat stránky v obou těchto způsobů, plus třetí, obávaný "hybridní" rozložení s tabulkami, divs a styly: Divs/CSS vyhraje, šikovně.

Měli byste hnízdit divs tři hluboko, aby odpovídaly váze kódu pouze jedné buňky tabulky, hned od netopýra. To ovlivňuje škály s vnořenými tabulkami.

Také bych raději udělal jednu změnu rozvržení oproti jedné změně pro každou stránku na mých stránkách.

Mám plnou kontrolu nad každým aspektem prezentace s divs/css. Tabulky si to dělají ohavnými způsoby, zejména v IE, což je prohlížeč, který jsem ještě neměl možnost nepodporovat.

Můj čas na údržbu nebo redesign stránek divs/css je zlomkem toho, co by bylo v tabulkách.

Konečně mohu inovovat více přepínatelných rozvržení pomocí CSS a prakticky jakéhokoli skriptovacího jazyka. To by pro mě nebylo možné s tabulkami.

Hodně štěstí s vaší návratností investic, když se rozhodujete.

2
John Dunagan

Jeden příklad: chcete vycentrovat hlavní obsahovou oblast stránky, ale aby obsahovala plováky uvnitř ní, musí být plovoucí. V CSS není žádná "float: center".

To není jediný způsob, jak "obsahovat plováky" uvnitř vycentrovaného prvku. Takže to vůbec není dobrý argument!

Svým způsobem je to falešný předpoklad, věc "divs vs tables".

Rychlé a špinavé rozdělení stránky do tří sloupců? Tabulky are snazší, abych byl upřímný. Žádný profesionál je však již nepoužívá pro rozložení, protože uzamkne umístění prvků stránky na stránku.

Skutečný argument je "umístění provedené CSS (snad ve vzdáleném souboru)" na rozdíl od "umístění provedeného HTML na stránce". Jistě každý může vidět výhody bývalého na rozdíl od toho druhého?

  1. Velikost - pokud je vaše rozložení stránky v HTML, na stránkách, nemůže být uloženo do mezipaměti a musí být opakováno na každé stránce. Uložíte enormní množství šířky pásma, pokud je vaše rozložení v souboru CSS uloženém v mezipaměti, nikoli na stránce.
  2. Více vývojářů může pracovat na stejné stránce najednou - pracuji na HTML, jiný člověk pracuje na CSS. Není potřeba žádné úložiště, žádné problémy s přepisováním, zamykáním souborů atd.
  3. Provádění změn je jednodušší - budou existovat problémy s rozložením v různých prohlížečích, ale pouze jeden soubor, soubor CSS, budete muset vyřešit, abyste je vyřešili.
  4. Přístupnost, jak bylo zmíněno již dříve. Tabulky předpokládají, že dvojrozměrné rozvržení funguje pro každého. To není, jak někteří uživatelé prohlížejí váš obsah a není to způsob, jakým Google prohlíží váš obsah.

Zvaž toto:

[ picture ] [ picture ] [ picture ]
[ caption ] [ caption ] [ caption ]

který představuje dva řádky tabulky se 6 buňkami. Někdo, kdo uvidí rozložení 2-D tabulky, uvidí pod každým obrázkem titulek. Ale pomocí syntézy řeči, nebo PDA, a pro vyhledávače pavouk, to je

picture picture picture caption caption caption

a vztah, který je zřejmý s tabulkou na místě, zmizí.

Jsou DIVs a CSS lepší pro úkol jednoduše rozložení obdélníků na HTML stránce pro dosažení daného návrhu v co nejkratším možném čase? Ne, nejspíš ne. Ale nejsem v businessu, abych rychle vytvořil obdélníky, abych dosáhl daného designu. Přemýšlím o mnohem větším obrazu.

2
AmbroseChapel

Rozdíl mezi obsahem a rozvržením také usnadňuje generování rozvržení pro tiskárnu nebo pouze různé vzhledy (styly) pro vaše stránky, aniž byste museli vytvářet různé soubory html. Některé prohlížeče (například Firefox) dokonce podporují výběr šablony stylů z nabídky zobrazení.

A já si myslím, že je snazší udržet bezskládové uspořádání. Nemusíte se starat o řádky, Colspans, atd. Stačí vytvořit několik kontejnerových divů a umístit obsah tam, kde potřebujete. A to říkalo, že si myslím, že je také čitelnější (<div id="sidebar"> vs <tr><td>...</td><td>...<td>sidebar</td></tr>).

Je to jen malý „trik“, který se musíte naučit (a jakmile zvládnete trik, myslím, že je to jednodušší a dává větší smysl).

2
Grad van Horck

Odpověď na "tabulky jsou pomalejší" argument - přemýšlíte o době vykreslování, což je špatná metrika. Velmi často, vývojáři budou psát obrovský stůl dělat celou rozložení pro stránku - který přidá významně k velikosti stránky být stažen. Ať se to líbí nebo ne, je tu stále tuna uživatelů, kteří se snaží vytáčet.

Viz také: nadužívání ViewState

1
Greg Hurlman

Z minulých zkušeností bych musel jít na DIV. I v OOP je hlavním cílem snížení vazby mezi objekty, takže tento koncept lze aplikovat na DIVS a tabulky. Tabulky se používají pro uchovávání dat, nikoli pro uspořádání stránek. DIV je speciálně navržen tak, aby uspořádal položky kolem stránky, takže design by měl používat DIV, tabulky by měly být použity pro ukládání dat.

Také, editace webových stránek s tabulkami je prostě těžké (podle mého názoru)

1
Richard

umístění div a CSS umožňuje flexibilnější design, což vede k jednodušší úpravě a šablon vašich webových stránek.

To znamená, že pokud nemáte zájem o flexibilitu pak pomocí tabulky, spíše než některé divs, které jsou morphed do tabulky CSS je určitě mnohem jednodušší a rychlejší vyřadit. Mám tendenci používat tabulky při klepání na design, jen aby to vypadalo dobře, že trochu rychlejší.

1
workmad3

Když navrhuji rozvržení pomocí CSS, dávám každému hlavnímu oddílu svůj vlastní kořen (tělesnou úroveň) div a používám relativní/absolutní umístění, aby se dostal do svého správného místa. To je o něco flexibilnější než tabulky, protože nejsem omezen na uspořádání, které můžu reprezentovat pomocí řádků a sloupců.

Kromě toho, pokud se rozhodnu, že chci změnit uspořádání rozložení (řeknu, že chci, aby byl navigační panel vpravo), můžu prostě jít a pozměnit polohu prvků na jednom místě (soubor CSS) a HTML ne. t muset změnit. Kdybych to dělala s tabulkami, musela bych jít dovnitř a najít informace a udělat mnoho modifikace atributů a kopírování a vkládání, abych dosáhla stejného efektu.

Ve skutečnosti, pomocí CSS, mohu dokonce mít své živatelé vybrat, jak chtějí, aby jejich rozložení fungovalo. Pokud se obecná velikost oblastí obsahu nezmění, jsem naprosto v pořádku, když používám trochu skriptování PHP k výstupu svých CSS na základě uživatelských preferencí a umožnění jejich přeskupení vlastní zálibu. Ještě jednou, možné se stoly, ale mnohem těžší udržet.

Nakonec CSS umožňuje jeden MAJOR prospěch, který tabulky nikdy neposkytnou: schopnost přeformátovat obsah na základě zobrazovacího zařízení. CSS mi umožňuje používat úplně jinou sadu stylů (včetně pozice, formátování atd.) Pro tiskárnu, než jakou používám pro monitor. To může být rozšířeno i na další média, vynikajícím příkladem je Opera Show, která umožňuje chytře navrženou (a velmi standardní) stránku CSS vylepšenou pro prohlížení jako prezentaci.

V konečném důsledku jsou skutečnými vítězi flexibilita a řízení. Obecně, CSS vám umožní udělat více s rozvržením. Není nic technicky nestandardní o rozvržení podle tabulky, ale proč byste se chtěli omezit?

1
Nicholas Flynt

V minulosti měly programy pro čtení z obrazovky a další software pro přístup k internetu náročné pracovní postupy. Do jisté míry se to stalo v čtečkách obrazovky čtením přepínačem mezi režimem "stolu" a režimem "rozvržení" na základě toho, co viděl v tabulce. To bylo často špatné, takže uživatelé museli ručně přepínat režim při procházení tabulkami. V každém případě, velké, často vysoce vnořené tabulky byly a do značné míry stále velmi obtížné procházet pomocí čtečky obrazovky.

Totéž platí, když divs nebo jiné elementy na úrovni bloku se používají k opětovnému vytvoření tabulek a jsou vysoce vnořené. Účel divs má být používán jako prvek fomating a layout, a jako takový je určen pro uchovávání podobných informací a pro zobrazení vizuálních uživatelů. Když čtenář obrazovky narazí na stránku, často ignoruje všechny informace o rozvržení, založené na CSS i na základě atributu html (Toto neplatí pro všechny čtečky obrazovky, ale pro ty nejoblíbenější, jako je JAWS, Windows Eyes a Orca pro Linux je to).

Tabulková data, tzn. Data, která umožňují logický smysl uspořádat ve dvou nebo více rozměrech, s určitým typem záhlaví, se nejlépe umísťují do tabulek a používají divs ke správě rozložení obsahu na stránce. (jiný způsob, jak přemýšlet o tom, co je "tabulkové údaje", je pokusit se je nakreslit ve formě grafu ... pokud nemůžete, pravděpodobně není v tabulce nejlépe reprezentován)

Konečně, s tabulkovým uspořádáním, aby se dosáhlo jemnozrnného řízení polohy prvků na stránce, často se používají vysoce vnořené tabulky. To má dva efekty: 1.) Zvýšení velikosti kódu pro každou stránku - Protože navigace a společná struktura je často prováděna s tabulkami, stejný kód je odeslán po síti pro každý požadavek, zatímco rozložení založené na div/css táhne soubor css více než jednou, a pak používá méně wordy divs. 2.) Vysoce vnořené tabulky trvat mnohem déle, aby prohlížeč klienta vykreslit, což vede k mírně pomalejší časy načítání.

V obou případech, zvýšení "poslední míle" šířku pásma, stejně jako mnohem rychlejší osobní počítače zmírňuje tyto faktory, ale bez omezení, oni jsou stále existující problémy pro mnoho míst.

S tím vším, co říkali jiní, jsou tabulky jednodušší, protože jsou více orientované na mřížky, což umožňuje méně myšlenek. Pokud se nepředpokládá, že by daný web byl dlouhý, nebo nebude udržován, mohlo by být smysluplné udělat to, co je nejjednodušší, protože by to mohlo být nákladově nejefektivnější. Pokud by však předpokládaná uživatelská základna mohla zahrnovat podstatnou část osob se zdravotním postižením, nebo pokud by stránky dlouhodobě udržovali jiní, trávit čas dopředu, aby se věci dělaly ve stručném, dostupném způsobu, může se nakonec vyplatit více.

1
cdeszaq

Stále ještě nechápu, jak divs/CSS usnadňují změnu designu stránky, když vezmete v úvahu množství testů, které zajistí, že změny budou fungovat na všech prohlížečích, zejména se všemi hacky a tak dále. Je to velmi frustrující a únavný proces, který plýtvá velkým množstvím času a peněz. Naštěstí se legislativa 508 vztahuje pouze na USA (země zdarma - jo správně), a tak jako já jsem ve Velké Británii, mohu vyvíjet webové stránky v jakémkoliv stylu, který si vyberu. Na rozdíl od populární (americké) víry, právní předpisy ve Washingtonu se nevztahují na zbytek světa - díky bohu za to. Musí to být dobrý den ve světě web designu v den, kdy právní předpisy vstoupily v platnost. Myslím, že se stávám stále cyničtějším, jak jsem starší s 25 lety v IT průmyslu, ale jsem si jist, že tento druh legislativy je jen na ochranu pracovních míst. Ve skutečnosti může někdo srazit rozumnou webovou stránku s několika tabulkami. To vyžaduje mnohem více úsilí a znalostí, jak toho dosáhnout s DIVs/CSS. Podle mých zkušeností to může trvat hodiny a hodiny Googling najít řešení docela jednoduché problémy a čtení nepochopitelných článků ve fórech plných idealistických fanatiků všichni argumentují o 'správný' způsob, jak dělat věci. Nemůžete jen ponořit prst do vody a dostat věci do práce v každém případě. Zdá se mi také, že nedostatek definitivního průvodce používáním DIVS/CSS "mimo krabici", který se vztahuje na všechny situace, práci na prohlížečích a psaní pomocí „normálního“ jazyka bez mluvení geek, také voní po trochu protekcionismu.
Jsem vývojář aplikací a řekl bych, že trvá téměř dvakrát tak dlouho, než se vyřeší problémy s rozvržením a testují se proti všem prohlížečům, než aby vytvořily základní aplikaci, navrhly a implementovaly obchodní objekty a vytvořily databázi. zadní konec. Můj čas = peníze, a to jak pro mě, tak pro mé zákazníky, takže je mi líto, jestli neodmítám všechny argumenty pro DIV/CSS ve prospěch snížení nákladů a poskytování hodnoty za peníze pro své zákazníky. Možná je to právě to, co si vývojáři myslí, ale zdá se mi, že je jednodušší změnit složitou strukturu tabulky, než je modifikovat DIV/CSS. Naštěstí se nyní zdá, že je nyní k dispozici řešení těchto problémů - tzv. WPF.

1
Tim Black

Myslím, že se nikdo nestará o to, jak byla webová stránka navržena/implementována, když se chová skvěle a funguje rychle.

V značce HTML používám tagy "table" a "div"/"span".

Dovolte mi uvést několik důvodů, proč vybírám divs:

  1. pro tabulku musíte napsat alespoň 3 tagy (tabulka, tr, td, thead, tbody), pro Nice design, někdy máte spoustu vnořených tabulek

  2. Mám rád stránky na stránce. Nevím, jak přesně vysvětlit, ale zkusím to. Předpokládejme, že potřebujete logo a to musí být umístěno, jen malý kousek, přes obsah další stránky. Pomocí tabulek musíte vyjmout 2 obrazy a dát je do 2 různých TD. Pomocí DIVs můžete mít jednoduchý CSS arange, jak chcete. Jaké řešení se vám líbí nejlépe?

  3. když více než 3 vnořené tabulky dělají něco, o čem přemýšlím, aby to změnilo pomocí DIV

Ale stále používám tabulky pro:

  1. tabulkových dat

  2. obsahu, který se rozšiřuje

  3. rychlá řešení (prototypy), protože model DIVs boxu je v každém prohlížeči odlišný, protože mnoho generátorů používá tabulky atd

1
Dani

Při použití tabulky pro rozvržení nám chybí inovace na straně div.

Mnoho z nich přišlo s řešeními, která usnadňují vytváření rozvržení pro divs. Nejoblíbenější je architektura sítě. Na této architektuře jsou založeny generátory dynamického rozvržení. Podívejte se na: 1) 960.gs a (http://grids.heroku.com/) 2) blueprint a tolik pozdě.

Neviděl jsem mnoho inovací z hlediska architektury a nástrojů s rozložením tabulek.

Řekl bych, že všechny teorie stranou, prakticky rozložení s CSS a divs jsou rychlejší. Inovace v tomto směru ji spíše usnadnily než cokoliv jiného.

1
Pixelgrey

Tabulky jsou dobré pro HTML, které hodíte dohromady pro něco jednoduchého nebo dočasného. Pokud stavíte rozsáhlou webovou stránku, měli byste jít s divs a CSS, protože to bude snazší udržet v průběhu času, jak se mění vaše webové stránky.

1
Adam Rosenfield

1: Ano, vaši uživatelé se starají. Pokud používají čtečku obrazovky, budou ztraceny. Pokud používám jakýkoliv jiný nástroj, který se pokouší extrahovat informace ze stránky, je setkání s tabulkami, které nejsou používány pro zobrazení tabulkových dat, zavádějící.

Div nebo span je přijatelný pro oddělení obsahu, protože to je přesně význam těchto prvků. Když já, vyhledávač, čtečka obrazovky nebo cokoliv jiného, ​​narazím na prvek tabulky, očekáváme, že to znamená "následující tabulková data, reprezentovaná v tabulce". Když se setkáme s div, očekáváme, že toto je prvek použitý pro div ide můj obsah do samostatných částí nebo oblastí.

2: Čitelnost: Nesprávná. Pokud je celý kód prezentace v css, můžu si přečíst html a pochopím obsah stránky. Nebo můžu přečíst css a porozumět prezentaci. Pokud je vše html v html, musím psychicky udeřit všechny kousky související s prezentací, než uvidím, co je obsah a co ne. Kromě toho bych se bál potkat webového vývojáře, který nerozuměl css, takže si nemyslím, že je to problém.

3: Tabulky jsou pomalejší: Ano, jsou. Důvod je jednoduchý: Tabulky musí být analyzovány úplně, včetně jejich obsahu před tím, než mohou být vykresleny. Div může být vykreslen, když se setká, dokonce dříve jeho obsah byl analyzován. To znamená, že divs se zobrazí před dokončením načítání stránky.

A pak je tu bonus, že tabulky jsou mnohem křehčí a nebudou vždy zobrazeny v různých prohlížečích, s různými fonty a velikostí písma a všemi dalšími faktory, které mohou způsobit rozložení. Tabulky jsou vynikajícím způsobem, jak zajistit, že vaše stránky budou v určitých prohlížečích vypnuty o jeden nebo dva pixely, nebudou se dobře měnit, když uživatel změní velikost písma nebo změní nastavení jiným způsobem.

Samozřejmě # 1 je velký. Mnoho nástrojů a aplikací závisí na sémantickém významu webové stránky. Obvyklým příkladem jsou čtenáři obrazovky pro zrakově postižené uživatele. Pokud jste webový vývojář, zjistíte, že mnoho velkých společností, které vás jinak mohou najmout, aby pracovalo na webu, vyžadují že stránka je přístupná iv tomto případě. Což znamená, že musíte myslet na sémantický význam vašeho html. Sémantický web, nebo více relevantně, mikroformáty, rss čtečky a další nástroje, obsah vaší stránky již není zobrazen výhradně prostřednictvím prohlížeče.

1
jalf

Je mi líto mé angličtiny, ale tady je další důvod:

Pracoval jsem v nějaké vládní organizaci a důvodem, proč nepoužívat TABULKU, je pro zdravotně postižené lidi. Používají stroje k překladu webových stránek.

Problém je v tom, že tento "překladač" nemůže číst webové stránky, pokud je to provedeno tabulkou. Proč? Protože TABLE jsou pro DATAS.

ve skutečnosti, pokud používáte TABLES, pro každou CELLS musíte určit některé informace, aby se zdravotně postiženým lidem umožnilo zjistit, kde jsou v TABULCE. Představte si, že máte velký stůl a musíte se přiblížit, abyste viděli pouze jednu buňku na obrazovce: musíte vědět, v které linii/sloupci jste.

Takže, DIV jsou používány, a zdravotně postižené mohou jednoduše číst text, a nemají nějaké podivné informace o řádcích/Cols, když nemusí být tam.

Také dávám přednost TABLE, aby se rychle a snadno šablon, ale já jsem nyní zvyklý na CSS ... je to mocný, ale opravdu musíte vědět, co děláte ... :)

1
RVeur23

Flex má značku pro pokládání věcí ve vertikálních sloupcích. Nemyslím si, že mají celou věc rozvržení/obsah právo buď být upřímný, ale přinejmenším vyřešili tento problém.

Stejně jako mnoho lidí frustrovaných s CSS jsem také vypadal daleko a pro snadnou odpověď, byl podveden do pocitu nadšení, když jsem si myslel, že jsem ho našel, a pak jsem měl své naděje na kousky, když jsem otevřel stránku v Chrome. Rozhodně nejsem dost kvalifikovaný, abych řekl, že to není možné, ale neviděl jsem nikoho, kdo by nabídl ukázkový kód pro vzájemné hodnocení, který by jednoznačně prokázal, že to může být spolehlivě.

Tak může někdo z CSS straně tohoto ostrova doporučit způsob/metodiku pro stanovení vertikálních sloupců? Snažil jsem se absolutní umístění ve druhé a třetí řadě, ale skončím s věcmi překrývajícími se všude a float má podobné problémy, pokud je stránka zmenšena dolů.

Pokud by na to byla odpověď, byla bych nadšená - udělat správnou věc - Jen mi řekni něco jako, "Ahoj, zkusil jsi to ** proud: vertikální | horizontální" a já jsem úplně mimo tvoje vlasy.

1
Shanimal

Google dává velmi nízkou prioritu textovému obsahu obsaženému v tabulce. Dala jsem nějaké SEO rady místní charitě. Při zkoumání svých webových stránek používal tabulky rozložení stránek. Při pohledu na každou stránku, bez ohledu na to, jaká slova - nebo kombinace slov - ze stránek, které jsem použil ve vyhledávacím poli Google, by se stránky nevyskytovaly v žádné z nejlepších stránek vyhledávání. (Zadáním stránky ve vyhledávání však byla stránka vrácena.) Jedna stránka byla dobře zkopírována normálním standardem, aby se ve výsledcích vyhledávání vytvořil dobrý výsledek, ale stále se neobjevila v žádné z prvních stránek výsledků vyhledávání. . (Všimněte si, že tento text byl v tabulce.) Pak jsem si všiml části textu na stránkách, které byly v div spíše než v tabulce. Do vyhledávače jsme vložili pár slov z tohoto div. Výsledek? Přihlásil se na číslo 2 ve výsledku vyhledávání.

1
Simon Measures

Jednou jsem se dozvěděl, že se tabulka načítá najednou, jinými slovy, když je spojení pomalé, místo, kde tabulka přichází, zůstává prázdné, dokud není načtena celá tabulka, div na druhé straně načte horní až dolní část tak rychle, jak data přicházejí. a bez ohledu na to, zda je již kompletní nebo ne.

1
Davy

Použijte tabulky, pokud potřebujete zajistit, aby prvky v rozvržení zůstaly ve specifickém fyzickém vztahu. Pro data je tabulka obecně nejlepším prvkem rozložení, který chcete použít, protože nechcete, aby se vaše sloupce zabalily do neočekávaných způsobů a zaměňovaly asociace.

Dalo by se také namítnout, že prvky, které nesmějí obsahovat data, které musí zůstat ve specifickém vztahu, by měly být také uvedeny v tabulce.

Flexibilní css rozložení je skvělé pro obsah, který je vhodný pro mobilní zařízení a velké obrazovky a tisk a další typy zobrazení, ale někdy musí být obsah zobrazen velmi specifickým způsobem a pokud to vyžaduje, aby k němu nemohly čtenáři snadno přistupovat, mohlo by to být velmi dobře odůvodněné.

1
Sal

Snažím se vyhnout TABLE, jak je to jen možné, ale když navrhujeme komplexní formy, které kombinují více typů kontrol a různé pozice titulků s velmi přísnými kontrolami seskupení, je použití DIV nespolehlivé nebo často téměř nemožné.

Teď nebudu tvrdit, že tyto formuláře nemohly být přepracovány tak, aby lépe vyhovovaly rozvržení založenému na DIV, ale pro některé z nich je náš zákazník neoblomný v tom, že nemění stávající rozvržení z předchozí verze (napsané v klasickém ASP), protože paralely papírovou formu, se kterou jsou jejich uživatelé seznámeni.

Protože prezentace formulářů je dynamická (kde zobrazení některých sekcí je založeno na stavu případu nebo oprávnění uživatele), používáme sady skládaných DIV, z nichž každá obsahuje TABULKU logicky seskupených prvků formuláře. Každý sloupec tabulky je klasifikován tak, aby mohl být řízen pomocí CSS. Tímto způsobem můžeme vypnout různé části formuláře, aniž by to bylo problémem, že by se tabulky nepodařilo zalamovat řádky v DIV.

1
CMPalmer

Před několika lety jsem zkoumal problematiku snímačů obrazovky a tabulek a přišel s informacemi, které odporují tomu, co většina vývojářů věří:

http://www.webaim.org/techniques/tables/

"Pravděpodobně uslyšíte některé obhájce přístupnosti, kteří říkají, že tabulky rozvržení jsou špatný nápad, a že by měly být místo toho použity techniky rozvržení CSS. Je pravda, co říkají, ale abych byl upřímný, použití tabulek pro uspořádání není nejhorší to, co byste mohli udělat, pokud jde o dostupnost, lidé se všemi druhy postižení mohou snadno přistupovat k tabulkám, pokud jsou tabulky navrženy s ohledem na dostupnost.

1
Rimian

Domnívám se, že se jedná o problém spojený s obecným problémem. Když se HTML narodilo, nikdo nemohl předvídat jeho široké využití. Další technologie, která se téměř zhroutila pod váhou vlastního úspěchu. Když byly HTML stránky napsány v vi na zeleném textovém terminálu, TABULKA byla vše, co bylo potřeba k prezentaci dat návštěvníkům stránky, a to většinou data, která dávala smysl ve formě tabulky.

Všichni víme, jak se věci vyvíjely. TABULKY vycházely z módy poměrně nedávno, ale existuje spousta důvodů, proč dávat přednost DIV a CSS rozložení (přístupnost ne poslední z nich). Samozřejmě nemohu napsat CSS, aby mi zachránil život :-) a myslím si, že grafický design expert by měl být vždy po ruce.

To znamená, že existuje spousta dat, které by měly být uvedeny v tabulce i na moderních webových stránkách.

1
Manrico Corazzi

Pokud podporujete úhel stolu na tomto místě, najděte si stránku s tabulkami a pak si vezměte si obrazovku - vypněte prohlížeč obrazovky a vypněte monitor.

Pak to zkuste s pěkným sémanticky správným místem rozložení div.

Uvidíte ten rozdíl.

Tabulky nejsou zlé, pokud data v nich nejsou tabulková, aby se stránka nerozložila.

1
Allen Hardy

Podle mých znalostí v tabulkách, pokud je vnořeno příliš mnoho tabulek, je při prohlížení stránky velká režie prohlížeče.

1 - Prohlížeč čeká na zobrazení konečného zobrazení počkejte, až se načte celá tabulka.

2 - Algoritmus pro vykreslení tabulky je drahý a není v jediném kroku. Prohlížeč, jak a kdy, dostane obsah, pokusí se vykreslit výpočet šířky a výšky obsahu. Pokud tedy máte vnořené tabulky, řekněme, že prohlížeč obdržel první řádek a první buňka má velké množství obsahu a šířky a výšky, která není definována, bude vypočítávat šířku a vykreslí první řádek. zatímco dostane druhý řádek bude buňka # 2 mít spoustu obsahu! Nyní bude vypočítat šířku pro buňky 2. řady .. A co první? Rekurzivně vypočítá šířky. To je špatné na straně klienta. (Chcete-li umístit příklad) Jako programátor budete optimalizovat materiály, jako je čas na načítání dat, optimalizované datové struktury atd. Optimalizujete věci na straně serveru, řekněme za 2 sekundy, ale koncový uživatel získá konečný přehled 8 sekund. Co je tady špatně? 1. Může být síť pomalá! Co když je síť v pořádku? Co je to síť doručuje obsah v příští 1 sec? Kde je tato extra spotřeba 5 sekund? Věc se obávat-- Prohlížeč možná bere spoustu času při odhadu a vykreslování tabulek!

Jak optimalizovat tabulky? Pokud používáte tabulky, navrhuji, vždy definujte šířku buněk. To nezaručuje, že prohlížeč bude slepě brát tuto šířku pouze, ale byl by velkým přínosem pro prohlížeč při rozhodování o počátečních šířkách.

Ale na konci, div je skvělý způsob, jak CSS může být cache do prohlížeče; zatímco tabulka není uložena do mezipaměti!

1
Biranchi Panda

Tabulky použité jako čisté rozložení představují určité problémy s přístupností (které jsem slyšel). Ale chápu, co se tu ptá, že nějakým způsobem ochromujete web pomocí tabulky, abyste zajistili správné zarovnání něčeho na vaší stránce.

Slyšel jsem, že se lidé hádají, že štítky a vstupy FORM jsou ve skutečnosti data a že by měly být povoleny do tabulek.

Argument, že použití tabulky, aby se ujistilo, že několik prvků řádně zapříčiní tento masivní nárůst kódu, má tendenci zahrnovat příklady toho, jak může jediný DIV splnit všechny své potřeby. Ne vždy obsahují 10 řádků CSS a speciální hacky prohlížeče, které museli psát pro IE5, IE5.5, IE6, IE7 ...

Myslím, že to zůstává o použití rovnováhy ve vašem návrhu. Tabulky jsou v sadě nástrojů, jen si pamatujte, co jsou pro ...

0
HB

OP byl jistě trochu větrem, argumenty se zdají být tak týdenní a lze s nimi snadno bojovat.

Webové stránky jsou doménou webových vývojářů, a pokud říkají div & CSS je lepší než tabulky, které jsou pro mě dost dobré.

Pokud je rozvržení dosaženo tabulkami generovanými serverovou aplikací, pak nové uspořádání znamená změny v aplikaci, přestavbu a redelpoy aplikace, což se týká pouze změn v souboru css.

Plus, přístupnost. Tabulky použité pro rozložení činí web nedostupným, takže je nepoužívejte. Není to žádný nápad, nemluvě o nelegálních.

0
Ian

Super krátká odpověď: navrhování udržitelné webové stránky je obtížné s tabulkami, a jednoduchý se standardním způsobem, jak to udělat.

Webové stránky nejsou tabulkou, jedná se o soubor komponent, které spolu komunikují. Popis to jako stůl nedává smysl.

0
Rich Bradshaw

Pokud jde o údržbu stránek a generální opravy při zachování obsahu (který se neustále vyskytuje, zejména v eCommerce):

Obsah a design se spojí dohromady pomocí tabulek = aktualizace obsahu i designu.

Obsah oddělený od designu = aktualizace designu a možná i malý obsah.

Kdybych to měl tak, nechal bych svůj obsah v PHP generování XML, konvertoval do značek v XSLT a navrhl s CSS a Javascript pro interakci. Pro Java stranu věcí, JSP k JSTL generovat značení.

0
mltorrefranca

Pomocí DIV můžete snadno přepínat věci. Můžete to provést například takto:

Menu | Content

Content | Menu

Menu
----
Content

Je snadné ji změnit v CSS, ne v HTML. Můžete také poskytnout několik stylů (pravou rukou, levou rukou, speciální pro malou obrazovku).

V CSS můžete také skrýt nabídku ve speciálním stylu, který se používá pro tisk.

Další dobrá věc je, že váš obsah je vždy ve stejném pořadí v kódu (menu nejprve, obsah po), i když je to vizuálně prezentováno jinak.

0
ofaurax