iPhone disponuje rôznymi funkciami ako napríklad fotoaparát, telefón, iPod a e-mailové funkcie a samozrejme podporuje mobilnú internetovú platformu, na ktorej môžu užívatelia zobraziť vašu webovú stránku alebo používať webové aplikácie. Podľa toho, ako je užívateľom umožnený prístup webového obsahu pomocou iPhone pripojenia k sieti, schopnosti prehliadača a zobrazenia displeja, má to významný vplyv na správanie vášho webového obsahu a jeho vnímanie užívateľom. V nasledujúcich častiach sú stručne opísané tieto časti iPhone webovej infraštruktúry s dôrazom na to, ako každá časť ovplyvňuje dizajn vášho webového obsahu.

Pripojenie do siete

iPhone je možné pripojiť do internetu pomocou Wi-Fi siete alebo celulárnej siete (u vašeho poskytovateľa dátových služieb). V situácii, keď začnete využívať internetové pripojenie, iPhone automaticky prepne na služby, ktoré umožnia čo najrýchlejšie pripojenie v danej situácii. Nemôžete predpovedať, akú rýchlosť pripojenia majú užívatelia v danom okamihu, takže obsah by mal byť navrhnutý pre prácu aj pri akejkoľvek rýchlosti pripojenia.

Safari na iPhone

Safari na iPhone poskytuje rozhranie na prehliadanie obsahu webu prostredníctvom iPhonu. Hoci Safari na iPhone je podobné v mnohých smeroch k Safari na počítači, ale nie je to to isté. Musíte pracovať s funkciami Safari na iPhone a poskytnúť riešenie, ktoré by vychádzalo z toho, že niektoré funkcie Safari na počítači nie sú k dispozícii na Safari na iPhone.

Väčšina funkcií Safari na iPhone ovplyvňuje zobrazovanie webového obsahu, ale niektoré majú vplyv na návrh používateľského rozhrania. Nasledujúci zoznam popisuje tieto funkcie. Mali by ste ich mať na pamäti pri navrhovaní užívateľského rozhrania vášho webového obsahu.

• Safari na iPhone podporuje cookies – To znamená, že môžete použiť súbory cookie na uloženie informácii súvisiacich s užívateľom, nastavenia a skôr zadané údaje, ktoré môžu zefektívniť interakciu používateľa s obsahom tým, že minimalizuje množstvo informácií.
• Safari na iPhone nepodporuje Flash alebo Java (vrátane Java appletov) – Užívateľské rozhranie vášho webového obsahu by nemalo spoliehať na Flash animácie pre komunikáciu s používateľmi.
• Safari na iPhone interpretuje väčšinu užívateľov pomocou pohybov prstov

Zobrazovacie iPhone

Pre Safari na iPhone je zobrazovaná plocha obdĺžniková oblasť, ktorá určuje, ako je rozmiestnený obsah a kde text obteká na webovej stránke. Na počítači, je pohľad definovaný podľa veľkosti okna prehliadača. Čím je väčšie toto okno, tým je viac vidieť z webovej stránky. Safari na iPhone, ale nemôže meniť veľkosť okna. Rozdielne zobrazenie obsahu webovej stránky je vidieť na nasledujúcich obrázkoch.

Obr.1 Safari na iPhone

Obr.2 Safari na počítači

Pri návrhu užívateľského rozhrania je dôležité si uvedomiť, že iPhone užívatelia môžu meniť mierku pohľadu na priblíženie a oddialenie, ale nie veľkosť. Jedinou výnimkou je to, že ak sa zmení orientácia iPhonu na výšku alebo na šírku, veľkosť zobrazovacej plochy sa mení. Keď používatelia iPhone súčasne prezerajú viac stránok, vizuálna indikácia ukazuje, koľko je zobrazovaných webových stránok. Na ovládanie Safari na iPhone sa využíva interaktívny užívateľský model. Užívatelia používajú svoje prsty na ovládanie užívateľského rozhrania, klikanie, otáčanie, posúvanie, približovanie, odďaľovanie, navigáciu a čítanie webového obsahu.

