Tinklalapių projektavimas mobiliesiems įrenginiams

click fraud protection

Tikėtina, kad matėte, kaip „iPhone“ gali apversti ir išplėsti tinklalapius. Tai gali vienu žvilgsniu parodyti visą tinklalapį arba priartinti, kad jus dominantis tekstas būtų įskaitomas. Viena prasme, kadangi „iPhone“ naudoja „Safari“, interneto dizaineriams nereikėtų daryti nieko ypatingo, norint sukurti internetinį puslapį, kuris veiks „iPhone“. Bet ar tikrai norite, kad jūsų puslapis tiesiog veiktų - ar išsiskirtų ir spindėtų?

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

Bendrosios mobiliųjų įrenginių 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 kuo daugiau skirtingų mobilieji prietaisai ar emuliatoriai, kaip jūs galite. Nors visuose bandymuose galite naudoti emuliatorius, jie tikrai nesuteikia tokio pat jausmo, kaip bandant naršyti svetainėje mažame mažame ekrane. Turėtumėte kuo daugiau išbandyti realiuose įrenginiuose.
    instagram viewer
  • Priverskite savo puslapius grakščiai degraduoti. Galite parašyti savo puslapius Įjungta „Flash“, plačiaekranės naršyklės, tačiau įsitikinkite, kad svarbi informacija yra matoma net mažame monitoriuje, kuris negali valdyti jokių specialių funkcijų (pvz., slapukų, „Ajax“, „Flash“, „JavaScript“ ir kt.). Viskas, kas peržengia „XHTML Basic“, bus ne tik kai kurie mobilieji telefonai. Nors dauguma išmaniųjų telefonų gali tvarkyti visus tuos dalykus, kiti mobilieji įrenginiai negali.
  • Sukurkite specifinio belaidžio interneto puslapį ir padėkite jį lengvai rasti. Jei ketinate kurti konkretų puslapį savo mobiliajam telefonui ir belaidžio ryšio vartotojams, pateikite jį. Puikus būdas yra įdėti nuorodą į belaidį puslapį pačiame dokumento viršuje ir paslėpti tą nuorodą nuo nešiojamųjų įrenginių, naudojant rankinių laikmenų tipą. Galų gale, dauguma žmonių ateina į jūsų pagrindinį puslapį, net naudodamiesi mobiliaisiais telefonais - ir jei nuorodos į jūsų belaidį puslapį nėra, jie paliks, jei per sunku naudoti puslapį.

Išmaniųjų telefonų tinklalapio išdėstymas

Pirmas dalykas, kurį turėtumėte prisiminti, rašydami puslapius išmaniųjų telefonų rinkai, yra tai, kad jums nereikia daryti jokių pakeitimų, jei nenorite. Puikus dalykas, susijęs su daugeliu galimų išmaniųjų telefonų, yra tai, kad jie naudoja „Webkit“ naršykles („Safari“, „iOS“ ir „Chrome“, „Android“) rodyti tinklalapius, taigi, jei jūsų puslapis gerai atrodo „Safari“ ar „Chrome“, jis atrodys puikiai daugelyje išmaniųjų telefonų (tik daug mažesnis). Tačiau yra keletas dalykų, kuriuos galite padaryti, kad naršymas būtų malonesnis:

  • Atminkite, kad ekranas yra mažas. Išmanieji telefonai sutraukia visus tuos stulpelius žemyn į mažą langelį, ir tai gali juos labai sunku perskaityti be mastelio. Dauguma vartotojų yra įpratę artinti mastelį, tačiau tai gali būti varginanti. Vieną ilgą teksto stulpelį lengviau perskaityti.
  • Padalinkite puslapius į mažesnius gabalėlius. Mobiliajame telefone gali būti sunku skaityti ilgus teksto segmentus, todėl juos įdėjus į kelis puslapius, juos lengviau skaityti.

