Šanse su da ste vidjeli kako iPhone može preokrenuti i proširiti web stranice. Na jednom mjestu možete pogledati cijelu web stranicu ili zumirati kako biste tekst koji vas zanima čitljiv. U jednom smislu, budući da iPhone koristi Safari, web dizajneri ne bi trebali učiniti ništa posebno za stvaranje web stranice koja će raditi na iPhoneu.
Ali, zaista želite da vaša stranica radi? Većina dizajnera želi sjaje svoje stranice!
Kada izradite web stranicu , morate razmišljati o tome tko će ga pogledati i kako će je pregledati. Neke od najboljih web mjesta uzimaju u obzir vrstu uređaja na kojem se stranica pregledava, uključujući razlučivost, opcije boja i dostupne funkcije. Oni se ne oslanjaju samo na uređaj da to shvate.
Opće smjernice za izgradnju web mjesta za mobilne uređaje
- Ispitajte što više uređaja. Prva stvar koju biste trebali učiniti jest vidjeti vašu web-lokaciju na iPhoneu i onoliko različitih mobilnih uređaja ili emulata koliko možete. Iako možete koristiti emulatore za sve vaše testiranje, oni stvarno ne daju vam isti osjećaj kao da pokušavate kretati kroz web stranicu na sitnom malom zaslonu, pa provjerite na stvarnim uređajima što je više moguće.
- Neka vaše stranice degradiraju graciozno. Možete pisati svoje stranice za preglednike širokog zaslona omogućenog za Flash, ali provjerite da su kritične informacije vidljive čak i na sitnom monitoru koji ne može raditi s posebnim značajkama (kao što su kolačići, Ajax, Flash, JavaScript itd.). Sve izvan XHTML Basica bit će izvan nekih mobitela. Iako većina pametnih telefona može nositi sve te stvari (osim Flash na iPhoneu, naravno), drugi mobilni uređaji ne mogu.
- Izgradite specifičnu stranicu za bežičnu mrežu i olakšajte pronalaženje. Ako ćete izgraditi određenu stranicu za svoj mobilni telefon i bežične korisnike, učinite je dostupnim. Odličan je način staviti vezu na bežičnu stranicu na samom vrhu dokumenta, a zatim sakriti tu vezu s ne-ručnih uređaja pomoću ručnog tipa medija. Uostalom, većina ljudi dolazi na vašu početnu stranicu, čak i na mobilnim telefonima - i ako veza s vašom bežičnom stranicom ne postoji, otići će ako je stranica prezahtorna za upotrebu.
Izgled web stranica za pametne telefone
Prva stvar koju trebate zapamtiti prilikom pisanja stranica za tržište pametnih telefona jest da ne morate ništa napraviti ako ne želite. Velika je stvar o većini dostupnih pametnih telefona jer upotrebljavaju web-preglednike (Safari na iOS-u i Chromeu na Androidu) za prikazivanje web stranica, pa ako vaša stranica izgleda dobro u Safaru ili Chromeu, izgledat će dobro na većini pametnih telefona (samo puno manje ). Ali postoje stvari koje možete učiniti kako bi vam iskustvo pregledavanja bilo ugodnije:
- Sjetite se da je zaslon malen. Pametni telefoni će sve one stupce spustiti u maleni prozor, što im može učiniti vrlo teško čitati bez zumiranja. Većina korisnika koristi se za zumiranje, ali može biti zamorna. Jedan dugi stupac teksta lakše je čitati.
- Podijelite stranice u manje komade. Može biti teško čitati dugačke segmente teksta na mobitelu pa ih stavljanje na više stranica olakšava čitanje.
Veze i navigaciju na iPhone uređajima
- Što su URL-ovi kraći, to bolje. Ako ste ikad pokušali unijeti URL na mobilni telefon, znat ćete da je to bol (osim možda za tinejdžere koji su navikli slati puno tekstnih poruka). Čak i na iPhoneu, dosadno je upisivati dugačke URL-ove. Držite ih kratko.
- No, dugački tekst veze lakše je dotaknuti. Kada se na stranici na kojoj je nekoliko zasebnih riječi povezano s različitim člancima, sve jedna uz drugu, može biti vrlo teško dotaknuti točnu sliku bez zumiranja. Mnogi ljudi će se samo odreći i otići negdje drugdje. Veze s 3 do 5 riječi u njima jednostavnije su kliknuti na telefon nego veze s jednim riječima.
- Nemojte stavljati navigaciju na sam vrh zaslona. Nema ništa više neugodno nego da moraš pretraživati stranice i zaslone veza kako biste pronašli željene informacije. Ako ste pogledali web stranice koje su dizajnirane za mobitele, vidjet ćete da su prve stvari koje se prikazuju sadržaj i naslov. Zatim, ispod toga je navigacija.
- Nemojte se bojati sakriti svoju navigaciju. Skrivanje veza za navigaciju s CSS-om ili JavaScriptom i njihovo prikazivanje samo kada korisnik to zatraži je način olakšavanja stranice za korisnike pametnih telefona.
Savjeti za slike na pametnim telefonima
- Slike moraju biti male. Da, Android i iPhone mogu zumirati i povećati veličinu slika , ali manja su, u obje dimenzije i vrijeme preuzimanja, sretniji su bežični korisnici. Optimiziranje slika uvijek je dobra ideja, ali za stranice mobitela, to je ključno.
- Slike moraju brzo skinuti. Slike zauzimaju puno prostora na web stranicama kada ih pregledavate s mobilnog uređaja. I dok su često vrlo lijepo i čine stranice izgledaju bolje kada ih gledaju na web-pregledniku na cijelom zaslonu, često se na putu na mobilnom uređaju. Osim toga, kada je korisnik pametnog telefona na mobilnoj mreži, zadnja stvar koju žele platiti je preuzimanje hrpe ogromnih slika ili ikona navigacije.
- Ne stavljajte velike slike na vrh stranice. Kao i kod navigacije, može biti vrlo dosadno čekati sliku koja zauzimanja 3-4 zaslona za učitavanje na samom vrhu stranice. I ovo je iznimno uobičajeno na web stranicama. Jedina iznimka je ako čitatelj zna da će dobiti sliku kad kliknu, recimo u fotogaleriji.
Što treba izbjegavati prilikom projektiranja za mobilne uređaje
Postoji nekoliko stvari koje biste trebali izbjegavati prilikom izgradnje stranice prilagođene mobilnim uređajima. Kao što je gore spomenuto, ako ih zaista želite imati na svojoj stranici, možete, ali pazite da web-lokacija funkcionira bez njih.
- Flash - većina mobilnih telefona ne podržava Flash, stoga nije dobro uključiti je na bežične stranice.
- Kolačići - mnogi mobiteli nemaju podršku za kolačiće. iPhone ima podršku za kolačiće.
- Okviri - čak i ako ih preglednik podržava, razmislite o dimenzijama zaslona. Okviri jednostavno ne rade na mobilnim uređajima - vrlo su teški ili nemoguće čitati.
- Tablice - ne upotrebljavajte tablice za izgled na mobilnoj stranici. I pokušajte izbjeći tablice općenito. Nisu podržani na svim mobilnim telefonima (iako ih podržavaju iPhone i drugi pametni telefoni), a možete završiti neobičnim rezultatima.
- Ugniježđene tablice - ako morate koristiti stol, nemojte je gniježditi u drugom stolu. To je teško za preglednike na stolnim računalima da podržavaju i, u najboljem slučaju, učitava učitavanje stranice sporije.
- Apsolutne mjere - drugim riječima, ne definirajte dimenzije objekata u apsolutnim veličinama (poput piksela, milimetara ili inča). Ako nešto definirate kao širine 100 piksela, na jednom mobilnom uređaju koji može biti pola zaslona, a na drugom može biti dvostruko veći. Relativne veličine (kao što su ems i postoci) najbolje funkcioniraju.
- Fontovi - nemojte pretpostavljati da će bilo koji od fontova s kojima ste navikli imati pristup na mobilnim telefonima.
Čitaj više
- Kako napraviti svoju web stranicu za mobilne prijateljske koristeći PHP