Nagu varem kirjutatud, hakkas Google alates novembrist katsetama otsinguindeksis mobiilisõbralike veebide eelistamist ja õige pea muutubki see paratamatuks, sest enamus kasutajaid kipuvad kodulehti juba vaatama pigem mobiilse seadmega kui laual või süles asuva arvutiga. Seega on kõige viimane aeg oma koduleht mobiilisõbralikuks teha. Kuidas see aga käib?
Esitame seitse olulist küsimust ja anname soovitused, mismoodi koduleht mobiilisõbralikuks teha.
1. Kust ma teada saan, kas koduleht on mobiilisõbralik?
Lihtsaim viis on uurida seda Google´i enda käest. Testlehel saab oma kodulehe vastavust kontrollida:
google.com/search-console/mobile-friendly
Sisesta oma kodulehe aadress ja tulemus on kohe teada. Samuti saab teada, mida peaks paremaks tegema.
2. Kui tellin kodulehe kujunduse, kas peaks tellima eraldi mobiilse ja "tavalise"?
Pigem ei peaks eraldi kujundust tellima (kuigi saab ka eraldi kujundusega), vaid küsima ühe, responsive disaini, mis tähendab, et selle paigutus kohandub vastavalt seadmele, milles veebi vaadatakse. Google´i mobiilse veebi abimehes on lihtne skeem, mis selgitab, kuidas sama sisu paikneb responsive disainiga lauaarvutist ja mobiilist vaadatuna:
Nagu näha, paigutatakse veerud ja oluline info mobiilikujunduses natuke teistmoodi. Ka menüüd on teistsugused, pildid aga kohanduvad seadme ekraani laiusega.
Responsive kujunduste valikuid on enamlevinud sisuhalduste jaoks valmiskujul olemas päris palju (nii Wordpressis kui Drupalis näiteks), neid valides ei pea eriti muretsema, kas koduleht näeb hea välja ka tahvlilt või mobiilist vaadates. Kui kujundus on korralikult tehtud, siis muudetaksegi paigutust vastavalt ekraanile.
Üks kõige rohkem levinud platvorme, millelt responsive veebilehti tehakse, on Bootstrap. See on ka kurja juur, miks enamus uusi veebilehti kogu maailmas nii ühesugused välja näevad. Aga paraku polegi väga palju mänguruumi, kui koduleht peab ühtviisi loetav olema nii laialt kui kitsalt ekraanilt, ikka kipub kujundus minema kastide paigutamiseks üldtuntud skeemide järgi.
3. Mis on mobiilis teistmoodi kui suurel ekraanil?
Mobiilis on ekraanipinda vähem ja hiire asemel kasutatakse puuteekraani sõrmega vajutades või viibates. Seega, kõik vajutatavad nupud ja lingid peavad olema piisavalt suured, et nendele suure sõrmeotsaga pihta saada.
Veebilehe menüüdes tuleb kasutada suuremaid nuppe, lingid ja tekst peavad olema suuremad ja loetavamad, kõrvuti veerud on liiga tülikad lugeda ning need tuleks pigem üldse ära kaotada. Pildid võivad teksti ääres paremale või vasakule joondudes jääda liiga pisikeseks, nende suurus ja paigutus tuleks teha teistmoodi, näiteks kogu tekstiveeru laiuselt.
4. Kas nuputelefonidele peab ka mõtlema? Oli ju kunagi WAP ja WML?
Detsembri keskel teatas Google oma blogis, et nad enam ei indekseeri WAP-lehti, mis olid mõeldud vähem nutikatele telefonidele, tavaliselt netiühendusega nuputelefonidele. Põhjuseks selle tehnoloogia vananemine ja kodulehtede vähesus, mis ikka veel WAP-i toetavad. Seega pole mingit põhjust pingutada kodulehe tekstilise versiooni pärast.
Küll aga maksab oma veebi sisu luues meeles pidada, et vajutatavatel nuppudel ja piltidel oleksid HTML-koodis alternatiivtekstid, sest aina rohkem inimesi kasutab veebi ka olukordades, kus mobiilne seade neile teksti ette loeb, näiteks autos. Siis loetakse piltide asemel ette nende alternatiivtekst, mis võiks ära öelda, mis on pildil.
5. Millist sisu peaks mobiilses veebis näitama ja millist mitte?
Kõige parem on mobiilis näidata sama palju sisu, kui laua- ja sülearvutitele mõeldud veebis. Kunagi ei tea, mida kasutaja kodulehelt tegelikult otsib ja kui see mobiili jaoks keelata, siis külastaja muidugi pettub.
Mobiilis jäetakse tavaliselt ära sisu kohal kuvatavad katvad veebireklaamid ja kui on Flashiga kuvatavat sisu, siis ka see osa peaks mobiilivaatest olema kadunud, kuna paljud mobiilid ei oska Flashi sisu näidata.
Kindlasti ei tohiks aga ära peita videoid ja pilte, mida mobiilist tahetakse samamoodi vaadata. Nende esitus tuleb muuta mobiilisõbralikumaks: pildid veerulaiuselt ja võimalikult suurelt, et oleks mugav suurendamata vaadata ning videod võiks mängima hakata üle ekraani, kui telefon külili keerata.
Ära blokeeri mobiilses vaates Javascripti, CSS-i elemente ja meediat: pilte, videosid, graafikaelemente.
6. Kui kiire peaks olema mobiilne veeb?
Vastus on lihtne: väga kiire. Mobiili vaadatakse ekstreemsemates oludes, kui mugavalt kontorilaua taga istudes. Veebileht peab alla laadima sekundiga, pikem aeg mõjub juba ebamugavalt. Eriti veel siis, kui kodulehe paigutus muudab kuju näiteks suurte piltide allalaadimisel: kasutaja on juba midagi vajutanud, aga sõrme alla kuvatakse mingi hoopis muu kodulehe element.
Kui kogu leht laeb mobiilibrauserisse alla sekundiga, siis jõuab kasutaja reageerida ja ära oodata kogu sisu lõpliku paiknemise brauseriaknas.
7. Kas kasutada mobiili ja tavaarvuti jaoks eraldi veebiaadresse?
Mõnikord satume me mobiiliga mitte tava-aadressile, mis algab klassikalise www-ga, vaid suunatakse spetsiaalselt mobiilile mõeldud veebiaadressile, näiteks m.facebook.com. Mida oma kodulehega teha, kas kasutada sama praktikat?
Tegelikult ei pea eraldi mobiiliaadresse tegema, kui kasutada responsive ehk kohanduvat veebikujundust, mis tunneb seadme ära ja serveerib vastavat kujundust samal veebiaadressil.
Kui aga on tahtmist siiski erinevatele seadmetele erinevat valmiskujundust pakkuda, näiteks tahvlitele teistsuguseid ikoone ja kujundust kui kitsastele mobiiliekraanidele, peab sellest teada andma ka otsimootoritele ja brauseritele. Siis määratakse kodulehe HTML-is kohe päises ära nö algne ehk kanooniline veebiaadress, kuhu pöörduda, kui mobiilse seadme aadressil kõik hästi ei toimi või kui kodulehele on hoopis sattunud mõni otsimootor seda indekseerima:
<link rel="canonical" href="http://www.minukoduleht.ee/node/1" />
Siin rel=”canonical” viitab sellele algsele veebilehekülje aadressile. Wordpressis aitab kanoonilise URL-i lisada HTML-i WordPress SEO plugin, Drupalis näiteks Metatag´i nimeline moodul.