Nuorodos ir naršymas „iPhone“

  • Kuo trumpesni URL, tuo geriau. Jei kada nors bandėte įvesti URL mobiliajame telefone, žinosite, kad tai skausmas (išskyrus galbūt paauglius, kurie įpratę siųsti daug tekstinių pranešimų). Net ir „iPhone“ yra nuobodu įvesti ilgus URL. Laikykite juos trumpus.
  • Bet ilgos nuorodos tekstą lengviau paliesti. Kai puslapyje, kuriame keli atskiri žodžiai susieti su skirtingais straipsniais, visi šalia vienas kito, gali būti labai sunku bakstelėti teisingą be mastelio. Daugelis žmonių tiesiog atsisakys 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. Nėra nieko labiau erzinančio nei tai, kad norėdami rasti norimą informaciją turite naršyti ekranuose ir nuorodų ekranuose. Jei pažvelgėte į tinklalapius, kurie buvo sukurti mobiliesiems telefonams, pamatysite, kad pirmiausia pasirodo turinys ir antraštė. Tada žemiau yra navigacija.
  • Nebijokite paslėpti naršymo.Slėpti navigacijos nuorodas su CSS ar „JavaScript“ ir padaryti juos rodomus tik tada, kai vartotojas to paprašo, tai yra būdas palengvinti puslapį išmaniųjų telefonų vartotojams.

Patarimai vaizdams išmaniuosiuose telefonuose

  • Vaizdai turi būti maži. Taip, „Android“ ir „iPhone“ gali priartinti ir priartinti vaizdus, ​​tačiau kuo jie mažesni tiek matmenimis, tiek atsisiuntimo metu, tuo laimingesni bus jūsų belaidžio ryšio klientai. Vaizdų optimizavimas visada yra gera idėja, tačiau labai svarbu mobiliųjų telefonų puslapiams.
  • Vaizdai turi būti greitai atsisiunčiami. Vaizdai užima daug vietos tinklalapiuose, kai žiūrite juos iš mobiliojo įrenginio. Ir nors jie dažnai yra labai gražūs ir puslapiai atrodo geriau žiūrint per viso ekrano interneto naršyklę, jie dažnai trukdo mobiliajame įrenginyje. Be to, kai išmaniojo telefono vartotojas yra korinio ryšio tinkle, paskutinis dalykas, už kurį jie nori sumokėti, yra daugybės vaizdų ar navigacijos piktogramų atsisiuntimas.
  • Nedėkite didelių vaizdų puslapio viršuje. Kaip ir naršant, gali būti labai varginantis laukimas, kol vaizdas, užimantis 3–4 ekranus, bus įkeltas pačiame puslapio viršuje. Tai itin dažnai būna tinklalapiuose. Vienintelė išimtis yra tai, jei skaitytojas žino, kad paspaudęs, tarkim, nuotraukų galerijoje, gaus vaizdą.

Ko reikėtų vengti projektuojant mobiliesiems

Kuriant mobiliesiems pritaikytą puslapį, reikėtų 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ė: Daugelis mobiliųjų telefonų nepalaiko „Flash“, todėl nėra tikslinga įtraukti jį į savo belaidžio interneto puslapius.
  • Slapukai: Daugelis mobiliųjų telefonų nepalaiko slapukų. „iPhone“ telefonai tikrai 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ėstymui mobiliajame puslapyje. Stenkitės apskritai vengti lentelių. Jie nepalaikomi kiekviename mobiliajame telefone (nors „iPhone“ ir kiti išmanieji telefonai juos palaiko), todėl galite gauti keistų rezultatų.
  • Lizdinės lentelės: Jei turite naudoti lentelę, įsitikinkite, kad jos neįdėjote į kitą lentelę. Tai sunku palaikyti darbalaukio naršyklėse ir, 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 taškų pločio, viename mobiliajame įrenginyje, kuris gali būti pusė ekrano, kitame - du kartus didesnis. Geriausiai tinka santykiniai dydžiai (pvz., Emai ir procentai).
  • Šriftai: Nemanykite, kad kuris nors iš šriftus esate įpratę, kad prieiga bus prieinama mobiliuosiuose telefonuose.
instagram story viewer