Viis reageerivat veebidisaini lõksu, mida vältida

Autor: Louise Ward
Loomise Kuupäev: 3 Veebruar 2021
Värskenduse Kuupäev: 18 Mai 2024
Anonim
Viis reageerivat veebidisaini lõksu, mida vältida - Loominguline
Viis reageerivat veebidisaini lõksu, mida vältida - Loominguline

Sisu

Suurte reageerivate kogemuste loomine nõuab meediaküsimustest kuradit palju enamat. Kui arvate, et squishy kujunduste loomine on kõik see reageeriv asi, jätate sellest aru. Fakt on see, et peame pakkuma usaldusväärset kasutuskogemust üha enamale veebitoega seadmetele ja täiesti eraldi seadmekogemuste loomine pole lihtsalt pikas perspektiivis skaleeritav. Kohanevate kogemuste loomine on targem edasiminek, kuid see ei tähenda, et see lähenemine ei oleks ilma väljakutseteta.

Siin on mõned lõkse, mida soovite reageerivat teed mööda liikudes vältida:

1. Sisu peitmine

Kuna tundlikud saidid jagavad ühte koodibaasi, on neil paremad võimalused sisu pariteedi saavutamiseks, mis on suurepärane. Kuid see ei tähenda, et see kõik oleks kummikommid ja liblikad. Ikka on palju tundlikke saite, mis peidavad või eemaldavad väiksemate ekraanide jaoks sisu, et tulla toime ekraani kinnisvara piirangutega.

Järgige seda lihtsat juhendit: ärge karistage kasutajaid seadme eest, mida nad juhtumisi sirvivad. Inimesed tulevad meie saitidele ja teenustele ootustega ning meie ülesanne on tagada, et nad suudaksid oma eesmärke saavutada. Mobiilikasutajad teevad kõik, mida töölaua kasutajad teevad, kuid see tuleb esitada kasutataval viisil. Nii et tehke kõik endast olenev, et teie sisule ja funktsionaalsusele pääseks juurde võimalikult palju inimesi.


Samuti väärib märkimist, et CSS-iga peidetavat sisu laaditakse ikka alla, mis on jõudluse seisukohalt kohutav ja viib meid järgmisesse lõksu, et seda vältida ...

2. Selle ülespuhumine!

OK, nii et te ei sisesta sisu väikeste ekraanide jaoks ja olete püüdnud pakkuda täielikku kasutuskogemust kontekstist hoolimata. Maailmaga on kõik korras, eks? Noh ei, sest nüüd on teil hunnik värk laadimiseks ja see võtab aega. 74% mobiiltelefoni kasutajatest lahkub pärast 5 sekundit (PDF) lehe laadimise ootamist ja kahetsusväärne on see, et ainult 3% reageerivate saitide väikese ekraaniga versioonidest on oluliselt kergemad kui nende suured ekraanid. See tähendab, et kasutajad kannavad potentsiaalselt tohutu allalaadimise koormust.

Barack Obama reageeriva saidi tavaline leht kaalub üle 4 MB. Neli. Megabaiti. See pole ühegi standardi poolt vastuvõetav, kuid eriti laguneb, kui mõelda kasutajatele, kellel võib olla EDGE-, 3G- või halb WiFi-ühendus.


Saidi jaoks, mille eesmärk on jõuda elanikkonnani (kõigil on erinevad mobiilsed rassid, mobiilsed usutunnistused, mobiilsed värvid ja religioonid), põhjustab see tõsiseid juurdepääsetavuse probleeme:

Reageerivate veebidisainide loomise üks suurimaid väljakutseid on tasakaalustav toiming täieliku kogemuse pakkumisel, säilitades samas kogu aeg mugava kasutuskogemuse. Lõigake ebareaalsus, järgige toimivuse parimaid tavasid, ärge eeldage vaikimisi tugevat ühendust ja otsige võimalusi suurepäraste tehnikate kasutamiseks, näiteks tingimuslik laadimine, et hoida esialgseid lehesuurusi.

3. Kontekstuaalsete tavade ignoreerimine

Telefon ei ole tahvelarvuti, pole sülearvuti, töölaud ega teler.

Iga seade pakub oma ainulaadset vormitegurit, liidese kokkuleppeid, piiranguid ja võimalusi. Kasutajate jaoks loomulikuna tunduvate kogemuste loomiseks peame arvestama kõigi nende muutujatega. Nüüd ei soovita ma iga platvormi kohaliku kasutajaliidese uuesti loomist brauseris, kuid peame olema tähelepanelikud, kuidas inimesed oma seadmeid hoiavad, milliseid ikoone nad on harjunud nägema ja nii edasi ja nii edasi. Hea reageeriv kogemus ulatub brauseriks olevast liivakastist välja ning on kasutajale ja seadme kontekstile sümpaatne.