Obsah iPhone aplikácií: Je to webová stránka alebo aplikácia?

Ak chcete pripraviť svoj webový obsah na úspešné zobrazenie na iPhone, musíte si položiť otázku. Mate záujem o úpravu vašej web stránky aby vyzerala čo najlepšie na zariadení iPhone alebo vytvoríte iPhone web aplikáciu? Pred tým ako sa rozhodnete, musíte pochopiť aké sú rozdiely medzi webovými stránkami a web aplikáciami pre iPhone. Tento článok sa venuje trom typom ako pristupovať k obsahu web stránok a načrtne pár krokov ako ich vytvoriť.

Tipy obsahu

Kedy je web stránka web aplikáciu? To je najlepšia otázka, ak si užívateľ myslí, že v tom nie je rozdiel. Ale keď príde na návrh a vývoj, výber vhodných metód a techník, odpoveď nie je príliš dôležitá. Prehliadač Safari na iPhone poskytuje rozhranie pre všetky webové stránky. Nie je preto prekvapením, že spôsob, akým pracujú webové stránky v prehliadači Safari na iPhone je už definovaný.

Tento článok rozlišuje tri typy webových stránok. Prvý typ je W3C (World Wide Web Consortium)- definuje úrovne kompatibility a je na výrobcoch, aby sa ich držali. Fungujú tak ako sú navrhnuté, s výnimkou všetkých prvkov, ktoré sa spoliehajú na nepodporované technológie, najmä, plug-iny, Flash alebo Java. Webové stránky, ktoré sú kompatibilné s Safari na iPhone sa na ňom úspešne zobrazia. Ak niektoré súčasti chýbajú alebo chýbajú plug-iny, zobrazí sa ikona (obr. 3 ukazuje túto ikonu). Avšak užívateľské rozhranie webovej stránky, ktorá je kompatibilná s Safari na iPhone, nemusí nevyhnutne brať do úvahy iPhone užívateľský interaktívny model (ovládanie pomocou rôznych kombinácií prstov) a môže požadovať od užívatelia rozsiahle scrollovanie obrazovky.

Obr. 3 Zobrazenie chýbajúceho plug-inu

Druhý typ webových stránok predstavuje W3C compliant – webovú stránku, ktorá sa zobrazuje a funguje tak, ako bola navrhnutá, upravý pre iPhone rozlíšenie obrazovky a nemá žiadne prvky, ktoré sa spoliehajú na nepodporované technológie, najmä, plug-iny, Flash alebo Java. Často je tento typ webovej stránky určený na detekciu, kedy je daná stranka zobrazovaná na iPhone. Stránky, ktoré sú optimalizované pre prehliadače Safari pre iPhone, možno integrovať so vstavanými iPhone funkciami a službami, ako je napr. e-mail, kalendár a pod.

Okrem splnenia požiadaviek na webovú stránku, ktorá je optimalizovaná pre Safari na iPhone, tretí typ z webových stránok poskytuje diskrétne funkcie pre užívateľov a je často vykonávaný za použitia moderných webových technológií, ako je AJAX. IPhone webová aplikácia emuluje vstavané iPhone aplikácie tým, že poskytuje riešenie zamerané pre užívateľov, integráciu iPhone funkcií a služieb, kde je to vhodné a minimalizovať požiadavky na prehliadanie web stránok.

Aj keď na úrovni implementácie, všetky tri typy sú iPhone web stránky, čo je užitočné aby boli schopné preberať iPhone webové aplikácie, ako niečo iného čo je kompatibilné z danou web stránkou, ktorá je optimalizovaná pre Safari na iPhone. To preto, že užívatelia očakávajú od aplikácie, aby bola jednoducho ovládateľná, mala prehľadné užívateľské prostredie a zároveň zaujímavý dizajn. Tým sa odlišuje od návrhu pôvodnej web stránky, ktorý je predovšetkým založený na možnosti ovládania pomocou kurzora počítača.

