Uspoređujući dva različita pristupa višemedijskom web dizajnu
Odgovarajući i prilagodljivi web-dizajn oboje su metode za stvaranje web-lokacija prilagođenih različitim uređajima koje dobro funkcioniraju na različitim veličinama zaslona. Iako je Google preporučio odgovarajući web dizajn i popularniji je od dva pristupa, obje ove metode za web-uređaje s više uređaja imaju svoje prednosti i njihove slabosti.
Pogledajmo razlike između responzivnog i prilagodljivog web dizajna, posebno usredotočujući se na ova ključna područja:
- Jednostavnost razvoja
- Razina kontrole koju imate preko dizajna
- Rasprostiranje uređaja / zaslona
- Kako je rješenje u budućnosti prijateljsko
- Ukupna brzina preuzimanja i izvedba web mjesta
Neke definicije
Prije nego što dođemo do naših usporednih usporedbi prilagodljivog i prilagodljivog web dizajna, razmislimo o definiciji tih dvaju pristupa na visokoj razini.
Odgovorni web-lokacije imaju izgled teksta koji se mijenja i prilagođava bez obzira na veličinu zaslona koji se koristi. Upiti medija omogućuju responzivnim web-lokacijama da čak i promijene "letjeti" ako je preglednik promijenjen.
Prilagodljivi dizajn koristi fiksne veličine na temelju unaprijed određenih točaka za postizanje najprikladnijih izgleda za veličinu zaslona koja se otkriva kada se stranica prvo učita.
S onim širokim definicijama, obratimo se ključnim područjima fokusa.
Jednostavnost razvoja
Najznačajnija razlika između responzivnog i adaptivnog web dizajna jest način na koji se ova rješenja primjenjuju na web stranicu. Budući da dizajn s odzivom stvara potpuno fluidni izgled, najbolje ga se upotrebljavaju na projektima na kojima redizajnirate web mjesto od samog početka . Pokušaj retrofitiranja kodeksa postojećeg web mjesta da postane responzivna često je naporna stvar jer jednostavno nemate razinu kontrole koju biste imali ako razvijete taj kôd ispočetka i uzmete u obzir odgovarajući dizajn u najranijim fazama tog procesa , To znači da, kada prilagodite web mjesto da biste bili osjetljivi, prisiljeni ste napraviti kompromise kako biste ostali unutar te postojeće baze kodova.
Ako radite s postojećom web-lokacijom s fiksnom širinom, prilagodljiv pristup znači da možete ostaviti veličinu da je web mjesto osmišljeno za netaknuto i po potrebi dodati dodatne prilagodljive granične točke. U nekim slučajevima, ako je proračun projekta manji, a ako će samo smjestiti malu količinu razvojnog rada, možete odabrati dodavanje novih prilagodljivih prekidnih točaka za manje veličine zaslona / mobilnih uređaja. To znači da biste omogućili da se veći zasloni svi upotrebljavaju na istom rasporedu - možda verziju 960 točke loma koja je vjerojatno bila za to mjesto.
Naopako je prilagodljiv pristup da možete bolje iskoristiti postojeći kôd web mjesta, ali jedan od manjih strana je stvaranje različitih predložaka izgleda za svaku prekretnicu koju odaberete za podršku. To će imati utjecaja na opterećenje potrebno za dugoročno razvijanje i održavanje ovog rješenja.
Kontrola dizajna
Jedna od prednosti odgovornog web mjesta je ta da njihova fluidnost omogućuje im da prilagode i podržavaju sve veličine zaslona, za razliku od samo unaprijed određenih točaka određenih prilagodljivim pristupom. Stvarnost je, međutim, da osjetljive web lokacije mogu izgledati sjajno kod određenih veličina zaslona (obično veličine koje odgovaraju popularnim uređajima dostupnim na tržištu), no vizualni se dizajn često raspada između tih popularnih rezolucija.
Na primjer, web-lokacija može izgledati sjajno na izgledu širokog zaslona od 1400 piksela, veličini zaslona na sredini 960 piksela, a mali zaslon ima 480 piksela, no što je između tih stanja? Kao dizajner, nemate dovoljno kontrole nad tim veličinama, a vizualni izgled stranice na tim veličinama često je manji od idealne.
S prilagodljivim web-mjestom imate mnogo više kontrole nad različitim izgledima koji se upotrebljavaju jer su fiksne veličine na temelju utvrđenih točaka. Te neugodne međusobne države više nisu problem jer ste pažljivo osmislili svaki "izgled" (što znači svaki prikaz intervala) koji će biti isporučen posjetiteljima.
Kao atraktivan kao što ova razina kontrole dizajna može zvučati, morate biti svjesni da dolazi po cijeni. Da, imate potpunu kontrolu nad izgledom svake prekidne točke, ali to znači da morate uložiti vrijeme dizajna potrebne za dizajniranje za svaki od tih jedinstvenih izgleda. Što više točaka koje odaberete za dizajn, to više vremena ćete morati potrošiti na taj proces.
Rasprostranjenost podrške
Odgovarajući i prilagodljivi web dizajn uživaju prilično snažnu podršku, posebno u modernim preglednicima.
Adaptivne web stranice zahtijevaju komponente na strani poslužitelja ili Javascript za otkrivanje veličine zaslona. Očito, ako prilagodljivo web mjesto zahtijeva Javascript, to znači da ga preglednik mora omogućiti kako bi ta stranica ispravno funkcionirala. To vam možda neće biti glavna briga jer većina ljudi ima Javascript u svojim preglednicima, no svaki put kad web mjesto ima kritičku ovisnost o svemu, to treba napomenuti.
Odgovarajuće web stranice i upiti medija koji ih napajaju dobro će raditi u svim modernim preglednicima. Jedini problemi koje ćete imati su najstarije inačice Internet Explorera, budući da verzije 8 i niže ne podržavaju medijske upite . Da biste to radili , često se koristi Javascript polifil , što znači da ovdje postoji i ovisnost o Javascriptu, barem za one zastarjele inačice IE. Opet, to vam možda neće biti puno briga, pogotovo ako analitika vašeg web mjesta pokazuje da ne primate mnogo posjetitelja pomoću tih starijih verzija preglednika.
Budućnost prijateljstva
Fluidna priroda responzivnih web stranica daje im prednost nad prilagodljivim mjestima kada je riječ o budućnosti. To je zato što one responzivne web stranice nisu izgrađene kako bi se smjestile samo prethodno ustanovljene skup prekidnih točaka. Oni se prilagodbe uklapaju u sve ekrane , uključujući one koji možda i danas nisu na tržištu. To znači da osjetljive web stranice neće morati biti "fiksne" ako se nova razlučivost zaslona odjednom postane popularna.
Gledajući nevjerojatnu raznolikost u pejzažu uređaja (od kolovoza 2015. na tržištu je bilo više od 24.000 različitih uređaja s Androidom), a web mjesto koje najbolje odgovara ovom širokom rasponu ekrana kritično je važno za budućnost. To je zbog toga što vjerojatno neće imati manje raznolik krajolik u budućnosti, što znači da će projektiranje za određene zaslone ili veličine postati nemoguće, ako već nismo dostigli tu stvarnost.
S druge strane ovog scenarija usporedbe, ako je web mjesto prilagodljivo i ne odgovara novim rezolucijama koje bi mogle postati važne na tržištu, tada ćete možda biti prisiljeni dodati tu prekretnicu na web stranice koje ste stvorili. Time se projektima i razvojnim vremenima dodaju projekti, a to znači da one prilagodljive lokacije moraju biti dosljedno praćene kako bi se osiguralo da na tržište ne budu uvedene nove granične točke koje se moraju dodati na web mjesto. Opet, s različitom raznolikosti uređaja, što mora biti stalna provjera novih veličina i moguća njihova prilagodba novim točkama, trajni je izazov koji će imati utjecaja na posao koji morate poduprijeti web mjestu i trošak tog održavanja za tvrtka ili organizacija za koju se web-lokacija odnosi.
Izvođenje
Odgovorni web dizajn dugo je optužen (nepravedno tako iu mnogim slučajevima) da je loše rješenje s brzine preuzimanja / performansi stajališta. To je uglavnom zbog činjenice da je u ranim danima tog pristupa mnogi web dizajneri jednostavno privezali male zaslonske medijske upite na postojeći CSS stranice. To je prisililo slike i resurse namijenjene većim zaslonima da se isporučuju na sve uređaje, čak i ako ti manji zasloni ne upotrebljavaju u njihovim konačnim izgledima. Odgovarajući dizajn je došao dug put od tih dana i stvarnost je da kvaliteta osjetljivih web stranica danas ne pate od problema s performansama.
Usporene brzine preuzimanja i napuhane web-lokacije nisu odgovarajući problemi s web-lokacijom - to je problem koji se može naći na svim web-lokacijama. Slike koje su previše teške, hrane se društvenim medijima, prekomjerne skripte i još mnogo toga i teže web stranice, no oba responzivna i prilagodljiva web mjesta mogu se graditi tako da se brzo učitavaju. Naravno , oni također mogu biti konstruirani na način koji ne daje prioritet prioritetu, ali to nije osobina samog rješenja, već odraz tima koji je bio uključen u razvoj same stranice.
Izvan izgleda
Jedan od najvažnijih aspekata prilagodljivog web dizajna je da ne samo da imate kontrolu nad dizajnom web mjesta za postavljene prekidne točke, već i resurse koji se isporučuju za te verzije web mjesta. Na primjer, to znači da se retina slike mogu poslati samo na mrežne uređaje, dok zasloni koji nisu retina dobivaju prikladnije slike koje su manje u veličini datoteke. Ostali resursi na web-mjestu (JavaScript datoteke, CSS stilovi itd.) Mogu se pametno isporučiti samo kada su potrebni i bit će korišteni.
Ova upotreba prilagodljivog web dizajna nadilazi jednostavnu jednadžbu "ako nadograđujete web stranicu, prilagodljivi mogu biti lakši pristup upotrebi". Sva mjesta, uključujući potpune preoblikovanje, mogu imati koristi od pametnijeg pristupa do prilagođenijih iskustava.
Ovaj scenarij pokazuje nijansiranu prirodu ove "osjetljive ili adaptivne" rasprave. Iako je istina da prilagodljivi pristup može biti prikladniji nego odgovoran za web-uređaje, to može biti i izvrsno rješenje za potpuni redizajn. Slično tome, u nekim se slučajevima može dodati odgovarajući pristup na kôd baze postojećeg web mjesta, dajući tom mjestu sve pogodnosti potpuno prihvatljivog pristupa.
Koji je pristup bolji?
Kada je riječ o odzivnom ili adaptivnom web dizajnu, nema jasnog "pobjednika", iako je odgovoran svakako više popularan pristup. Zapravo, "bolji" pristup ovisi o potrebama određenog projekta. Nadalje, to ne mora biti "bilo / ili" situacija. Postoje mnogi web profesionalci koji grade web stranice koje kombiniraju najbolje odgovorno web dizajn (širine tekućine, buduća podrška) sa snagama adaptivnog dizajna (bolja kontrola dizajna, pametno učitavanje resursa).
Obično poznat kao RESS (responzivni web dizajn s komponentama na strani poslužitelja), ovaj pristup pokazuje da stvarno nema "jednake veličine odgovara svemu rješenju." Obje responzivne web dizajn i prilagodljive imaju svoje snage i izazove, pa morate odrediti koji će raditi najbolje za vaš specifičan projekt ili ako se hibridno rješenje možda najbolje odgovara vašem projektu.