Mobilās tīmekļa vietnes dizains ir sarežģīts, jo viena mobilās vietnes versija, iespējams, nav saderīga ar katru ierīci. Dizaineriem ir jāapzinās labākās dizaina prakses, lai padarītu jūsu mobilo klātbūtni nozīmīgu un lietderīgu.
Web izstrādātāju starpā notiek nepārtrauktas debates par to, kā vislabāk izveidot mobilo optimizēto tīmekļa vietni. Mobilās tīmekļa vietnes izveidei ir trīs galvenās metodes.
Šie ir:
- Atsaucīgs Web dizains.
- Īpašas mobilās tīmekļa vietnes.
- RESS: servera puses programmēšana padara CSS un HTML atkarībā no ierīces veida.
Katrai metodei ir plusi un mīnusi. Web izstrādātājam ir jāapzinās katra tehnika, lai īstenotu labāko situāciju situācijā.
3 veidi, kā izveidot mobilo vietni
Reaģējošs tīmekļa dizains (RWD)
RWD balstās uz CSS3 mediju vaicājumiem, lai saskaņotu tīmekļa lapas izkārtojumu ar ierīces skatīšanās laukuma lielumu. To pašu HTML kodu izmanto, lai attēlotu dažādus tīmekļa lapu izkārtojumus planšetdatoriem, mobilajām ierīcēm, galddatoriem un citiem sīkrīkiem.
Ieguvumi:
- Tīmekļa vietnei būs līdzīgs saturs un HTML uzcenojums, tāpēc mobilajiem apmeklētājiem būs tāda pati pieredze, neatkarīgi no tā, kādu ierīci viņi izmanto.
- Viens URL ļauj lietotājiem vieglāk saistīt un kopīgot saturu. (Ja tīmekļa lapa ir pieejama vairāk nekā vienā URL adresē, lietotāji var sajaukt.)
Trūkumi:
Nav iespējams atsevišķi optimizēt mobilo saturu. Tāpēc dizainers, kas izmanto RWD, nevar pielāgot saturu mobilajiem lietotājiem atsevišķi.
Saskaņā ar 2013. gada janvāra datiem no HTTP arhīva vidējā tīmekļa lapa ir aptuveni 1,3 MB. Tomēr lielākā daļa RWD vietu ir salīdzinoši lielākas. Šis lielāks izmērs samazina mobilo vietņu veiktspēju, padarot tos lēnākus.
Mobilo sakaru lietotāji ir vairāk pielāgoti specifiskiem mobilo sakaru lietotāja interfeisa dizaina modeļiem. Turklāt mobilo sakaru lietotāji ir pieraduši pie vairāku uzdevumu veikšanas. Ja vien navigācijas struktūra nav pielāgota konkrētām ierīcēm, lietotāji var saskarties ar problēmām, mēģinot vienlaikus izpildīt vairākus uzdevumus.
Īpašas mobilās vietnes
Šī metode uzlabo mobilo sakaru lietotāju pieredzi, izveidojot pilnīgi atsevišķu tīmekļa vietni.
Ieguvumi:
- Pārvaldības vienkāršība: mobilajām un darbvirsmas vietnēm ir nepieciešamas atsevišķas izmaiņas. Veiktās izmaiņas attiecas tikai uz katru attiecīgo versiju. Tas nozīmē, ka mobilajai platformai paredzētās izmaiņas nevar piekļūt no darbvirsmas.
- Izstrādājot mobilo vietni, ir vieglāk racionalizēt un optimizēt to tieši šai auditorijai.
- Satura un navigācijas struktūru var pielāgot mobilajiem lietotājiem.
Trūkumi:
Web lapas kopīgošana, izmantojot sociālo mediju, kļūst sarežģītāka, jo ar īpašām mobilajām vietnēm ir vairāki vietņu URL. Kad darbvirsmas lietotāji noklikšķina uz mobilajiem URL, kas tiek koplietoti sociālo mediju platformās, tie var nejauši saņemt vietnes mobilo versiju, nevis darbvirsmas versiju.
Lai izvairītos no satura dublēšanās, Web izstrādātājam jāizmanto rel = "alternatīva" un rel = "kanoniskā" meta tagi. Ja mobilais lietotājs meklē Google un noklikšķina uz darbvirsmas URL, lietotājs vai nu skatīs darbvirsmas versiju, vai arī tiks novirzīts uz tīmekļa lapas mobilo versiju. Ja mobilā versija nepastāv, lietotājs saņems kļūdas ziņojumu.
Radot pilnīgi citu tīmekļa vietni mobilajiem lietotājiem, vietne tiks īpaši pielāgota mobilajiem lietotājiem. Tomēr, lai izpildītu šo mērķi, tīmekļa izstrādātājiem ir jāsamazina funkcionalitāte un saturs, kas izrādās viņiem murgs.
Atsaucīgs Web dizains+ Servera sānu komponenti (RESS)
Šī metode ir atkarīga no servera puses programmēšanas, lai dažādām ierīcēm nodrošinātu pielāgotu HTML un CSS. Mobilo sakaru lietotāju kods atšķirsies no darbvirsmas lietotāju koda.
Šīs īstenošanas galvenais mērķis ir uzlabot tīmekļa vietnes veiktspēju. Šī metode darbojas labi kopā ar atsaucīgu Web dizainu. Tāpēc šo ieviešanu var saukt par atsaucīgu Web Design + servera puses komponentiem (RESS).
Ieguvumi:
- Navigācijas struktūru var pielāgot dažādiem uzdevumiem, ko veic darbvirsmas un mobilo sakaru lietotāji.
- Izstrādātāji var noņemt lapas elementus no HTML un CSS, lai sasniegtu vēlamo displeju.
- Ir iespējams noņemt nevajadzīgu JavaScript no HTML, kas atbrīvo CPU resursus, atmiņu un mobilo ierīču kešatmiņu.
Trūkumi:
- Dinamiskā HTML palielina servera slodzi.
- Nav iespējams paļauties uz ierīces noteikšanu.
- HTML un CSS ir optimizēti mobilo veiktspējai. Desktop versija izmanto vairāk HTTP pieprasījumu un Java skriptus.
Kuru metodi izvēlēties?
Lēmums par optimizētu mobilās vietnes izveidi ir atkarīgs no jūsu pārdotajiem produktiem, mērķauditorijas, nepieciešamajiem ieguldījumiem, konkurences, reklāmguvumu līmeņiem utt. Dizaina metode, kas darbosies vislabāk, lielā mērā ir atkarīga no ekrāna formātiem, operētājsistēmām, pārlūkprogrammām un rezolūcijas.
Visbiežāk atsaucīgās Web dizaina vietnes netiek optimāli ieviestas, un tādēļ šīs vietnes ielādē vairāk laika. Tā kā konkurence ir sīva, jūs varat zaudēt klientus, ja jūsu vietne darbojas lēnāk. Lietotājs vienkārši pārslēgsies uz citu tīmekļa vietni, kurā atvērsies mazāk laika. Lai gan ir iespējams izveidot tīmekļa vietnes ar īsākiem ielādes laikiem ar īpašām mobilajām vietnēm, šai īstenošanai ir arī vairāki trūkumi.
RESS sniedz RWD priekšrocības, pārvarot tās divus galvenos trūkumus. Galvenais RESS trūkums ir tas, ka ierīces noteikšana nav uzticama. Lai pārliecinātos, ka process turpina darboties pareizi, jums bieži jāpārbauda, vai ir jaunas ierīces.
Ir tādi pakalpojumi kā DeviceAtlas, WURFL un citi, kas var atklāt jaunas ierīces. Tas būs liels palīgs, lai atjauninātu jaunās ierīces savā datu bāzē.
Mobilā tīmekļa dizains ir veiksmīgs tikai tad, ja vietne mobilajā ierīcē tiek rādīta pareizi. Lai gan dizaineriem ir grūts uzdevums pārstāvēt visas darbvirsmas vietnes būtiskās daļas mazā, mobilā logā, katru dienu rodas jaunas metodes, lai padarītu mobilās tīmekļa vietnes labākas, ātrākas un pilnīgākas.
Mobilā tīmekļa vietne, izmantojot Shutterstock
15 Piezīmes ▼