Komparácia validity webstránok mobilných operátorov v SR


Validita HTML kódu je jedným z niekoľkých desiatok kritérií, ktoré sú dôležité pre pozicioning stránky vo vyhľadávačoch (SERP), komfort používateľa pri práci s webom ako aj prístup automatov a pavúkov na webové stránky. Mnohí programátori validitu podceňujú a sústreďujú sa len na vizuálnu správnosť zobrazenia kódu interpretáciou v rôznych prehliadačoch. Napriek tomu je dôraz na validitu kódu na mieste a prevádzkovateľovi prináša mnohé výhody. Dôležitosť týchto faktorov zdôrazňujú aj top experti na SEO, ktorí o.i. považujú za dôležitú napríklad nedostupnosť stránky alebo jej časti, CSS chyby a úpravy (skrývanie častí textu). Rozhodli sme sa zhodnotiť, ako sú na tom webstránky troch slovenských mobilných operátorov. Tento test nadväzuje na výsledky merania spred dvoch rokov. V predchádzajúcom prieskume z roku 2009 sme zistili, že T-mobile je jediným slovenským operátorom, ktorý má plne validný HTML kód. Z nasledujúcej, detailnejšej analýzy, vyplynú závery, či a  ako operátori zmenili webstránky a urobili v tomto smere nápravu.

Metodika merania

Použili sme  6 kritérií, ktorými možno hodnotiť validitu kódy, kompatibilitu s prehliadačmi a čistotu kódu. Zvolili sme tieto kritériá a stanovili nasledovné váhy (v %) na celkovom skóre:

KritériumVáha
HTML errors30%
HTML warnings15%
CSS errors25%
CSS warnings10%
Broken links10%
Page loaading time (s)10%

HTML errors hodnotí počet HTML chýb, ktoré boli nájdené validátorom W3C. Rovnaký nástroj sme použili aj pre identifikáciu počtu HTML varovaní. HTML chyby majú spomedzi kritérií najväčšiu váhu, HTML varovania majú nižšiu váhu z dôvodu, že nejde o jasné porušenie W3C štandardov, ale neobvyklé tagovanie alebo súvislosti, ktoré sú pre validátor podozrivé aleb neurčité. Podobne sme získavali a vyhodnocovali údaje pre CSS chyby, s použitím CSS validátora. Výsledky v tomto ukazovateli majú v porovnaní s HTML chybami a varovaniami relatíve nižšie váhy. Ďalšími hodnotenými parametrami sú Broken links – nedostupné linky alebo iné problémy s linkami (vrátaná hodnota 404 a iné), a Page loading time, teda čas načítania webstránky vrátane všetkého obsahu. Pri poslednom kritériu hodnotíme len dĺžku načítania stránky ako celku a nie jednotlivých elementov separátne. Aj tu by sa v prípade požiadavky na detailnejšiu analýzu dalo ísť viac do hĺbky, skúmať dĺžku loadu jednotlivých prvkov a zamerať sa na jej optimalizáciu. Celkový čas načítania webstránky  sa totiž skladá z týchto typických častí:

  • HTML kód,
  • HTML obrázky,
  • CSS obrázky,
  • JavaScript,
  • CSS,
  • Multimedia,
  • Iné.

Použili sme nástroj Web Page Analyzer vo v 0.98, ktorý meria dĺžku načítania simulovaním rôznych rýchlostí pripojenia. Použili sme rýchlosť 1.44 Mbps a merania sme 3 x opakovali a použili priemernú hodnotu pre minimalizáciu vplyvu ad-hoc faktorov. Všetky merania sa uskutočnili v priebehu dňa 1.3.2011.

Namerané hodnoty

Nasledujúca tabuľka zobrazuje namerané hodnoty. Hodnoty prvých piatich kritérií sú uvedené v ks (počet chýb), hodnota šiesteho kritériá je meraná v sekundách.

KritériumVáhaOrangeT-mobileO2
HTML errors (ks)30%2401
HTML warnings (ks)15%200
CSS errors (ks)25%1420115
CSS warnings (ks)10%80801134
Broken links (ks)10%311
Page loaading time (s)10%5,4119,494,04

Ako vidno z tabuľky, v troch kritériách dominuje negatívne Orange, ktorý vykazuje najväčšie počty chýb. V štvrtok kritériu ho prekonal O2, kde sa počet CSS varovaní dostal nad magickú hranicu 1000. Zaujímavé zistenie je aj pri parametri Page loading time, v ktorom boli Orange a O2 pomerne vyrovnaní a dosiahli štandardné hodnoty, T-mobile však vykazoval mimoriadne dlhú dobu načítania obsahu. Bola spôsobená najmä vysokým počtom obrázkov, prevažne v CSS, pričom ich celkový počet na stránke bol 79. Takmer 4 sekundy trvalo natiahnutie HTML obrázkov necelých 13 sekúnd CSS obrázkov. Tieto dve časti tvorili gro celkovej nameranej hodnoty 19,49 sekundy.

Výsledky

Namerané hodnoty sme konvertovali na bodové hodnotenie (0-100), pričom 0 je najhorší výsledok a 100 najlepší, s použitím nasledujúceho vzorca:

(MAX($C2:$E2)-C2)/MAX($C2:$E2)*100

