Kaip konvertuoti mobiliojo naršyklės svetainę

Mobilieji įrenginiai, pvz., Išmanieji telefonai ir planšetiniai kompiuteriai, sudaro daugiau nei pusę viso interneto srauto. Tačiau, remiantis „BrightEdge“ atliktais tyrimais 2014 m., Daugiau nei ketvirtadalis lankomų svetainių nėra tinkamai sukonfigūruoti šiems įrenginiams - jie kainuoja vidutiniškai 68 proc. Tinkamai keičiant savo svetainę mobiliesiems naršyklėms, reikia planuoti ir išbandyti. Tačiau pats kodavimas paprastai nėra labai sudėtingas, ypač jei jau esate susipažinę su CSS. Jei naudojate tokią platformą kaip „WordPress“, jums nereikia žinoti kodo.

Bendros platformos
Nuo „iPhone“ atsiradimo kūrėjai už svetainių platformų, tokių kaip „WordPress“, „Joomla“ ir „Drupal“ turi integruotą mobilųjį dizainą. „Drupal“, pavyzdžiui, ateina su mobiliosios temos originalia instaliacija. Kiekviena iš šių platformų turi mobiliųjų temų, kurios sukurtos taip, kad sužlugdytų, kai tik jūsų svetainė aptiks, kad ją pasiekia mobilioji naršyklė. Kitos temos jau yra draugiškos mobiliesiems ir reaguoja į jutiklinius gestus taip, kaip jie reaguoja į pelės paspaudimus, nesikeisdami savo svetainės dizaino ar išdėstymo skirtingais įrenginiais.

CSS ir HTML naudojimas Naudodamiesi HTML svetainėmis, naudokite kaskadinio stiliaus lapą arba CSS failą, kad pateiktumėte savo puslapių mobiliąją versiją, kai joms pasiekiama mobilioji naršyklė. Nors galima identifikuoti CSS, kad būtų galima aptikti konkrečius įrenginius, labiau paplitęs metodas yra išdėstyti maketus pagal ekrano dydį pikseliais. Jei pageidaujate, galite turėti vieną stilių dideliems ekranams, vieną tabletėms ir vieną mobiliesiems telefonams. CSS naudojimas turi papildomą pranašumą, kad kodą reikia parašyti tik vieną kartą - CSS faile. Tuomet kiekvienam iš jūsų puslapių reikia tik vienos eilutės kodo, kad galėtumėte piešti savo stilius iš CSS.

„Interaktyviosios funkcijos“ jutiklinis ekranas

Jei sukonfigūravote tinklalapį, kuris yra interaktyvi lankytojų „JavaScript“ ar HTML5 patirtis Labai svarbu, kad žinotumėte, kaip jūsų svetainė atsilieps ne tik mobiliesiems naršyklėms, bet ir vis daugiau jutiklinio ekrano stalinių kompiuterių. Daugeliu atvejų turėtumėte apsvarstyti galimybę įtraukti dizaino kodą į jutiklinius įvykius ir gestus. Pavyzdžiui, „JQuery“ atveju, lygiavertis pelės paspaudimui ant jutiklinio ekrano yra bakstelėjimo įvykis, suaktyvintas, kai vartotojas paliečia ir tada pakelia pirštą iš ekrano. Priklausomai nuo jūsų puslapio, galbūt norėsite išjungti numatytuosius nustatymus mobiliajame naršyklėje, pvz., Suspausti, kad priartintumėte ar nuvilktumėte, naudodami įvykius „PrevDefault“.

Testavimas ir patvirtinimas
Geriausias būdas išbandyti savo naują mobiliojo interneto svetainę naudoti savo mobilųjį įrenginį. Išnagrinėkite stilių ir puslapio išdėstymą, naršykite su palietimais ir gestais ir atidžiai peržiūrėkite vaizdus, ​​kad jie atrodytų aiškūs. Taip pat galite naudoti kompiuterio naršyklę, kad galėtumėte sekti mobilųjį ekraną. „Google Chrome“, pavyzdžiui, paspauskite „F12“, kad atidarytumėte kūrėjo konsolę. Spustelėkite piktogramą „Nustatymai“, tada spustelėkite skirtuką „Emuliacija“, kad pasirinktumėte tokį įrenginį kaip „Google Nexus“ arba „Apple iPad“.

URL:https://lt.whycomputer.com/internetas/100401856.html