Rozhodnite sa, do akých pozícií rozložiť obsah vašej web stránky

Ak ste nasledovali štandardný dizajn internetových stránok a implementáciu osvedčených postupov, ako rozvíjal obsah svojich webových stránok, je pravdepodobné, že váš obsah je najmenej kompatibilný so Safari na iPhone. Teraz je potrebné sa rozhodnúť, či chcete optimalizovať svoje webové stránky pre Safari na iPhone alebo vytvoriť iPhone web aplikáciu s obsahom danej web stránky. Aby som vám pomohol urobiť toto rozhodnutie, v tejto časti rozpracujem hlavné atribúty iPhone web aplikácie.

Užívateľ uprednostní aplikáciu, ktorá plní jednu úlohu dokonale nad aplikáciu, ktorá sa snaží plniť rad úloh, ale neexceluje v žiadnej z nich. Toto platí najmä pre iPhone webové aplikácie, pretože používatelia očakávajú, že to čo chcú, dosiahnu rýchlo a nechcú strácať čas premýšľaním, čo aplikácia robí, alebo sa brodiť zbytočnými funkciami.

Obr. 4 ukážky web aplikácií

Ak dokážete ľahko identifikovať hlavnú úlohu vašej webovej stránky, mali by ste uvažovať o podpore pre iPhone webovú aplikáciu, ktorá ponúka túto funkciu pre užívateľa. Napríklad, ak primárnym účelom vašej webovej stránky je súhrnné informácie na nejakú tému, môžete navrhnúť iPhone webovú aplikáciu, ktorá prezentuje tieto informácie spôsobom, ktorý je pre iPhone typický a užívateľ si ju môže pohodlne prezerať kdekoľvek na svojom telefóne.

Ak však vaša webová stránka zahŕňa kombináciu rôznych funkcií a typov informácií, máte dve možnosti:

• môžete ju optimalizovať pre iPhone
• môžete vytvoriť viac webových aplikácií pre iPhone, ktoré by zahŕňali iba jeden druh informácií svojho obsahu. Napríklad webová stránka, ktorá zobrazí aktuálny zoznam najpredávanejších románov, zobrazí správy o autoroch a knižné recenzie, knihy hostí a umožňuje užívateľom zoradiť knihy podľa témy, podľa autora a pod. Avšak, iPhone webová aplikácia, bude mať len funkciu, ktorá umožňuje užívateľom zoradiť knihy zo zoznamu aktuálnych najpredávanejších kníh. Ďalšia možnosť použitia tohto príkladu je webová aplikácia pre iPhone, ktorá umožňuje užívateľom sledovať osobný zoznam literatúry, pridávať nové knihy a pod.

Ak ste sa rozhodli navrhnúť iPhone webovú aplikáciu, stojí za to sa vrátiť k hlavným prvkom iPhone webových aplikácií.

• iPhone webové aplikácie minimalizujú náročnosť na prehliadanie obsahu web stránok. Hoci iPhone webová aplikácia je samozrejme webová aplikácia, ktorú je možné otvoriť priamo v prehliadači Safari na iPhone, ale je ju možné otvoriť aj v jej vlastnom užívateľskom rozhraní. Jeden spôsob, ako dosiahnuť tohto efektu je nastavenie vlastnosti pohľadu tak, že iPhone bude zobrazovať webové aplikácie správne v prehliadači Safari na iPhone a nevyžaduje žiadne zoomovanie alebo scrollovanie. Ďalším spôsobom je poskytnúť vlastné navigačné ovládacie prvky vložené do stránky, takže používatelia nemusia používať ovládacie prvky Safari na iPhone.
• iPhone webové aplikácie predstavujú osobitný štýl, rozloženie a správanie sa, ktoré je typické pre iPhone aplikácie. Používatelia sú zvyknutí na užívateľské prostredie, ktoré ponúkajú iPhone aplikácie, čo znamená, že
  uznávajú funkciu osobitnej kontroly a očakávajú ľahké ovládanie, priehľadné užívateľské rozhranie. Navyše, používatelia očakávajú aby posúvanie zobrazovanej časti vo horizontálom smere bolo čo najnižšie a použitie farieb čo najpútavejšie.