Výsledok pre Orange: (24-24)/24*100 = 0
Výsledok pre T-mobile: (24-0)/24*100 = 100
Výsledok pre O2: (24-1)/24*100 = 95,83

Po aplikovaní prepočtových pravidiel sme získali výsledné hodnoty bodového hodnotenia, ktoré sme následne vyvážili pomocou definovaných váh a získali tak ich sčítaním finálne skóre pre jednotlivé hodnotené webstránky.

KritériumVáhaOrangeT-mobileO2
HTML errors30%0,00100,0095,83
HTML warnings15%0,00100,00100,00
CSS errors25%0,00100,0019,01
CSS warnings10%28,75100,000,00
Broken links10%0,0066,6766,67
Page loaading time (s)10%72,240,0079,27
Výsledné skóre10,1086,6763,10
Poradie312

Jednoznačným víťazom v teste sa stal T-mobile, ktorý až v štyroch hodnotených ukazovateľoch dosiahol plné bodové hodnotenie (100 bodov).  Výsledné skóre po aplikácii váh je 86,67.  Potvrdil tak pozíciu z minulého testu, v ktorom rovnako ako jediný preukázal maximálne štandardy v oblasti validity kódu.

Na druhom mieste skončil O2 a posledný Orange, ktorého výsledné hodnotenie sa blíži k minimálne dosiahnuteľnej hranici. Najmä Orange by mal podľa týchto výsledkov na webe výrazne zapracovať a okrem iného zvalidovať používaný kód a aplikovať štandardné CSS.

Použité nástroje

<table border=”0″ cellspacing=”0″ cellpadding=”0″ width=”227″><col width=”146″></col> <col width=”81″></col> <tbody> <tr height=”20″> <td width=”146″ height=”20″>HTML errors</td> <td width=”81″ align=”right”>30%</td> </tr> <tr height=”20″> <td height=”20″>HTML warnings</td> <td align=”right”>15%</td> </tr> <tr height=”20″> <td height=”20″>CSS errors</td> <td align=”right”>25%</td> </tr> <tr height=”20″> <td height=”20″>CSS warnings</td> <td align=”right”>10%</td> </tr> <tr height=”20″> <td height=”20″>Broken links</td> <td align=”right”>10%</td> </tr> <tr height=”20″> <td height=”20″>Page loaading time (s)</td> <td align=”right”>10%</td> </tr> </tbody> </table>

, , , , , , , , , , , ,

  1. #1 by michal rusina on March 7, 2011 - 6:43 pm

    Vzhladom na povahu css mi pride nevhodne priradovat css varovaniam 10% hodnotu a chybam az 25%. Vacsina varovani a chyb je totiz sposobena pouzitim modernych css3 a/alebo propiertarnych vlastnosti ktore v modernych prehliadacoch zlepsuju funkcnost ci dizajn a starsie ich spolahlivo ignoruju. Dalsim castym dovodom pre varovania je rovnaka farba popredia (textu) a pozadia na elementoch ktore bud text nemaju alebo odinokadial dedia ine farby a vsetko je z pohladu pouzitelnosti ok. Vacsiu vahu by som priradil rychlosti nacitania, poctu http requestov (cim menej tym lepsie) existencii mobilnej verzii atp.

    • #2 by Andrej Miklošík on March 8, 2011 - 6:34 am

      Michal vďaka za koment. Pridelenie váh je plne v kompetencii hodnotiaceho, preto odporúčam zvážiť tento návrh a v prípade potreby priradiť týmto dvom kategóriám nižší význam. Samotný W3C CSS Validator má už 2 roky vytvorený aj profil pre CSS 3, preto je možné validovať CSS aj oproti tomuto štandardu (v ďalších možnostiach CSS Validátora zvoľte profil CSS level 3).

  2. #3 by michal rusina on March 8, 2011 - 1:17 pm

    Skor som mal na mysli vlastnosti ako -webkit-box-shadow a -moz-box-shadow (napr.) ktore zobrazi chybu ale je uplne ok a casto vyuzivane kym nebude 100% podporovany box-shadow vsetkymi browsermi.

  3. #4 by Andrej Miklošík on March 8, 2011 - 1:36 pm

    Tých “hackov” by si asi našiel mnoho, každopádne je fajn, že nový Firefox 4+ už prefix “moz” nevyžaduje, čiže všetko je to otázka času. Pozrel som sa na CSS warnings a errors pri operátoroch, pri validácii oproti štandardu CSS level 3 sa počet odchýliek oboch typov od štandardu takmer nezmenil, pri O2 mierne klesol počet chýb. Ani jedna odchýlka sa ale v tomto prípade netýka -webkit-box-shadow a -moz-box-shadow.

  4. #5 by Matej Istvan on April 21, 2011 - 9:41 am

    Vie my niekto poradit ako dosiahnem pagerank aspon 1 vsetko mam v poriadku v kode a kolko asi odkazov musim mat ?

    • #6 by Andrej Miklošík on April 26, 2011 - 6:06 am

      V prvom rade to chce určitý čas. Pošlite mi info, odkedy máte web online a naplnený obsahom a URL, pozriem sa na to. Presné čísla neexistujú, skúsim Vám poradiť.

(will not be published)


seven + = 11