Vy sa pýtate prečo??? Tak to si snáď robíte iba srandu. Poobzerajte sa okolo seba. Vy to nevidíte? Museli by ste po svete chodiť so zatvorenými očami, aby ste si nevšimli, že celý svet ovládli mobilné zariadenia. V autobuse, na zastávke, v reštaurácií, na záchode – sú všade! Smartfóny, tablety, ipady všeho druhu a veľkostí. Prejsť sa po ulici bez toho, aby ste nestretli človeka, čo slajduje prstom po obrazovke je v dnešnej dobe mission impossible. Možno, že aj vy teraz čítate tento článok na nejakom z chytrých telefónov. Nepolemizujme teda nad tým prečo, ale ako mať web optimalizovaný na mobilné zariadenia.

Responzívny web nerovná sa mobilná aplikácia

Toto si, prosím vás, veľmi dobre zapamätajte! Je mi úplne jasné, že bežný smrteľník nerozlišuje tieto dva pojmy. Proste len chce web tak ,,aby sa to dalo aj na mobile normálne pozerať, veď viete, no tú, ako sa to volá, mobilnú aplikáciu”. Hej, hej, my vieme. Mobilnú aplikáciu vám zrobíme, nie je problém, ale verte nám, nechcete ju. Lepšie povedané, nepotrebujete ju. Vo väčšine prípadov si vystačíte s responzívnym webdizajnom.

Čo to znamená mať responzívny web?

Pre nás v stupo.sk to znamená mať normálny web, nakódení podľa bežných mravov roku 2015 :) Nič extra, proste štandard. Je to pre nás taká automatika, že namiesto slovného spojenia ,,responzívny webdizajn” hovoríme len ,,webdizajn”. Sem tam sa aj pousmejeme nad tým, keď si niektorá webová agentúra vycapí na homepage ako hlavnú vetu ,,tvoríme responzívne weby”. A aké iné weby by ste chceli na konci roku 2015 tvoriť? Nejdem si zarábať na zlú karmu, takže žiadne kydanie na konkurenciu :) Takže naspäť k tomu, čo to ten responzívny web je.

Responzívny web je spôsob programovania webstránky. Nejdem vám tu presne vymenovávať tagy a query, ktoré sa používajú, lebo to je pre vás užitočné asi ako voda v koši. Ale v skratke ide o to, že v kóde sa nastaví, že sa niečo schová, niečo doplní, niečo presunie, niečo zmení veľkosť, v závislosti od toho, na akom zariadení si web prezeráte. Jeden kód je na všetko. Responzívnej stránke je úplne jedno, či ste na nej na mobile, tablete alebo desktopovej krave s uhlopriečkou 1920x1080px. Vyzerá dobre na každom zariadení. Presne vie, s akou veľkou obrazovkou prichádzate a pekne sa prispôsobí jej rozmerom, aby ste sa bez problémov dostali k celému obsahu webu a ešte sa aj cítili dobre. Taký najjednoduchší príklad, s ktorým sa najčastejšie stretávate na weboch je napríklad mobilné menu, vo webdizajnérskej komunite známe ako hamburger (pre svoj tvar). Na smartfónoch klasické menu už nevidíte. Vidíte iba ikonku hamburgera. Pritom to klasické menu v kóde stále je aj na mobile, ale je nastavené, aby sa od určitej veľkosti obrazovky zneviditeľnilo a objavilo sa naopak to hamburgerové. Na takomto a podobných princípoch funguje (responzívny) webdizajn.  Programátor kódi raz, ale za to poriadne. Zabíja 300 múch jednou ranou, čiže jeho práca je efektívna ako hovado. Samozrejme, nie vždy sa stránka zobrazí na 100% krásne na každom zariadení. V dobe, keď sa dostanete na internet už aj pomaly cez chladničku je pochopiteľné, že sa niekedy chybička vlúdi :) Rozdielne sa zobrazuje stránka cez tablet Prestigio, rozdielne na iPad-e. Ale skúšaním a testovaním to postupne vychytáte. Teda váš webdizajnér 😉

 

Na čo sú teda dobré mobilné aplikácie?