• v iPhone webových aplikáciách sú integrované vstavané funkcie a služby, ktoré ponúka len zariadenie iPhone. Užívatelia očakávajú, že pomocou svojej aplikácie, budú mať prístup k napr. kalendáru, Google maps, GPS modulu a pod.

Dizajn pre svojich užívateľov

Než začnete pracovať na vašej iPhone webovej aplikácii, musíte si uvedomiť, pre aký okruh užívateľov je určená. Môžete mať definované funkcie, ktoré chcete poskytnúť, ak nedokážete predpokladať, k akému smeru užívateľov smeruje vaša aplikácia, je veľmi ťažké zabezpečiť jej primeranú funkčnosť. Pochopenie užívateľov je dôležitou požiadavkou pre úspešné navrhovanie webových stránok, ale taktiež je to dôležité aj pre tvorbu úspešných webových aplikácií pre iPhone. Dôvodom je to aby iPhone web aplikácia priniesla zaujímavé riešenie danej témy.

Ako začnete navrhovať svoj produkt, teda stráviť nejaký čas nad definovaním cieľového okruhu užívateľov. Či sú skúsení alebo začínajúci v používaní web aplikácií, príležitostní alebo stáli, či hľadajú pomoc s konkrétnou úlohou alebo hľadajú zábavu? Znalosť daných skutočností umožňuje tvorcom prispôsobiť užívateľské prostredie a užívateľské rozhranie pre konkrétne potreby a želania užívateľov.

Pre návrh webovej stránky alebo aplikácie pre iPhone užívateľa, si musíme pripomenúť niektoré dôležité fakty.

• Chcú byť mobilní, kdekoľvek sa nachádzajú.
• Chcú mať rýchly a jednoduchý prístup k obsahu.
• Musí byť schopná dočasne prerušiť svoju činnosť pri prijímaní hovorov, e-mailových správ a pod.
• Očakávajú, že budú môcť uskutočniť telefónny hovor, otvoriť svoju e-mailovú správu prípadne si zobraziť Google mapy, zatiaľ čo ich aplikácia bude bežať na pozadí.

Ak ste v štádiu navrhovania webových stránok (na rozdiel od iPhone webových aplikácií), toto môže byť všetko, čo potrebujete vedieť v danom momente. Okrem toho, že vaše webové stránky nemusia byť úplne kompatibilné so Safari na iPhone, mali by ste sa sústrediť na vývoj mobilného rozhrania pre iPhone.

Ak ste v štádiu navrhovania webových aplikácií pre iPhone, je vhodné ísť ešte ďalej k spresneniu okruhu vašich užívateľov a opýtajte sa sami seba, za akých podmienok budú vyhľadávať služby vašej webovej aplikácie?. Sú to podnikatelia, tínedžeri alebo dôchodcovia? Budú používať aplikáciu na konci každého dňa, zakaždým, keď chcú skontrolovať ich e-mail alebo kedykoľvek, keď majú voľný čas? Čím dokážete presnejšie definovať okruh vašich užívateľov, tým skôr dokážete prispôsobiť vzhľad a funkcie užívateľského rozhrania vašej aplikácie.

