Ég fletti á internetinu á hverjum degi, á mörgum tækjum. Ég nota Macbook Pro, iMac, PC, iPad, iPhone og já jafnvel sjónvarpið mitt. Þannig er það mjög pirruð við mig þegar ég sé vefsíður sem ekki eru bjartsýni fyrir stærri skjáupplausn, eða það tekur tvær mínútur að hlaða á farsíma tækið mitt.
Við höfum öll tekið til hugmyndarinnar um móttækileg hönnun. Mjög fáir halda því fram við það. Reyndar er eini sannfærandi repost sem ég hef heyrt nýlega að viðskiptavinur er óánægður með að borga fyrir aukinn tíma sem fylgir. En eins og með eitthvað nýtt starf hefur goðsögn vaxið upp til að móta það.
Við skulum sjá hvort við getum brjóstmyndað nokkrar af þessum misskilningi ...
Já hreyfanlegur vefurinn er að springa og já það er drifkrafturinn á bak við móttækilegan hönnun en þegar við hugsum um móttækilegan hönnun þurfum við að íhuga meira en bara farsíma. Með kynningu á sjónhimnaleikum og tölvuleikjum, eru internetnotendur nú að skoða vefsíður á stærri skjáupplausn og í mörgum mismunandi samhengi.
Reyndu að taka tillit til mismunandi notendaheimilda þegar þú hannar og þróar móttækilegar vefsíður. Þú þarft að hugsa um hvaða tæki notandi notar: Er notandinn í farsíma eða heima fyrir framan sjónvarpið? Þú þarft að hugsa um hvar notandinn er staðsettur: Er notandi í línu í matvöruversluninni eða tjaldstæði út í eyðimörkinni? Having gott efni þýðir ekkert ef vefsvæðið þitt tekur tíu mínútur að hlaða meðan notendur þínir sitja á ströndinni með margarita.
Innihald er allt en samhengi er alls staðar og það er eitthvað sem þú hefur enga stjórn á. Af hverju er raunin að innihald þitt ætti að mæla fyrir hvaða upplausn, stór eða smá. Við höfum sett verkfæri til ráðstöfunar sem gerir okkur kleift að vinna með skipulag, hagræða textastærðum og auka árangur í hvaða samhengi sem er, svo muna að nota þær.
Mundu að samhengi breytist allan tímann, þess vegna er það svo mikilvægt að halda jafnvægi á sjónrænu skipulagi, þarfir notenda og árangur þegar nálgast móttækileg hönnun. Það er ekki bara um farsíma.
Ég reyndi að halda því fram að móttækilegur vefhönnun muni ekki virka fyrir hvert verkefni og að það veltur á notkunartilvikinu. Jæja, ég hef nýlega breytt skoðun mína og ég trúi því sannarlega að ef við ætlum að vera notandi áherslu hönnuðir og verktaki þurfum við að nálgast hvert verkefni með móttækilegri hönnun í huga.
Vefsíður með fastri breidd geta verið takmörkuð við stærri og minni skjáupplausn. The botn lína er að vefsíður okkar ætti að vera aðgengileg öllum, sama hvaða tæki eða skjáupplausn þeir nota, án takmarkana.
Ég hef tekið eftir stefnu sem kemur fram í greininni þar sem hönnuðir og verktaki byggja upp móttækilegar vefsíður sem aðeins eru ákveðnar í upplausn tækjanna og ég er líka sekur um þetta. Þrjár algengustu tæki eru auðvitað fartölvur / skjáborð, iPads og iPhone (eða önnur farsímatæki). Sem hönnuðir þurfum við að átta sig á því að móttækileg hönnun snýst um hönnunarmörk og gerð efni læsileg og aðgengileg öllum, ekki bara notendum ákveðinna tækja.
Það er sagt að ef þú ert að hanna vefsíður í hugbúnaði er mikilvægt að hafa einhvers konar ramma með brotamiðlum til að vinna af. Ég legg til að búa til þitt eigið. Bjartsýni skipulag þitt í samræmi við innihald. Besta leiðin til að komast að því hvaða brotstuðlar virka best er að skissa nokkrar vírramar fyrst til að fá hugmynd, þá getur þú byrjað að leggja niður pixla í hugbúnaðinum sem þú velur. Gakktu úr skugga um að þú vinnur af sama rist þegar vírframleiðsla og hönnun.
Ef þú ert eins og ég þá kóðarðu vírframleiðslurnar þínar og búið til lifandi frumgerð. Þetta hefur hjálpað mér mikið með móttækilegri vinnuflæði vegna þess að ég get búið til vökva mockup og bætt við brotamörkum í hönnuninni eins og hönnunin brýtur í stað þess að reyna að klípa pixla í Photoshop.
Eitt af stærstu vandamálum sem ég hef tekið eftir á mörgum móttækilegum vefsíðum er að leturgerð er kastað til úlfa þegar hönnuðir og verktaki ákveður að nota tækjatölur yfir hönnunarmörkum. Að mínu mati að velja tæki yfir hönnun sýnir fullkomið vanvirðingu fyrir því efni sem birtist og notandi sem notar þetta efni. Efnið ætti að viðhalda læsileiki þar til það verður að laga til að viðhalda læsileika. Innihald mun alltaf vera konungur og aðgengi og læsileiki á innihaldi þínu ætti alltaf að vera forgangsverkefni.
Ein af þeim leiðum sem mér líkar vel við að viðhalda læsileiki efnisins í móttækilegri hönnun er að nota ættingja eininga eins og ems fyrir leturstærð, padding, margar línur og skipulag. Móttækileg hönnun snýst allt um hlutfallsleg skipulag og að mínu mati eru ems fullkomin passa.
Ems eru hlutfallsleg einingar sem eru stigstærð í leturstærð foreldraþátta, þau geta spara þér mikinn tíma og þræta, og þeir hjálpa til við að viðhalda uppbyggingu á öllu skipulagi þínu. Hvað þýðir þetta að þú spyrð? Jæja, það þýðir að þegar grunn leturstærðin eykst eða lækkar, stillir skipulagið jafnt og þétt án þess að fúga upp eitthvað.
Hér er dæmi um að við höfum fundið tvær hönnunarstöðvar, einn fyrir mjög stóra skjáborðið með frábærri upplausn og einn fyrir litla töflu. Segjum einnig að leturstærðin okkar er 16px sem jafngildir 1.0em og við höggum grunn leturstærðinni allt að 22px þegar vefsíðan er skoðuð með upplausn 3840 x 2160 (frábær upplausn) og við lækkar þessi leturgerð að 14 px í upplausn 800 x 600 (lítill laptop / tafla). Við höfum bara breytt verulega stærð tegundarinnar og útlit vefsíðunnar okkar á tveimur tilnefndum punktum, eitt stórt og eitt lítið. Fyrirsögn á 1.4em með 22 punkta leturstærð fyrir stærri upplausn þýðir að 1.4em er 30,8 px og á smærri grunn leturstærð 14 px, 1,4em jafngildir 19,6 px. Jafnvel þótt leturstærð okkar hafi verulega aukist á 3840 x 2160, þurfum við ekki að hafa áhyggjur af skipulagi brotum því það hefur einnig aðlagast. Segjum að innihaldsefnið okkar hafi 50em breidd. Í upplausn 800 x 600 sem myndi vera 700px en í upplausn 3840 x 2160 myndi það vera 1100px. Padding okkar og brúnin yrðu einnig aðlagast. Þegar stærri upplausnin er með leturstærð og útlit sett í ems hefur gert hönnun okkar kleift að mæla hlutfallslega sem gerir efni okkar aðgengilegri og læsilegri.
Tilgangur móttækilegrar hönnun er að gera efni þitt aðgengilegt öllum, jafnvel fatlaðra, yfir öllum skjáupplausn og tækjum. Að fela efni er aldrei góð hugmynd og líkurnar eru á því að þú verðir að fela það sem þú þarft ekki að byrja með. Ef felur í sér efni er það ólæsilegt að lesendur lesa og þú gerir nú efni þitt óaðgengilegt þeim sem eru með sjónræn eða vitrænan fötlun. Hafðu þetta í huga, innihald ætti að vera alhliða á öllum tækjum, ekki refsa notendum þínum með því að takmarka það sem þeir geta skoðað á sérstöku tæki.
Það að segja, finn ég enn nokkra notkunartilfelli þar sem sýna: enginn; kemur sér vel. Að mestu leyti eru öll notkunarsviðin með einhvers konar flakk og ég nota skjá: ekkert; á leiðsögn sem breyta formi á mismunandi tækjum. Það er aldrei góð hugmynd að takmarka eða fela efni á mismunandi tækjum vegna þess að þú hefur líklega byggt þann ákvörðun á forsendu og einhver notandi einhvers staðar mun hafa mjög slæmt reynslu.
Það hafa verið margar vefsíður sem ég hef séð undanfarið sem hafa sýnt fram á skort á samúð gagnvart notendum með litla bandbreidd. Meirihluti þessara vefsvæða hefur sömu sameiginlega hluti, stórar myndir og stór JavaScript bókasöfn og mikið af þessum vefsíðum gæti verið bjartsýni ef þær voru hannaðar með farsíma fyrstu nálgun.
Vegna þess að enn er mikið um umræður um móttækilegar myndir, er það erfitt fyrir neinn að fremja sérhverja lausn. Ég skil vandann en bíður eftir fullkomnu lausninni sem er staðall yfir öllum vöfrum og tæki gera ekki vefinn þinn núna auðveldara að nota á tæki með takmarkaðan bandbreidd. Finndu lausn sem best lagfærir vandamálið þitt og keyrir með því. Ekki að finna lausn þýðir frammistöðu fyrir alla, og það eyðileggur fullkomlega tilganginn með móttækilegri hönnun.
Stórir JavaScript bókasöfn geta einnig valdið vandræðum á minni tæki. Reyndu að finna leið til að hringja í þau með skilyrðum á grundvelli skjáupplausn eða tegund tækis. Frammistaða ætti ekki að vera eftirtekt þegar kemur að móttækilegri hönnun.
Vefurinn hefur sprakk, og með tilkomu farsíma og snjallsímatækni getum við nálgast efni hvar sem er og í hvaða samhengi sem er. Það er mikilvægt að tryggja að við getum náð öllum notendum okkar og gefið þeim það sem þeir vilja, þegar þeir vilja það. Móttækileg hönnun er mjög ný tækni og að mínu mati er það hið fullkomna tækni til að sameina efni okkar á vefnum.
Hvaða aðrar goðsögn um móttækilegan hönnun viltu debunk? Eru einhverjar ókostir við móttækileg hönnun? Láttu okkur vita í athugasemdunum.
Valin mynd / smámynd, móttækilegur vefur mynd um Shutterstock.