Kaip rašyti tinklalapius mobiliesiems įrenginiams

TurinysIšskleisti

• Bendrosios gairės
• Išmaniesiems telefonams skirtas išdėstymas
• Nuorodos ir navigacija
• Vaizdų patarimai
• Dalykai, kurių reikia vengti

Tikėtina, kad matėte, kaip „iPhone“ gali apversti ir išplėsti tinklalapius. Jis gali vienu žvilgsniu parodyti visą tinklalapį arba priartinti, kad jus dominantis tekstas būtų skaitomas. Tam tikra prasme, kadangi iPhone naudoja Safari , interneto dizaineriai neturėtų daryti nieko ypatingo, kad sukurtų tinklalapį, kuris veiktų „iPhone“. Bet ar tikrai norite, kad jūsų puslapis veiktų – ar išsiskirtų ir spindėtų?

Kada tu sukurti tinklalapį , turite pagalvoti, kas jį peržiūrės ir kaip jie jį peržiūrės. Kai kuriose geriausiose svetainėse atsižvelgiama į tai, kokio tipo įrenginiu puslapis peržiūrimas, įskaitant skiriamąją gebą, spalvų parinktis ir galimas funkcijas. Jie pasikliauja ne tik įrenginiu, kad tai išsiaiškintų.

Bendrosios mobiliesiems įrenginiams skirtos svetainės kūrimo gairės

Išbandykite kuo daugiau įrenginių.Pirmas dalykas, kurį turėtumėte padaryti, yra peržiūrėti savo svetainę „iPhone“ ir daugybę skirtingų mobiliuosius įrenginius arba emuliatoriai, kaip galite. Nors galite naudoti emuliatorius visiems savo bandymams, jie tikrai nesuteikia jums to paties jausmo, kaip bandant naršyti svetainę mažame ekrane. Turėtumėte kuo dažniau išbandyti tikrus įrenginius. Padarykite savo puslapius grakščiai pablogėjusius.Galite rašyti savo puslapius Įjungta „Flash“. , plačiaekranėse naršyklėse, tačiau įsitikinkite, kad svarbi informacija matoma net mažame monitoriuje, kuris negali valdyti jokių specialių funkcijų (pvz., slapukų, „Ajax“, „Flash“, „JavaScript“ ir kt.). Viskas, kas nėra XHTML Basic, bus už kai kurių mobiliųjų telefonų ribų. Nors dauguma išmaniųjų telefonų gali susidoroti su visais šiais dalykais, kiti mobilieji įrenginiai negali. Sukurkite konkretų belaidžio ryšio puslapį ir padarykite jį lengvai randamą.Jei ketinate sukurti konkretų puslapį savo mobiliojo telefono ir belaidžio ryšio klientams, padarykite jį prieinamą. Puikus būdas yra įdėti nuorodą į belaidžio ryšio puslapį pačiame dokumento viršuje, o tada paslėpti šią nuorodą nuo ne delninių įrenginių, naudojant delninės laikmenos tipą. Galų gale, dauguma žmonių ateina į jūsų pagrindinį puslapį, net naudodami mobiliuosius telefonus – ir jei ten nėra nuorodos į jūsų belaidžio ryšio puslapį, jie išeis, jei puslapiu bus per sunku naudotis.

Tinklalapio išdėstymas išmaniesiems telefonams

Pirmas dalykas, kurį turėtumėte atsiminti rašydami puslapius išmaniųjų telefonų rinkai, yra tai, kad jums nereikia atlikti jokių pakeitimų, jei to nenorite. Puikus daugumos išmaniųjų telefonų pranašumas yra tas, kad jie naudoja Webkit naršykles (iOS sistemoje „Safari“, o „Android“ – „Chrome“), kad būtų rodomi tinklalapiai, taigi, jei jūsų puslapis atrodo gerai naudojant „Safari“ ar „Chrome“, jis puikiai atrodys daugelyje išmaniųjų telefonų (tik daug mažesnis). ). Tačiau yra dalykų, kuriuos galite padaryti, kad naršymas būtų malonesnis:

Atminkite, kad ekranas yra mažas.Išmanieji telefonai sutrauks visus tuos stulpelius į mažą langelį, todėl juos gali būti labai sunku perskaityti be mastelio. Dauguma vartotojų yra pripratę prie mastelio keitimo, tačiau tai gali būti nuobodu. Vieną ilgą teksto stulpelį lengviau skaityti.Padalinkite puslapius į mažesnius gabalus.Gali būti sunku perskaityti ilgus teksto segmentus mobiliajame telefone, todėl sudėjus juos keliuose puslapiuose juos lengviau skaityti.

Nuorodos ir naršymas „iPhone“.

