Üks kontsern, kaks erinevat veebikvaliteeti

Kui visuaalsete eelistuste või ka hinna osas on enamasti ülevaade selgem, siis kvaliteedi poolelt on kriteeriumide defineerimine märksa keerukam, sest puudub päris täpne ülevaade, mida üks või teine omadus endaga kaasa toob. 

Kui tellijal ei ole tehnilist tausta ja üldse mingeid kvaliteedikriteeriume sätestatud, siis on ka hilisemas valmimisfaasis üsna vähe pidepunkte, kuidas tulemust hinnata. Selleks, et olulistele asjadele tähelepanu juhtida, vaatame käesolevas ülevaates lähemalt, millised on tehnilise kvaliteedi elemendid, mis määravad kõige rohkem veebirakenduse püsivat töökindlust.

Põhimõttelised erinevused

Veebiplatvormide ülesehituse ja sisemiste erinevuste võrdluse kohta on soovitav lugeda sissejuhatuseks artiklit "Punnvõrrist kaubikuni - sisuhaldussüsteemide erinevusest", mis aitab mõista ka erinevate sisuhaldusplatvormide, näiteks WordPressi, Drupali ja FastLioni erinevusi ajaloolises perspektiivis. 

Drupal versus FastLion

Eelnevalt viidatud artiklis on küll kirjeldatud sisuhaldussüsteemide ülesehituse põhimõttelisi erinevusi, kuid need võivad ilma konkreetsete näideteta jääda mõnevõrra abstraktseks. Käesolevas ülevaates võtame luubi alla konkreetsemalt Drupali ja FastLioni toimimise konkreetsete parameetrite võrdluse najal.

Üks kontsern, mitmed tootmisüksused

Prantsusmaal üle 350 aasta tagasi asutatud Saint Gobain kontsern alustas klaasi valmistamisest, kuid on nüüdseks laienenud mitmesuguste teiste ehitusmaterjalide arendusse ja tootmisse. Kontsernil on universaalsed üldised tegutsemisprintsiibid, kvaliteedinõuded ja isegi ühtne visuaalne identiteet. Samas on üksikud tootmisüksused eraldi tütarfirmad, mis organiseerivad enda tööd, sealhulgas veebikommunikatsiooni üksteisest suhteliselt sõltumatult.

Brändi visuaalkuvand

Selleks, et ühtlustada erinevates riikides ja väiksemates linnades tegutsevate tootmisüksuste visuaalset kommunikatsiooni, on välja töötatud ühtne brändi visuaalreeglistik, mis hõlmab nii logo kasutust kui ka mitmesuguste presentatsioonimaterjalide formaate, sealhulgas ka veebilehtede visuaaldisaini.

Veebiplatvormide valik pole reglementeeritud

Kuna erinevatel tootmisüksustel on enda töö korraldamisel suhteliselt vabad käed, siis paistab, et tehased on tellinud enda veebilahendused erinevatelt veebirakendusi pakkuvatelt firmadelt. Kuna ühtseid kvaliteedisuuniseid ei ole kontserni tasandil sätestatud, siis ei ole tellimisel arvatavasti ka platvormi valikule väga palju tähelepanu pööratud. Vaatleme kahte näidet, kus kvaliteet varieerub päris mitmete kriteeriumite järgi vaadeldes väga laiades piirides.

Drupal versus FastLion

Jälgides erinevate lehtede ülesehitust ja tehnilist toimivust, saame võrrelda kahe tootmisüksuse lehti, mis on erinevatel platvormidel. Võtame vaatluse alla:

• Drupal platvormil Saint-Gobain Ehitustooted AS www.saint-gobain.ee
• FastLion platvormil Saint-Gobain Glass Estonia SE www.sgge.ee

Järgnevalt vaatame lehtede toimivust mitmete kvaliteediparameetrite järgi

Ehitustoodete lehe koodis paistab, et leht on genereeritud Drupal 8 CMS versioonis.

FastLion platvorm

Teine võrreldav leht, Saint-Gobain Glass Estonia SE www.sgge.ee on loodud Aara disainibüroo poolt FastLion sisuhaldussüsteemi raamistikule.

Google PageSpeed Insights

Tänases veebikeskkonnas on mitmeid standardeid, mida tasub silmas pidada. Turundust, nähtavust ja paremat leitavust silmas pidavatele organisatsioonidel tasub alati alustada Google poolt avaldatud soovituslikest kriteeriumidest, mille järgi Google hindab lehtede kvaliteeti.

PageSpeed Insights, mis on nii veebiarendajatele kui ka kõigile teistele vabalt kättesaadav aadressil https://developers.google.com/speed/pagespeed/insights/ ja selles saab lehtede erinevaid elemente analüüsida.

Võrreldavad alamlehed