Na strašne veľa super vecí. Od hier, cez bankingové appky, po aplikácie na nájdenie najlepšej reštaurácie v okolí. Áno, presne tak. Sú to tie appky, ktorými tak radi zahlcujete svoj mobil. Mobilné aplikácie sú špeciálne softvéry na smartfóny. Každá z nich je vytváraná na konkrétny a presný účel. Väčšinou sú aj celkom užitočné, majú vám pomôcť alebo vás zabaviť a podobne. Je ich strašne veľa, stačí si len kliknúť na App Store alebo Google Play a uvidíte sami. Dôvod, prečo ich tu spomínam je jednoduchý. Veľa ľudí, aj spomedzi našich zákazníkov, sú tak popletení z toho, čo to znamená mať mobile-friendly web, že automaticky prichádzajú s požiadavkou na vytvorenie mobilnej aplikácie. Lebo nevedia, čo to je. V takýchto prípadoch ich samozrejme nevysmejeme (veď aj podľa mňa je prevodovka ako rozvodovka :) ), ale vysvetlíme, zdôvodníme, usmerníme. A väčšinou sa žiadna mobilná appka nekoná.

Prečo? Lebo ju vlastne vôbec nepotrebujú. A ešte aj preto, že je to drahé :) Asi najväčšia blbosť, ktorú som sa dočítala v jednom článku o mobilných apkách bolo, že sa dajú vytvoriť lacno a rýchlo. Hmm…tak neviem teraz, či my sme takí neschopní, alebo dotyčný autor taký šikovný. Podľa množstva mobilných aplikácií, ktoré existujú a vznikajú každý deň, by sa možno aj zdalo, že je to easy. Ale pravdou je, že už sa nehovorí o tom, koľko ľudí stojí za týmito apkami a hlavne, koľko peňazí sa investovalo do ich vývoja. A koľko času trvá, kým začnú zarábať. Ale ak máte v hlave nápad na appku, ktorá vyrieši problém davom ľudí a nájdete si mecenáša, ozvite sa nám. Nejako sa už dohodneme 😉

A ešte sú tu aj oddelené mobilné stránky

Skoro by som zabudla. Dinosaury medzi mobile-friendly webmi. Samostatné, oddelené mobilné weby, ktoré sú programované vyslovene iba na mobilné zariadenia. Majú svoj vlastný kód, vlastnú URL, takže duplicita ako sviňa. Google vás bude ,,ľúbiť” :) Spoznáte ich tak, že hore v prehliadači uvidíte názov domény v tvare napríklad m.názovwebu.sk, názovwebu.mobi.sk, názovwebu.sk/m a pod. Takéto mobilné weby frčali ešte za čias WAPu. Odvtedy sa samozrejme skultúrnili, už to nie je taká bieda ako kedysi. Proste ide o to, že sa naprogramuje osobitná stránka, ktorá je čo najjednoduchšia, len s tým najnevyhnutejším obsahom.

Kedy je dobré mať oddelenú mobilnú stránku? Ak responzívny dizajn nestačí. Niekedy sa stáva, že máte taký komplikovaný obsah alebo takú špecifickú funkcionalitu na webe, že je ťažké to všetko upratať cez responzivitu. Aj napriek tomu, že sa budete snažiť najviac, čo to dá, nebude to vyzerať dobre. Užívateľ nebude mať dobrý zážitok z návštevy stránky, odíde a fajka zhasla. Vtedy je najlepšie zdvihnúť telefón a volať programátorovi. Samostatnej mobilnej verzii stránky sa nevyhnete.

Ako vyzerá mobile-friendly webstránka?

Uvediem 10 základných zásad, ktoré ak dodržíte, budete taký kamarát s mobilom, že až.

  1. Všetky ozdôbky, zbytočnosti a nepotrebné hovadinky skryte. Nechajte naozaj iba to, čo je dôležité a o čo na stránke ide. Na verzii pre desktopy si majte trebárs aj skákajúceho slona, ak sa vám to zdá vhodné, ale na mobile to fakt netreba. Zbytočne rozptýlite užívateľa a odpútate ho od akcie, ktorá je podstatná. To nechcete.
  2. Najdôležitejšie informácie (kontakt, meno, adresa, výhody…) sú na vrchu stránky.
  3. Keď užívateľ klikne na telefónne číslo, automaticky začne volať.
  4. Scrolluje sa vertikálne.
  5. Call-to-action prvky (buttony, linky, menu…) sú dostatočne veľké a sú prispôsobené na ťukanie prstom. (call-to-action prvky sú motivátka, ktoré nabádajú návštevníka k vykonaniu želanej akcie – nákup, stiahnutie, registrovanie, komentovanie…)
  6. Formuláre sú najkratšie, ako sa dá. Žiadne zbytočné vypisovačky, aké priezvisko mala vaša babka za mladi a pod.
  7. Je použitý správny kontrast medzi textom a pozadím, aby bol web čitateľný. A samozrejme veľké písmená, používanie nadpisov, odsekov, veď to poznáte.
  8. Web nie je ,,prepchatý”. Medzi jednotlivými prvkami je dostatok miesta. Obrázky sú kvalitné a veľké.
  9. Použité je rozbaľovacie alebo vysúvacie menu.
  10. Nič na webe nebliká, nehýbe sa, neslajduje bez zásahu ľudského prsta.

