Na navigaci | Klávesové zkratky

Translate to English… Ins Deutsche übersetzen…

Statistika používání HTML značek

Která značka je nejpoužívanější? Je více formulářů POST nebo GET? A jak vypadá běžná událost onclick?

Pracuji na projektu, kvůli kterému jsem si vytvořil statistiku používání HTML značek, jejich atributů a hodnot. Výsledky jsou celkem zajímavé, takže se s vámi o ně podělím. Topten nejpoužívanějších značek vypadá následovně:

Jak v tabulce číst? V prvním řádku vidíme, že 18% značek v průměrném dokumentu představuje kotva <a>. Celých 99% kotev má uveden atribut href, 22% atribut title atd. Druhá nejpoužívanější značka je <td>, na obrázku vidíme i přehled nejčastějších hodnot atributu class (zobrazí se v moderních browserech po najetí myšky na buňku tabulky).

Dlouho jsem přemýšlel, jak pro měření získat objektivní vzorek dat. Nakonec jsem analyzoval prvních deset odkazů, které vrací Jyxo pro každé slovo z Top 1000. Po promazání atypických souborů vznikl různorodý vzorek cca 10.000 stránek. Pro zajímavost jsem vytvořil druhou statistiku, která zahrnuje titulní stránky všech webů umístěných v galerii CSS Vault (bohužel vzorek je docela malý).

Tady jsou:

Co lze vyčíst

Zajímavé je zejména srovnání obou tabulek. Rozdíly v popularitě značek asi neprozradí nic překvapivého, ale velmi krásně demonstrují odlišnost zastaralého a moderního pojetí webdesignu. Co dále… všimněte si, že obvyklé šířky tabulek jsou kolem 98% (jestlipak víte proč?). Kódování windows-1250 je cca 4× častější, než iso-8859–2. Velká spousta webů chybně uvádí kód jazyka ‚cz‘ namísto správného ‚cs‘. Perličkou je, že tučné písmo rádi barvíme do tmavě modré či červené.

A tak bych mohl pokračovat. Najdete-li sami něco zajímavého, můžete se zmínit v komentářích.