Selleks, et lehed oleksid enam-vähem võrreldavad ka sisu poolest, võtsime visuaalselt üsna sarnase väljanägemise ja mahult samaväärse pikkuse ning illustratsioonidega alamlehed uudiste sektsioonist. Täpsed alamlehed olid:

• Saint-Gobain pälvis [..] "Top Employer" sertifitseeringu
• Baltiklaasi [..] meeskond läks [..] messile [..] uue lahendusega

Mõlemal oli võrreldavalt sarnases mahus teksti ja lugu ilmestas üks illustratsoon.

PageSpeed kategooriad

Kuna Google on veebikeskkonnas üsna olulise autoriteediga, siis analüüsisime PageSpeed Insight keskkonnas mõlemat - nii Mobiilse seadme vaadet kui ka suuremates, lauaseadmetes optimaalseks peetavaid kriteeriume.

Mobiilne vaade

Hoolimata sellest, et Google PageSpeed Insight reeglistik on üsna paljude kriteeriumidega ja pidevas muutumises, on esmane Saint-Gobain Glass lehe www.sgge.ee skoor PageSpeed mobiilses kategoorias paljutõotavalt kõrge, saavutades maksimaalsed võimalikud 100 punkti, mis on selgelt "Kiire".

Huvitav tõsiasi on, et mobiilsete seadmete kiire arenguga just viimastel aastatel on kriteeriume mitmel korral muudetud, kuid juba kaks aastat tagasi valminud www.sgge.ee täidab neid siiani ülihästi.

Drupal jääb punasesse

Ehitustoodete lehe www.saint-gobain.ee tulemus on märksa tagasihoidlikumate killast, jäädes sedavõrd mitmetes kategooriates punase joone alla, et tulemus tuleb vaid 31 punkti, mis jääb selgelt vahemikku "Aeglane".

Lauaarvutite vaade

FastLionil jooksva Saint-Gobain Glass lehe www.sgge.ee skoor ka suuremate ekraanide kategoorias pole sugugi halvem kui mobiilsete kriteeriumide järgi, ka siin paistab 100 punkti.

Drupalil töötava Ehitustoodete lehe www.saint-gobain.ee tulemus pole küll lauaarvutite vaates nii halb kui mobiilses vaates, kuid jääb skooriga 55 punkti kiiremast otsast ikkagi üsna kaugele.

Suurim probleem paistab Drupali puhul aeglases lehe genereerimise ajas, mille sümptomid on kõige paremini nähtavad PageSpeed "Lab Data" sektsioonis. Selgub, et kasutajad peavad mobiilses vaates ootama üsna mitmeid sekundeid enne kui midagi üldse ekraanile nähtavale ilmub.

Miks on lehe kiirus oluline?

Kodulehe laadimise kiirus on ühelt poolt oluline parema kasutajakogemuse loomiseks, et külastajatel oleks lehti mugavam lehitseda ja sisu laadimist ei peaks ülemäära kaua ootama. Teisalt on küsimus ka ressursitarbes, sest näiteks Google on selgelt kehtestanud reegli, et optimeerimata lehed jäävad ka otsingutulemustes tahapoole kui korralikult viimistletud ja tehnilistele nõuetele paremini vastavad veebid. Kiiruse kohta saad lugeda detailsemat infot artiklist "Kaks peamist põhjust, miks kodulehe kiirus on turunduseks ülioluline".

Millised elemendid probleeme tekitavad

Eelneva info põhjal nägime, et Drupal ja FastLion erinevad juba ülesehituslikult, Drupal saab Google PageSpeed Insight kriteeriumide järgi väga kehva skoori ja on üldise laadimise poolest väga aeglane. Siiani pole aga päris täit ülevaadet, milliste elementide tõttu Drupal nii aeglane on ja teisalt FastLion sedavõrd eeskujulikult toimib.

Appi tuleb teine automaatne analüüsitööriist, Varvy Pagespeed Optimization mida saab kasutada aadressil varvy.com/pagespeed/

Hulgaliselt CSS ja Javaskripti faile

Sisestades varem kasutatud Drupalis genereeritava Ehitustoodete lehe www.saint-gobain.ee alamlehe "Saint Gobain pälvis sertifitseeringu" Varvy Pagespeed analüsaatorisse, näeme tulemuseks üsna huvitavat pilti.

Lehekülg kasutab 21 javaskripti faili ja koguni 31 css stiilifaili (CSS - Cascading Style Sheets). Miinuspoolelt paistab veel aeglane server, probleemid puhverdusega ja renderdust blokeerivad stiililehed, mille kood on minimeerimata.

Vaatame edasi, mis on nende skriptide ja stiililehtede maht.

Tuleb välja, et kõik need "igaks juhuks" lisatud skriptid ja stiililehed moodustavad üheskoos päris arvestatava, sadades kilobaitides mõõdetava mahu, mille laadimise järel ootamine võtab mõistagi kasutajatel igakordselt sekundeid aega. 