Kuo trumpesni URL, tuo geriau.Jei kada nors bandėte įvesti URL mobiliuoju telefonu, žinosite, kad tai yra kančia (išskyrus galbūt paauglius, kurie įpratę siųsti daug tekstinių pranešimų). Net „iPhone“ įvesti ilgus URL yra nuobodu. Laikykite juos trumpai. Tačiau ilgą nuorodos tekstą lengviau paliesti.Puslapyje, kuriame keli atskiri žodžiai yra susieti su skirtingais straipsniais vienas šalia kito, gali būti labai sunku paliesti tinkamą žodį be mastelio. Daugelis žmonių tiesiog pasiduos ir eis kur nors kitur. Nuorodas, kuriose yra 3–5 žodžiai, lengviau spustelėti telefone nei 1 žodžio nuorodas. Nedėkite navigacijos pačiame ekrano viršuje.Nieko nėra labiau erzina, kaip naršyti ekranus ir nuorodų ekranus, kad rastumėte norimą informaciją. Jei peržiūrėjote tinklalapius, kurie buvo sukurti mobiliesiems telefonams, pamatysite, kad pirmiausia atsiras turinys ir antraštė. Tada žemiau yra navigacija. Nebijokite paslėpti navigacijos. Slėpti naršymo nuorodas su CSS arba JavaScript ir jų rodymas tik tada, kai vartotojas to prašo – tai būdas palengvinti puslapį išmaniųjų telefonų naudotojams.

Vaizdų išmaniuosiuose telefonuose patarimai

Vaizdai turi būti maži.Taip, „Android“ ir „iPhone“ gali priartinti ir nutolinti vaizdus, ​​tačiau kuo jie mažesni tiek matmenų, tiek atsisiuntimo laiko atžvilgiu, tuo laimingesni bus jūsų belaidžio ryšio klientai. Vaizdų optimizavimas visada gera idėja, tačiau mobiliųjų telefonų puslapiams tai labai svarbu. Vaizdus reikia atsisiųsti greitai.Vaizdai užima daug vietos tinklalapiuose, kai juos peržiūrite iš mobiliojo įrenginio. Ir nors jie dažnai yra labai gražūs ir leidžia puslapiams geriau atrodyti žiūrint viso ekrano žiniatinklio naršyklėje, jie dažnai trukdo mobiliajame įrenginyje. Be to, kai išmaniojo telefono naudotojas prisijungia prie korinio tinklo, paskutinis dalykas, už kurį jis nori mokėti, yra daugybės didžiulių vaizdų ar naršymo piktogramų atsisiuntimas. Nedėkite didelių vaizdų puslapio viršuje.Kaip ir naudojant navigaciją, gali būti labai nuobodu laukti, kol pačiame puslapio viršuje bus įkeltas vaizdas, kuris užima 3–4 ekranus. Ir tai labai įprasta interneto puslapiuose. Vienintelė išimtis, jei skaitytojas žino, kad spustelėjęs gaus vaizdą, tarkime, nuotraukų galerijoje.

Ko vengti kuriant mobiliesiems skirtą dizainą

Kurdami mobiliesiems pritaikytą puslapį turėtumėte vengti kelių dalykų. Kaip minėta pirmiau, jei tikrai norite, kad tai būtų jūsų puslapyje, galite, bet įsitikinkite, kad svetainė veikia be jų.

Blykstė: Dauguma mobiliųjų telefonų nepalaiko „Flash“, todėl nederėtų jos įtraukti į belaidžius puslapius. Slapukai: Daugelis mobiliųjų telefonų nepalaiko slapukų. iPhone turi slapukų palaikymas . Rėmeliai:Net jei naršyklė juos palaiko, pagalvokite apie ekrano matmenis. Rėmeliai tiesiog neveikia mobiliuosiuose įrenginiuose – juos labai sunku arba neįmanoma perskaityti. Lentelės: nenaudokite lentelių išdėstydami puslapyje mobiliesiems. Ir apskritai stenkitės vengti stalų. Jie nepalaikomi visuose mobiliuosiuose telefonuose (nors iPhone ir kiti išmanieji telefonai juos palaiko), todėl galite gauti keistų rezultatų. Įdėtos lentelės: jei turite naudoti lentelę, nedėkite jos į kitą lentelę. Tai sunku palaikyti stalinių kompiuterių naršyklėms, o geriausiu atveju puslapis įkeliamas lėčiau. Absoliučios priemonės: Kitaip tariant, neapibrėžkite objektų matmenų absoliučiais dydžiais (pvz., pikseliais, milimetrais ar coliais). Jei ką nors apibrėžiate kaip 100 piks. pločio, viename mobiliajame įrenginyje jis gali būti pusė ekrano, o kitame – du kartus didesnis. Geriausiai tinka santykiniai dydžiai (pvz., EMS ir procentai). Šriftai: Nemanykite, kad kuri nors iš šriftus prie kurių esate pripratę, bus pasiekiami mobiliuosiuose telefonuose.