Napríklad, ak vaša aplikácia má za úlohu sledovať odpracovaný čas zamestnancov a vyrátať ich mzdu, užívateľské rozhranie by sa malo zamerať na to, aby bolo jednoduché vstúpiť do pracovnej doby a sadzby mzdy, bez akýchkoľvek prídavných detailov, ktoré nie sú dôležité pre úlohu aplikácie. Okrem toho si môžete zvoliť jemné farebné palety, ktoré sa prejavia profesionálne a ponúknu príjemné prostredie na náhľad niekoľkokrát denne.

Alebo, ak vaša iPhone webová aplikácia ponúka zábavu pre cieľovú skupinu tínedžerov, môžete namiesto profesionálne vyzerajúceho používateľského rozhrania, použiť motív, ktorý prepožičiava pocit výnimočnosti a farebnú paletu podľa aktuálnej módy. Predstavte si napríklad, že premýšľate o vytvorení webovej aplikácie pre iPhone, ktorú ľudia môžu používať, keď pôjdu do obchodu s potravinami. Vo fáze plánovania, môžete zvážiť viacej možností, v čom by mohli vašu aplikáciu využiť. Ako napríklad:

• Získanie nutričných informácií o konkrétnych potravinách
• Nájdenie špeciálnych ponúk
• Vytváranie a používanie nákupných zoznamov
• Hľadanie obchodov
• Vyhľadávanie potravín podľa receptov
• Porovnávanie cien
• Aktualizácia cien

Ak si myslíte, že vaši užívatelia by využívali aplikáciu len preto aby si mali kde zapísať zoznam vecí, ktoré chcú nakúpiť, tak to ste na omyle. Síce je to jedna zo základných funkcií a určite je tu veľká skupina ľudí čo by ju využívala hlavne pre to, ale netreba zabúdať aj na to, že v súčasnej dobe by veľa ľudí uvítalo aj vyhľadávanie nákupných miest podľa zoznamu, prípadne prehľad v akciových ponukách, porovnávanie cien vo veľkoobchodoch.

Dalo by sa písať ešte o viacerých užitočných funkciách, ktoré by mohla vaša aplikácia ponúkať (môžu byť primárne funkcie iných aplikácií), ale nezapadajú do hlavného účelu vašej aplikácie a ich pridaním by ste z nej zbytočne urobili komplikovanú aplikáciu, ktorá by mala síce veľa funkcií, ale zároveň by bola komplikovanejšia na ovládanie a užívateľské rozhranie. V praxi má človek pri nákupe v jednej ruke košík, preto by mohol ovládať vašu aplikáciu maximálne len jednou rukou a mal by sa k informáciám dostať hneď a bez dlhých preklikávaní rôznych funkcií.

Záver

Cieľom článku bolo poukázať na základné funkcie a spôsob ovládania Safari prehliadača na iPhone, z ktorého vlastne vychádzajú webové aplikácie. Venovali sme sa spôsobu tvorby obsahu webovej stránky a webových aplikácií, prešli sme na optimalizáciu stránok pre mobilný prehliadač a popísali sme si rozdiely medzi klasickým zobrazením webovej stránky na prehliadači na iPhone a užívateľským rozhraním webovej aplikácie. Nakoniec sme popísali ako navrhnúť konkrétnu webovú aplikáciu tak aby vzbudzovala záujem u potenciálnych užívateľoch.

Použitá literatúra

1. Apple Inc., iPhone In house App Development Essential Videos, iPhone Web Applications from Start to Finish, [dňa 6.11.2010], Dostupné z <https://developer.apple.com/videos/iphone/>
2. Apple Inc., WWDC 2010 Session Videos, Getting Started with iPhone Web Applications, [dňa 6.11.2010], Dostupné z <https://developer.apple.com/videos/iphone/>
3. Apple Inc., iPhone Human Interface Guidelines for Web Applications,[dňa 6.11.2010], Dostupné z <http://developer.apple.com/library/safari/#documentation/InternetWeb/Conceptual/iPhoneWebAppHIG/Introduction/Introduction.html>