Komentáře

  1. Petr Krontorad #1

    avatar

    skvela prace davide!

    par rychlych postrehu:
    toplist je 4× oblibenejsi, tvurci „modernich“ webu radi dokazuji, ze prave oni jsou validni (odkazem na w3c) ;) ve formularich je skoro stejne tlacitek jako textovych poli, oboje je vsak zabarina proti skrytym polim (type=„hidden“), kterych je 2× vic nez predchozich dohromady. Pro paranoiky – kazda informace o nas, zadana a poslana na jakekoliv strance, je doprovazena 4× vice udaji, ktere bychom dobrovolne nikdy nezadali. co tam asi posilame? ;)) orwell hadr :)

    před 11 lety
  2. Jiří Bureš http://blog.converter.cz/ #2

    Připomenul bych svůj starší miniseriál o výskytu tagů ve zdrojových kódech: poslední díl je na http://blog.converter.cz/index.php?….
    Vidím, že výsledky se za ty dva roky zásadně nezměnily. Ale těžko srovnávat nesrovnatelné.

    před 11 lety
  3. Ota #3

    Jako laik jsem si na webech nejčastěji všimnul značky „Práce na silnici“ doprovázené textem Under Construction.

    před 11 lety
  4. rony #4

    este by si mohol vyhodnotit, v kolkych percentach dokumentov sa ta-ktora znacka nachadza. napriklad by som ocakaval, ze html a body budu zarucene v kazdom z nich.

    před 11 lety | reagoval [5] Adam Hošek [23] David Grudl
  5. Adam Hošek http://mamuf.webik.info/ #5

    avatar

    #4 rony, HTML a BODY nejspíš budou v 99,999 % případů, z výsledků vyplývá, že David měřil celkové počty výskytů :). Ano, souhlasím, byla by asi zajímavější statistika zaměřená na využitelnost elementů jednotlivými stránkami. Kolik stránek má H1? kolik na stránkách obvykle bývá H2? Kolik odkazů, kolik seznamů (různých typů), kolik tabulek? I když je mi jasné, že zpracování statistik není žádná legrace :). Tedy pokud si na to nenapíšu kvalitní rozřazovací a porovnávací program :).

    před 11 lety | reagoval [14] David Grudl
  6. Jan Angelovič #6

    avatar

    Předně chválím moc zajímavý článek!

    K datům (CZ):
    asi nejvíce mě překvapil stále vysoký podíl FONT. 3,7% je oproti kdysi rovněž hojně používanému CENTER (0,34%) opravdu dost. A přitom zrovna podpora formátování písma pomocí CSS je v prohlížečích celkem dobrá.

    Nepoměr mezi TABLE (2,7%) a TBODY (0,13%) naopak nepřekvapí.

    před 11 lety | reagoval [27] Jan Angelovič
  7. rADo http://hulan.cz/blog/ #7

    avatar

    Bezvadný nápad a skvělá analýza, Davide. Dík! :-)

    před 11 lety
  8. Jan Angelovič #8

    avatar

    Souhlasím, že satistika přepočtená na stránku by byla velice zajímavá.

    Paradoxně je pravděpodobnější výskyt nepovinné značky HTML než některých povinných.

    před 11 lety
  9. Jan Bien #9

    avatar

    Vynikající a nápaditý článek, díky. David nikdy nezklame.

    před 11 lety
  10. Ivorius http://textpattern.ivorius.com #10

    Nějak jsem si toho nikde nevšiml, kolik má % div **id? **

    před 11 lety
  11. meca http://madinblack.com #11

    Mňo mě třebas zaujalo, že class u <hr /> má v css vault skoro v pěti procentech „schovej“, kdežto u českých webů člověk nenajde český pojmenování…

    Nebo že class u <td> lidi pojmenovávají „Radek“ …

    Ne, je to naprosto úžastný! Dik.. Myslim, že se v tom budu hrabat zbytek roku ;)

    před 11 lety
  12. myf #12

    : ) zrova nedávno jsem přemýšlel nad podobným průzkumem – analyzovat barevnost stránek (prostě hledat v CSS hexa, RGB nebo jména barvy, nejspíše pro background-color) a pokusit se vyabstrahovat „Jaký typ autorů jak barví? / Souvisí barva s osahem stránek?“ Napadlo mě to po té, co jsem za jeden den na českém netu viděl třetí stránku s „pixy-like“ #ff9900 oranžovým pozadím : )

    před 11 lety | reagoval [14] David Grudl
  13. lukas #13

    Ohhh, to super. Wooowww… Paradni clanek.

    před 11 lety
  14. David Grudl http://davidgrudl.com #14

    avatar

    #5 Adame Hošku, tento přepočet jsem použil u atributů, u značek zase tak zajímavý nebyl. Informace, že téměř každá stránka obsahuje <p> a <br> je méně zajímavá, než jejich poměr. Ale přidám i tuto hodnotu do tabulky, třeba jako title buňky.

    #12 myfe, a že bychom sestavili průměrnou webovou stránku? :-)

    před 11 lety | reagoval [15] rADo
  15. rADo http://hulan.cz #15

    avatar

    #14 Davide Grudle, ten podíl tagů <br> je opravu tragický ve srovnání s <p>. JE vidět, že lidé stále neumí používat margin na dělání mezer mezi odstavci, a používají místo toho 2× <br>. Osobně toto považuji za maximální možnou prasárnu.

    před 11 lety | reagoval [16] meca
  16. meca http://madinblack.com #16

    #15 rADo, IMHO lepší, než tam dávat 4× br ;)

    před 11 lety
  17. Mirda #17

    avatar

    Nestačím se divit, jakými kravinami se někteří z nás zaobírají.

    Zabýval jste se někdy statistikou na nějaké vyšší úrovni, nebo stavíte na znalostech střední školy, kde se vysvětlil průměr a procenta?

    Přesto by mě zajímalo, kvůli jakému projektu jste tuhle statistiku potřeboval. Určitě půjde o něco hodně zajímavého.

    Nakonec to je aspoň základ k nádherné diskusi, kde mě fascinují výroky jako „Nepoměr mezi TABLE (2,7%) a TBODY (0,13%) naopak nepřekvapí.“ Chechtám se ještě teď :))))

  18. Lukáš Mačí http://maciweb.net #18

    Bezva statistika. Díky!

    před 11 lety
  19. David Grudl http://davidgrudl.com #19

    avatar

    #17 Mirdo, stavím na znalostech prvního stupně základní školy, právě tam jsme se průměr a procenta učili. Docela mě překvapuje, že vám tyto znalosti odpírali až do střední školy, my se v té době věnovali integrálům (to jsou takové skrůcánky, víte?) :-)

    před 11 lety | reagoval [20] Lukáš Mačí
  20. Lukáš Mačí http://maciweb.net #20

    #19 Davide Grudle, Davide, na prvním stupni ZŠ se takové věci neučí. Vím to moc dobře, protože první stupeň ZŠ „máme doma“ :)

    před 11 lety | reagoval [23] David Grudl
  21. Jan Angelovič #21

    avatar

    #17 Mirdo,
    „Chechtám se ještě teď :))))“

    Rád jsem vás pobavil, jen nechápu čím.

    před 11 lety | reagoval [27] Jan Angelovič
  22. Alex http://www.cheese.cz #22

    Všechno zajímavé už bylo řečeno, poměr DIVů a „TDů“ každému krásně řeknou jak moc autor pronikl do CSS.

    Smekám. Je to opravdu ohromná práce a nejzajímavější projekty ( #17 Mirda ) vznikají z takových „hloupostí“. Výborný nápad a ještě lepší zpracování.

    Jen na mém pomalejším počítači Opera moc nestíhá zobrazování výsledků do tabulky… No stane se. :)

    před 11 lety
  23. David Grudl http://davidgrudl.com #23

    avatar

    #20 Lukáši Mačí, že by druhý? Každopádně tímto zdravím paní učitelky Černohorskou a Krůtilovou. S tím, co mě naučily na základní škole, jsem si vystačil celou střední a kousek vysoké. A možná taky kvůli tomu jsem začal střední flákal a vysokou nedokončil.

    Updatnul jsem tabulky, viz #4 rony

    před 11 lety | reagoval [24] Sodalite [25] rADo
  24. Sodalite http://www.sodalitebbs.net #24

    avatar

    #23 Davide Grudle, A kolikrát Tě Krůtilová vykrákala za vlasy? Mě určitě mockrát. Nicméně mě taky něco naučila. :)

    před 11 lety | reagoval [26] David Grudl
  25. rADo http://hulan.cz #25

    avatar

    #23 Davide Grudle, fajn, teď to dostalo ještě větší smysl. Ale moc tomu nerozumím. Tag <a> obsahuje jenom 93% stránek. Co ten zbytek? Otevírané odkazy přes onClick na tagu img?

    Vše je možné, ono <h1> na pouhých 32% a <h2> na 23% něco říká, tedy to, že se používá jen <table> a <font>tagy.

    Je to dobře. V takovéto situaci se moc dobře dělá „SEO“, což není nic jiného, než slušně napsaný web.

    před 11 lety | reagoval [26] David Grudl
  26. David Grudl http://davidgrudl.com #26

    avatar

    #24 Sodalite, dnes už by to měla obtížnější :-D

    #25 rADo, spousta stránek neobsahuje odkazy především kvůli používáním frame (iframe), fullscreen flash nebo redirektů přes meta tag či javascript.

    před 11 lety
  27. Jan Angelovič #27

    avatar

    #21 Jane Angeloviči, #6 Jan Angelovič
    Aha, tak jsem se kouknul do DTD HTML 4.01 a sypu si popel na hlavu. :-(

    TBODY je nepovinný prvek. Už mi to ISO leze na mozek.

    před 11 lety
  28. Jódlující bernardýn http://www.bernardyn.net/ #28

    avatar

    Skvěle, Davide!

    Zaráží mě ale 64% užívání class u DIVů a jen 20% id… Spíš bych si to představoval naopak…

    před 11 lety | reagoval [31] David Grudl
  29. Leo #29

    „TBODY je nepovinný prvek. Už mi to ISO leze na mozek.“

    Tak to ja ziju v pocitu, ze je povinny (HTML Strict), ale ma volitelny pocatecni a koncovou znacku. Coz vypada jako nesmysl, ale pokud tbody vynechate a pak si projdete takovy HTML pres DOM/JavaScript, zjistite, ze prakticky vsechny prohlizece si uzel typu element TBODY vytvori :-) Leo

    před 11 lety | reagoval [32] Jan Angelovič
  30. Dero #30

    avatar

    Vynikající článek, díky za něj!

    Budu se vracet a odkazovat – skvělá práce.

    před 11 lety
  31. David Grudl http://davidgrudl.com #31

    avatar

    #28 Jódlující bernardýne, no obvykle class definuješ proto, aby jsi ji použil vícekrát, zatímco id právě jednou, ne?

    před 11 lety
  32. Jan Angelovič #32

    avatar

    #29 Leo,
    Máte samozřejmě pravdu, vyjádřil jsem se nepřesně:

    Prvek TBODY je povinný, ale jeho vyznačení je nepovinné.

    před 11 lety
  33. myf #33

    http://code.google.com/…s/index.html
    něco úplně stejného v rámci google code? teda ve srovnání s tebou, dgx, mi to připadá jako celkem žabařina. Buď to nedovedou tak pěkně prezentovat, nebo to jsou prostě žabaři s trochu širším záběrem (?) a užitím SVG (zbytečným?) . To jen aby tu byl crosslink.
    (via google blogscoped )

    před 11 lety
  34. Bubák #34

    Od vydání článku uběhla dlouhá doba, ale dneska jsem ze zvědavosti hledal, jak často se používá tag BASE s atributem „href“, ale tahle kombinace v tabulce chybí.
    Je to proto, že se používá zřídka, nebo se zapomělo?

    před 9 lety

Tento článek byl uzavřen. Už není možné k němu přidávat komentáře.