Piiludes brauseris klaviatuuri kiirklahvidega "Ctrl + U" lehe www.saint-gobain.ee koodi, siis paistab tõepoolest üle mõistuse pikk, üle 30 viidet sisaldav nimekiri stiililehtedest, mis muudavad lehe aeglaseks ja kohmakaks.

FastLion on optimeeritum platvorm

Varasema PageSpeed tulemuse najal võis arvata, et FastLion näide saab ka Varvy Pagespeed Optimization tööriistas mõistliku tulemuse. Ootuspäraselt läbis FastLion kõik kriteeriumid ja on ka Varvy analüüsi tulemusena kõrge kvaliteediga.

Kokkuvõte näitas, et kõikides kategooriates oli leht optimeeritud ja ühtegi üleliigset skripti või stiilifaili, mis oleks lehe laadimist takistanud, selles ei ole.

Veebistandardid W3C järgi

Üheks võimaluseks veebiplatvormi kvaliteeti hinnata on kontrollida selle vastavust W3C konsortsiumi poolt kehtestatud standarditele, mis on sisuliselt aluseks brauserite poolt veebilehtede renderdusele ja sellele, kuidas erinevad brauserid veebilehti interpreteerivad.

Kõige käepärasem on kasutada validator.w3.org automaatööriista, mis kontrollib üle, kas lehel on vigu. FastLion saab W3C kriteeriumide jälgimise poolest taas jällegi hea tulemuse - ühtegi viga ei paista.

Drupal taas punase laterna rollis

Ehituskeskuse Drupalil jooksval lehel on seevastu validaatoris vaadates üle kümnekonna tõsisema vea (ingl. error) ja lisaks veel nimekiri tähelepanu nõudvatest hoiatustest (ingl. warning), mille poolest leht standarditele ei vasta ja mis võivad osadel juhtudel kuvavigu tekitada.

Drupal versus FastLion

Käepäraste testkeskkondade automaattestide najal tuleb välja, et Drupalil jooksev kodulehekülg on oluliselt aeglasem, sest selle modulaarne ülesehitus on kõike muud kui allikressursse säästlikult optimeeriv. Tulemuseks on halvem kasutajakogemus, sest leht on aeglasem.

Google poolt PageSpeed Insight nõuetele vastavuse osas jääb Drupal samuti selgelt võrdluses alla. Eriti halb on Drupali platvorm mobiilsete seadete kaudu vaadates, sest selle ülemääraselt arvukad skriptid ja stiililehed laadivad terve igaviku. Käesolev analüüs ei sisaldanud otseselt otsingunähtavuse osa, kuid kuna PageSpeed skoor on sedavõrd halb, siis võib eeldada, et väga häid tulemuse ei tasu indekseeringutulemustes oodata.

FastLion on kiirem ja vastab paremini standarditele

Testide tulemusena nägime, et FastLion on oluliselt kiirem, saab PageSpeed skooris maksimaalsed võimalikud 100 punkti ja jälgib ka hästi W3C konsortsiumi poolt kehtestatud veebistandardeid.

Kvaliteetsem leht toob parema tulemuse

Käesolevas artiklis kirjeldatud Drupali struktuursed vead ei ole omased mitte ainult sellele konkreetsele sisuhaldussüsteemile, vaid üsna sarnaseid probleeme tuleb ette ka sarnaste krooniliste hädade käes vaevlevate WordPressi ja Joomlaga. Vaatasime põhimõttelisi erinevusi detailsemalt artiklis "Punnvõrrist kaubikuni - sisuhaldussüsteemide võrdlus".

FastLion ei ole parem mitte ainult Drupalist. Meie kogemusel edestab "Kiire Lõvi" tehniliste näitajate poolest päris kõvasti ka WordPressi platvormi. Artiklis "Kas kodulehekülge saaks 10 korda kiiremaks teha?" tõime näiteks ühe juhtumianalüüsi, kus vanaldase päevinäinud WordPressi asemel tänapäevasema ja märksa optimeerituma FastLioni kasutuselevõtmine andis mõõdetavate kriteeriumide järgi tulemuseks kümme korda kiiremate kuvaaegadega lehe.

Parem otsingunähtavus ja rohkem külastajaid

Kiirus ja kvaliteet ei ole asjad iseenesest. Pärast artiklis kirjeldatud Wordpressilt FastLionile üleminekut mõõtsime paari kuu pärast ära vaadatavuse statistika ja sellest koorus välja, et leht oli tänu märgatavalt paranenud platvormi kiirusele ja kvaliteedile saavutanud varasemaga võrreldes kaks korda kõrgema külastatavuse.

Seega, kiiremad ja kvaliteetsemad platvormid meeldivad tõepoolest nii lehe vaatajatele kui saavad paremad positsioonid ka otsingumootorite tulemustes. Tänu paremale leitavusele tuleb lehele mõistagi ka rohkem külastajaid.