Dunder Krisztián 2012. augusztus 01.

Mobile first

Responsive web design, mobilverzió vagy applikáció? Kolozsi István webergonómus, UX-errel beszélgettünk.

Ember legyen a talpán, aki a digitális tartalom megjelenítése terén a sokasodó platformok és eszközök sűrűjében képes ma megmondani, melyek fognak erősödni és elhalálozni a következő két-három évben. Kellemetlen, ha a hosszú évek óta épített online márka egyes eszközökön élvezhető, másokon viszont olvashatatlan. Válaszért kiált a kérdés: mely eszközökre fókuszáljon a márka(menedzser), hogyan oldja ezt meg fejlesztési szempontból, és vajon a legolcsóbb megoldás lesz-e a legjobb? Addig nyújtózkodj, amíg a responsive web designod ér, tartja Kolozsi István webergonómus, UX-er legújabb mondása.
Kolozsi István

(Az interjú első alkalommal a május-júniusi Médiapiacban jelent meg.)

Mindenkinek mobilra kell-e mennie?

Ez nem kérdés. A mobil kötelező, egyértelműen a jövőt jelenti, ma már minden oldal esetében meghaladja a 2 százalékot a mobilról történő böngészés aránya. A mobilfejlesztést nem szabad külön befektetésként kezelni, amely rövid vagy középtávon biztosan megtérül, inkább a portfólió bővítéseként kell rá tekinteni. Aki most nem lép be erre a területre, később veszíteni fog, és mikor rádöbben erre a tényre, nagyon bánni fogja.

 

Melyik irány – mobilverzió a webes oldalból, responsive web design (RWD), mobilalkalmazás – milyen területen fontos?

A felhasználók nagyobb hányada linkeken – közösségi média, hírlevél, kereső stb. – keresztül érkezik az oldalra mobileszköze segítségével, ezért a mobilra optimalizált weboldal kötelező. Az applikációk fejlesztése nagyon költséges, éppen ezért meg kell gondolni, milyen céllal készülnek. Alapvetően a már meglévő és a márkához kötődő felhasználók számára érdemes fejleszteni – hacsaknem egy különleges startupról beszélünk – olyan alkalmazást, amely kihasználja a mobileszköz funkcióit, és további lehetőségeket nyújt.

 

Melyik technológia mennyire segíti a keresőből érkező forgalom megtartását vagy növelését? Mi a teendő, ha a tartalomnak van normál webes és egy nagyon hasonló, mobilwebes verziója is?

Sokan úgy gondolják, hogy a responsive web design a megoldás a mobilos tartalmak keresőoptimalizálására (SEO). Jelenleg viták folynak a témában, és nincs egyértelmű álláspont. A Microsoft Bing keresője egyetlen URL használatát javasolja (azaz ne legyen külön m.domain.hu), míg a Google tavaly decemberben jelentette be, hogy külön botokkal indexeli a feature- és az okostelefonokra optimalizált tartalmakat. Az egyetlen webcím alkalmazása (például responsive web design esetében) kimondottan előnyös SEO-szempontból, nem "osztódnak szét" ugyanis a linkek, nem kell új URL-ekkel foglalkozni, és a linképítés is könnyebb.

Ellenben a mobilos keresési, böngészési szokások eltérőek a desktopoknál érvényesülőknél, ezért érdekes lehet külön kulcsszavakkal, tartalommal próbálkozni. A Google bevezette az úgynevezett Skip Redirect/Old Possum megoldást, amely arra szolgál, hogy ha átirányítás történik mobil eszköz észlelése esetén, akkor a mobilos indexbe a mobil URL-je mentődik el, így mobil eszközről keresve már a mobilos URL-t jeleníti meg a találati listában, kiküszöbölve az átirányítást. Ha külön mobilos tartalmunk és oldalunk van, akkor érdemes belső URL-struktúrát használni (például index.hu/mobil) és nem külön subdomaint (m.index.hu).

 

Milyenek az eddigi tapasztalatok a responsive designnal kapcsolatban? Mennyi esélyt látsz az elterjedésére, és mely termékeknél?

Egyelőre nehéz a megvalósítása, főként a régebbi Internet Explorerek miatt. Minden modern böngészőben megoldható, az Internet Explorer esetében annak 7-es verziójától lehetséges, de csak nagy szenvedések és trükközések árán. Igazából ott érdemes foglalkozni vele, ahol minimum IE8 a követelmény.

RWD esetén fontos, hogy új szemlélettel kell a tartalomhoz – és így a tervezéshez – közelíteni, ami a tapasztalatom szerint nagyon nehezen átvihető az ügyfeleknél. Ennek a legfőbb oka, hogy a lehető legjobban lecsupaszított tartalomra kell őket „rávenni” (mobile first tervezési paradigma).