Definitsiooni järgi reageeriv veebidisain ei ole mobiilne disain, seega on meie ülesandeks oma kujundusse kontekstuaalselt arvestavate elementide tutvustamine. See tähendab, et reageerivat navigeerimist tuleb käsitada viisil, mis on külastajatele mõistlik kogu kontekstis. See tähendab puudutamiseks kujundamist. See tähendab, et välditakse mobiilikasutajate sundimist naeruväärselt pika hulga erineva sisu leidmiseks, et lihtsalt otsitavat leida.

Arvestagem nende seadmete paljude erinevustega, mõistkem, et mingid kompromissid on vältimatud, kuid pingutagem tõsiselt, et kontekstiga rohkem arvestada.

4. Ühtse kogemuse pakkumine

Mobiil on palju enamat kui lihtsalt erinevad väikesed ekraanid ja need tekkivad kontekstid avavad täiesti uued kasutusjuhtumid, mustrid ja võimalused. Me ei tohiks end lühikeseks müüa, luues ainult tundlikke küljendusi. Näiteks unustame mõnikord, et mobiiltelefonid võivad saada kasutaja asukohta, algatada telefonikõnesid ja palju muud. Loodetavasti on kõigi nende vidinate brauseritel varsti juurdepääs veelgi rohkemale seadme API-le, mis nihutab veelgi veebis võimaliku piire.

Me peaksime kõik endast oleneva, et kogu kogemus vastaks sellele, milleks seade võimeline on. Piirangutega tegelemine annab meile kõigepealt kindla aluse, mille peal püsida, seejärel saame järk-järgult täiustada ja funktsioonide tuvastamist, et viia kogemus järgmisele tasandile.

5. Toetudes seadme mõõtmetele

320px. 480 pikslit. 768 pikslit. 1024 pikslit. Voldik. Oh jumal, klapp.

Fakt on see, et me ei kontrolli meie külastajate brauseri suurusi ega ka seda, millised mõõtmed otsustavad tootjad oma seadmeid valmistada. Uskuge mind, nad proovivad raamatus iga suurust.

Lisaks on lehe kõrgus olnud järjehoidjariba, brauseri kroomi ja Ask Jeevesi tööriistariba tõttu alati veelgi liikuvam sihtmärk. Kuid nüüd ei näe mobiilses veebimaailmas veebikogemust sageli brauseri objektiivi kaudu. Külastame linke Facebooki, Twitteri ja muude rakenduste kaudu, millest igaühel on veebivaadete sisaldamiseks oma kohandatud kroom.Muidugi on sisuhierarhia endiselt oluline ja soovite lehe sisikonda jõuda nii kiiresti kui võimalik, kuid te ei saa kogu saadaolevat pikslikõrgust ületada, õppige lahti laskma.

Jeremy Keith ütleb oma artiklis Fanfare for the Common Breakpoint sõnakalt, et "asi pole selles, mis toimub murdepunktides, vaid selles, mis juhtub murdepunktide vahel." See tähendab, et meie kujundused peaksid koos olema, sõltumata konkreetsest mõõtmest.

Lase disainil ise välja selgitada, kus murdepunktid peaksid tekkima. Ma armastan seda Stephen Hay nõuannet:

"Alustage kõigepealt väikesest ekraanist, seejärel laiendage, kuni see näeb välja nagu pask. Aeg sisestada murdepunkt!

Lastes sisul ise määrata meie tundlike kujunduste murdepunktid, valmistame oma kujundused välja nii, et need näeksid suurepärased välja mitte ainult tänases, vaid ka homses maastikus.

Tehke evolutsioon

Oleme adaptiivsete kogemuste loomisel jäämäe tipus. Kuigi need lõksud (ja paljud teised, mida käesolevas artiklis ei käsitleta) on olemas, pole need põhjust kohanevate kogemuste loomisest loobuda. Kuna iga päev tuleb stseenile rohkem ühendatud kuju ja suurusega seadmeid, on meil veebiloojatena võimalus nende saabumisel kohal olla. Kuigi see on tõepoolest veidi hirmuäratav, peaksime selle väljakutse vastu võtma ja kasutama võimalust jõuda inimesteni kõikjal.

Populaarne
Parimad töötavad kõrvaklapid aastal 2021
Loe Rohkem

Parimad töötavad kõrvaklapid aastal 2021

HÜPPA: Parimad töötavad kõrvaklapid üldi elt Parimad odavad töötavad kõrvaklapid Parimad tõeli ed traadita töötavad kõrvaklapid Parimad juh...
Rahustage meeli puhta ja karge pildiga
Loe Rohkem

Rahustage meeli puhta ja karge pildiga

Oleme varem maininud, et i tocki märgitud piltide autent u e trend on langema . Reaalne maailm võib olla pii avalt ma endav, ilma et olek vaja ilmit i ei ta elle hoolikalt juhitud ja redigee...
Kujundage Sketchis mobiilse jaemüügiliidese loomine
Loe Rohkem

Kujundage Sketchis mobiilse jaemüügiliidese loomine

Kui kä it i valmi tatud ko meetikaettevõte Lu h oovi arendada oma e ime t mobiil et ka utu kogemu t, pöördu kaubamärk ülemaailm e digitaal tuudio u two poole. Võtte ...