Dizajn web-lokacije za mobilne uređaje kompliciran je jer jedna mobilna verzija web-lokacije možda nije kompatibilna sa svim uređajima. Dizajneri moraju biti svjesni najboljih praksi dizajna kako bi vašu mobilnu prisutnost učinili značajnom i vrijednom truda.
Postoji stalna debata među web programerima o tome koji je način stvaranja web-mjesta optimiziranog za mobilne uređaje najbolji. Postoje tri vodeće metode za razvoj mobilne web-lokacije.
Ovi su:
- Odgovarajući web dizajn.
- Namjenske mobilne web-lokacije.
- RESS: Programiranje na strani poslužitelja donosi CSS i HTML, ovisno o vrsti uređaja.
Svaka metoda ima svoje prednosti i mane. Web developer mora biti svjestan svake tehnike za provedbu najbolje za situaciju.
3 načina za dizajn mobilne web stranice
Odgovarajući web dizajn (RWD)
RWD se oslanja na CSS3 medijske upite kako bi uskladio izgled web stranice s veličinom područja gledanja uređaja. Isti HTML kôd koristi se za prikazivanje različitih izgleda web-stranica za tablete, mobilne uređaje, stolna računala i druge gadgete.
Prednosti:
- Vaša web lokacija će imati sličan sadržaj i HTML oznaku, tako da će mobilni posjetitelji imati isto iskustvo, bez obzira na vrstu uređaja koji koriste.
- Jedan URL olakšava korisnicima povezivanje i dijeljenje sadržaja. (Ako je web-stranica dostupna pod više od jedne URL adrese, korisnici mogu postati zbunjeni.)
Nedostaci:
Nije moguće zasebno optimizirati mobilni sadržaj. Stoga dizajner koji koristi RWD ne može prilagoditi sadržaj zasebno za mobilne korisnike.
Prema podacima iz siječnja 2013. iz HTTP arhive, prosječna web stranica je oko 1,3 MB. Međutim, većina RWD mjesta je relativno veća. Ova veća veličina smanjuje izvedbu mobilnih web-lokacija, što ih čini sporijima.
Korisnici mobilnih uređaja više su prilagođeni uzorcima dizajna korisničkog sučelja specifičnim za mobilne uređaje. Štoviše, mobilni korisnici navikli su na višestruke zadatke. Osim ako je struktura navigacije prilagođena određenim uređajima, korisnici se mogu suočiti s problemima kada istovremeno pokušavaju ostvariti nekoliko zadataka.
Namjenske mobilne web-lokacije
Ova metoda poboljšava iskustvo mobilnih korisnika stvaranjem potpuno zasebne web-lokacije.
Prednosti:
- Jednostavnost upravljanja: Potrebne su zasebne promjene za mobilne i desktop stranice. Uvedene promjene ograničene su na svaku pojedinu verziju. To znači da se izmjenama namijenjenim mobilnoj platformi ne može pristupiti s radne površine.
- Dok razvijate web-lokaciju koja se odnosi na mobilne uređaje, postaje lakše pojednostavniti i optimizirati je posebno za tu publiku.
- Struktura sadržaja i navigacije može se prilagoditi mobilnim korisnicima.
Nedostaci:
Dijeljenje web-stranice putem društvenih medija postaje sve teže, jer s namjenskim mobilnim web-lokacijama postoji više URL-ova za stranice. Kada korisnici stolnih računala kliknu URL-ove za mobilne uređaje koji se dijele na platformama društvenih medija, oni mogu nehotice primiti mobilnu verziju web-lokacije, a ne verziju radne površine.
Kako bi se izbjegli problemi s dvostrukim sadržajem, Web developer mora koristiti meta tagove rel = ”alternative” i “rel =” canonical. Ako mobilni korisnik pretražuje Google i klikne na URL za radnu površinu, korisnik će vidjeti verziju radne površine ili će biti preusmjeren na mobilnu verziju web-stranice. Ako mobilna inačica ne postoji, korisnik će primiti poruku o pogrešci.
Stvaranje potpuno različite web-lokacije za mobilne korisnike znači da će web-lokacija biti prilagođena korisnicima mobilnih uređaja. Međutim, da bi ispunili tu svrhu, web programeri moraju izrezati funkcionalnost i sadržaj, što se za njih ispostavlja kao noćna mora.
Odgovarajući web dizajn+ Komponente na strani poslužitelja (RESS)
Ova metoda ovisi o programiranju na strani poslužitelja kako bi se omogućio prilagođeni HTML i CSS za različite uređaje. Kôd za korisnike mobilnih uređaja razlikovat će se od koda korisnika računala.
Glavni cilj ove implementacije je poboljšanje izvedbe web-lokacije. Ova metoda dobro radi kada se kombinira s prilagodljivim web dizajnom. Stoga se ova implementacija može nazvati Responsive Web Design + komponente na strani poslužitelja (RESS).
Prednosti:
- Struktura za navigaciju može se prilagoditi za različite zadatke koje obavljaju stolni i mobilni korisnici.
- Programeri mogu ukloniti elemente stranice iz HTML-a i CSS-a kako bi postigli željeni prikaz.
- Moguće je ukloniti nepotrebni JavaScript iz HTML-a, što oslobađa CPU resurse, memoriju i predmemoriju mobilnih uređaja.
Nedostaci:
- Dinamički HTML povećava opterećenje poslužitelja.
- Ne može se pouzdati u prepoznavanje uređaja.
- HTML i CSS optimizirani su za mobilne performanse. Desktop verzija koristi više HTTP zahtjeva i Java skripte.
Koju metodu odabrati?
Odluka o dizajniranju web-lokacije optimizirane za mobilne uređaje ovisi o proizvodima koje prodajete, ciljanoj publici, potrebnoj investiciji, vašoj konkurenciji, stopi pretvorbe itd. Metoda dizajna koja će najbolje funkcionirati uvelike ovisi o formatima zaslona, operativnim sustavima, preglednicima rezolucije.
Većina web-mjesta koja odgovaraju web dizajnu ne provode se optimalno i kao rezultat toga, te web-lokacije zahtijevaju više vremena za učitavanje. Budući da je konkurencija žestoka, možete izgubiti kupce ako vaša web-lokacija radi sporije. Korisnik će se jednostavno prebaciti na drugu web-lokaciju na koju je potrebno manje vremena za otvaranje. Iako je moguće izraditi web-mjesta s kraćim vremenom učitavanja s namjenskim mobilnim web-mjestima, postoje i razni nedostaci.
RESS pruža prednosti RWD-a kako bi prevladao svoja dva glavna nedostatka. Glavni nedostatak RESS-a je da je detekcija uređaja nepouzdana. Morate često testirati nove uređaje kako biste osigurali da postupak i dalje radi ispravno.
Postoje usluge kao što su DeviceAtlas, WURFL i druge koje mogu otkriti nove uređaje. Bit će od velike pomoći ažuriranje novih uređaja u bazi podataka.
Web-dizajn za mobilne uređaje uspješan je samo kada se web-lokacija ispravno prikazuje na mobilnom uređaju. Iako je dizajnerima težak zadatak da predstavljaju sve bitne dijelove web-lokacije za stolna računala u malom, mobilnom prozoru, svakodnevno se pojavljuju nove tehnike kako bi mobilne web-lokacije učinile boljim, bržim i potpunijim.
Fotografija mobilne web-lokacije putem usluge Shutterstock
15 Komentari ▼