Prečo optimalizovať web na mobilné zariadenia?

Tak si to teda zopakujme. LEBO TO CHCÚ VAŠI ZÁKAZNÍCI! Ľudia už nesedia za počítačmi, ako kedysi. Doba desktopov je nenávratne preč. Ľudia sú stále v pohybe a chodia na web cez smartfóny a podobné odnoše. Takže ak chcete mať z webstránky aj nejaký úžitok a nielen ju vystavovať ako trofej, optimalizovať na mobily je priorita číslo jeden.

Nielen, že to chcú zákazníci, ale ešte aj ten Google sa do toho zamontoval. Ten vyhlásil, že vo výsledkoch vyhľadávania bude preferovať stránky optimalizované na mobilné zariadenia. Ak sa chcete zobrazovať na popredných priečkach, musíte byť mobile-friendly. Z pohľadu Google algoritmu a pravidiel SEO je lepšie použiť responzívny dizajn a mať jednu stránku na všetky zariadania, než osobitnú mobilnú stránku. Google nemá rád duplicity. Jeden obsah, jedny URLky a hotovo. A navyše, responzívny web ho viac poteší aj preto, lebo je jednoduchší na zdieľanie obsahu. Predstavte si, že cez smartfón si pozeráte nejaký web, ktorý je naprogramovaný na osobitnej mobilnej stránke, dačo vás na ňom zaujme a chcete to poslať svojmu kamarátovi na facebook. Ibaže ten si to otvorí v práci na riadnej uhlopriečke a bude mať z toho akurát tak figu borovú. Toto Google vie, Google je pán :)

Ako to teda vyriešiť najlepšie?

U nás vyhráva zatiaľ responzívny webdizajn. Vo väčšine prípadov to vychádza v konečnom dôsledku najlacnejšie a najrýchlejšie. Aj v jednom prieskume (síce americkom, ale na konzervatívnom Slovensku by to číslo bolo ešte vyššie:) ) dokázali, že 67% mobilných užívateľov by radšej nakúpili cez responzívnu stránku než cez mobilnú appku. No a taká posledná výhoda responzívneho dizajnu, ktorú ocenia najmä marketéri, je že nemusíte vytvárať 2 oddelené reklamné kampane pre každú stránku osobitne. Máte iba jednu stránku, takže stačí len jedna kampaň a tá sa manažuje o niečo ľahšie ako dve naraz.

Ak sa stále neviete rozhodnúť, ktorá varianta je tá pravá, ozvite sa nám alebo kuknite do Google Analytics a odsledujte si správanie mobilných užívateľov. V testovaní a vylepšovaní nemôžete poľaviť, ani čo sa týka mobilného webu.

Zaujal vás článok a chcete byť informovaný o ďalších e-shop fičurách? Prihláste sa na odber noviniek.

Tipy a triky ako na e-shop ZADARMO!


Romča je osoba prvého kontaktu v stupo.sk. Všetky požiadavky na vytvorenie, zmenu či vylepšenie webu smerujte na ňu. Vyštudovala odbor Elektronický obchod a manažment a svet e-business je jej viac než blízky.

romana@stupo.sk

One Comment

  1. […] To, že weby optimalizované na mobilné zariadenia všetkých možných druhov a veľkostí budú mať vo výsledkoch vyhľadávania prednosť pred tými, ktoré na to kašlú, už vieme dávno. Neúprosný Google algoritmus ,,Mobilegeddon” frčí už od apríla minulého roka. Ale teraz je to naozaj vážne! Google pritvrdzuje. Zlé jazyky dokonca tvrdia, že za pár rokov optimalizáciu pre desktopy vôbec nebude brať do úvahy. Či to tak bude alebo nie, ťažko odhadnúť. Ale načo zbytočne riskovať, keď vytvoriť mobile-friendly web nie je tak ťažké? Ako pomôcku pripíjam návod, ako optimalizovať stránku na mobilné zariadenia. […]

    Odpovedať

Leave a reply

Vaša e-mailová adresa nebude zverejnená. Vyžadované polia sú označené *