Ha viszont az IE7–8 eltűnik a piacról, és már az IE9–10 lesz az uralkodó, pillanatok alatt el fog terjedni. Ezt nagyjából egy-másfél évre teszem Magyarországon. Ez alatt az idő alatt a mobilos böngészés is hatalmasat fog előrelépni. A meglévő oldalak már elavultak lesznek, és újra kell őket tervezni, fejleszteni. Ha az újratervezés lépcsőjéhez jut majd az ügyfél, érdemes lesz ezt az utat választania.

Az RWD véleményem szerint nem alkalmas mindenféle oldalhoz. Főként online újságok, blogok, brand site-ok, eseményoldalak (például konferencia) fejlesztésekor célszerű élni vele, persze ezeknél sem minden esetben. E-kereskedelmi oldalak esetében a használata nem célszerű, mert a mobilon való megjelenítés jelentősen eltér a desktopváltozattól, illetve a gyors letöltés is különösen fontos a minél nagyobb konverzió elérése érdekében. E-commerce site-ok esetén tehát a szeparált megoldást javaslom. Az RWD nagyon hasznos és költséghatékony technológia, de ha a felhasználói élményt tekintjük, akkor nyilvánvalóan a külön platformokra tervezett és fejlesztett oldalak a megfelelőek, igazából a költségvetés és a felhasználóink szokásai döntik el, melyik úton kell haladni.

Mely irányokat érdemes egy, a magyarhoz hasonló kis piacon feszegetni?

A meglévő oldalaknál egyértelműen a szeparált mobilweb a nyerő, viszont ha éppen a teljes megújulás a cél, vagy új projekt indul, akkor érdemes elgondolkodni a responsive web design technológia alkalmazásán.

 

Látsz egyértelműen győztes irányt a következő éveket tekintve? Azaz az m.domain.hu, a responsive design vagy az applikáció bejöhet-e egyértelmű befutóként bármelyik kategóriában?

Nem. Abban viszont biztos vagyok, hogy az appok kora le fog járni, az alkalmazások meg fognak maradni a közösségi médiának és a játékoknak. A HTML5 terjedésével és az eszközök hihetetlen sebességnövekedésével a HTML5-appok és a mobilra optimalizált web kora következik majd. Az alkalmazások több operációs rendszerre – most már három szereplőről beszélünk (iOS, Android, Windows Phone7-8), de számuk még lesz több is – való fejlesztése nehéz és költséges, és frissíthetőségük, javíthatóságuk miatt ez az út hosszú távon nem lesz járható.

---------------------------

Mi a különbség?

Responsive web design (RWD) alkalmazása esetén a böngészőben megnyitott oldalak a képernyő méretéhez illeszkednek, így a weboldal "elrendezése" más és más lesz laptopon, okostelefonon és táblagépen nézve. A különböző megjelenítéshez persze olyan szerkezetű oldal szükséges, amely alkalmas arra, hogy a képernyőmérettől függően átrendeződjön. Jó példa erre a www.sony.com: nyissuk meg az oldalt számítógépünkön, és a teljes képernyő méretű böngészőablakot húzzuk össze felére, harmadára – látható lesz, ahogy átstrukturálódik az oldal menet közben.

Mobilwebes verzió alkalmazása esetén (például m.index.hu) a weboldalból készül egy mobilos változat, amely az eredeti oldal sokkal egyszerűbb, kis képernyőhöz kialakított variánsa. Ezáltal könnyebben olvasható, ugyanakkor külön fejlesztést igényel, így ha az eredeti weboldal módosul, a mobilváltozat átalakítása is külön feladatot igényelhet.

A mobilalkalmazás általában a legköltségesebb megoldás, hiszen minél általánosabb márkáról van szó, annál több operációs rendszerre kell fejlesztenie, hogy a lehető legnagyobb közönséget érhesse el. Az is fontos szempont, hogy applikációt akkor érdemes fejleszteni, ha az az okostelefon lehetőségeit valóban kihasználja. Ilyen például a helymeghatározás alapján kiszolgált tartalom, a mobil képernyőjén keresztüli értesítés (push notification) vagy a mobil eszköz kamerájának használata.

 

Jó példák responsive web designra



Teltházzal debütált az első hazai Influencer Festival

6 órája

Tartalomgyártás, platformok közötti átjárás, közösségi média menedzsment, be- és kikövetés, social kampánytervezés, influencer portfólióépítés – ezek voltak a hívószavak az első hazai Influencer Festival előadásain.

Kezdő youtuberek számára hirdet pályázatot a BugTV

13 órája

A BugTV, a Klikkmánia cégcsoport YouTube marketinggel és csatorna menedzsmenttel foglalkozó üzletága „I. BugTV – Youtuber akarok lenni!″ címmel pályázatot hirdet a jövő videós tehetségei számára.