Ang Pagkakaiba sa Pagitan ng Nakikiramay at Nakapag-agpang Web Design

Paghahambing ng Dalawang Iba't ibang mga Diskarte sa Multi-Device Web Design

Ang tumutugon at nakakapag-agpang web design ay parehong mga pamamaraan para sa paglikha ng mga multi-device friendly na mga website na mahusay na gumagana sa iba't ibang laki ng screen. Habang inirerekomenda ng Google ang tumutugon sa disenyo ng web at ang mas popular sa dalawang diskarte, ang parehong mga pamamaraan para sa multi-device na disenyo ng web ay may kanilang mga lakas at kahinaan.

Tingnan natin ang mga pagkakaiba sa pagitan ng tumutugon at adaptive web design, partikular na nakatuon sa mga susi na lugar na ito:

Ang ilang mga Kahulugan

Bago tayo makakuha ng magkatulad na paghahambing ng tumutugon at adaptive web design, maglaan tayo ng isang sandali upang tingnan ang isang mataas na antas na kahulugan ng dalawang mga pamamaraang ito.

Ang mga tumutugon na mga website ay may tuluy-tuloy na layout na nagbabago at umangkop nang walang kinalaman sa laki ng screen na ginagamit. Pinapayagan ng mga query sa media ang mga tumutugon na mga site upang baguhin kahit na "sa mabilisang" kung ang laki ng browser.

Ang agpang disenyo ay gumagamit ng mga nakapirming laki batay sa mga tinukoy na mga breakpoint upang maihatid ang pinaka-angkop na bersyon ng layout para sa laki ng screen na napansin kapag nag-load ang unang pahina.

Gamit ang mga malawak na mga kahulugan sa lugar, let's turn sa aming mga pangunahing lugar ng focus.

Dali ng Pagpapaunlad

Ang pinaka-makabuluhang pagkakaiba sa pagitan ng tumutugon at adaptive web design ay sa paraan na ang mga solusyon na ito ay inilalapat sa isang website. Dahil ang nakikiramay na disenyo ay lumilikha ng isang ganap na tuluy-tuloy na layout, ito ay pinakamahusay na ginagamit sa mga proyekto kung saan mo muling pagdidisenyo ng site mula sa ground up . Ang pagsisikap na baguhin ang code ng isang umiiral na website upang maging tumutugon ay kadalasang isang nakapanghihilakbot na bagay dahil wala kang antas ng kontrol na gagawin mo kung binubuo mo ang code na iyon mula sa simula at pagkuha ng tumutugon na disenyo para sa pinakamaagang yugto ng prosesong iyon . Nangangahulugan ito na kapag nag-retrofit ka ng isang site na tumutugon, ikaw ay napipilitang gumawa ng mga kompromiso upang manatili sa loob ng kasalukuyang umiiral na codebase.

Kung ikaw ay nagtatrabaho sa isang umiiral na fixed-lapad na website, ang isang adaptive diskarte ay nangangahulugan na maaari mong iwanan ang sukat na ang site ay dinisenyo para sa buo at idagdag sa karagdagang mga mapagpipitan breakpoints kung kinakailangan. Sa ilang mga kaso, kung ang badyet ng isang proyekto ay maliit, at kung tumanggap lamang ito ng isang maliit na halaga ng gawaing pag-unlad, maaari mong piliin na magdagdag lamang ng bagong mga mapagpipigil na breakpoint para sa mas maliit na screen / mobile-centric na laki. Nangangahulugan ito na iyong papayagan ang mas malaking mga screen upang magamit ang lahat ng parehong layout - marahil ay isang 960 breakpoint na bersyon na kung saan ang site na iyon ay malamang na orihinal na dinisenyo para sa.

Ang nakabaligtad sa isang mapang-akit na diskarte ay na maaari mong mas mahusay na mapakinabangan ang isang umiiral na code ng site, ngunit isa sa mga downsides ay na lumikha ka ng iba't ibang mga template ng layout para sa bawat breakpoint na pinili mong suportahan. Ito na may epekto sa workload na kinakailangan upang bumuo at mapanatili ang solusyon na ito sa pang-matagalang.

Control ng Disenyo

Ang isa sa mga kalakasan ng mga tumutugon na mga website ay ang kanilang pagkidigma ay nagpapahintulot sa kanila na iakma at suportahan ang lahat ng mga laki ng screen kumpara sa lamang ng mga pre-set breakpoint na natukoy sa isang agpang diskarte. Ang katotohanan, gayunpaman, ay ang mga tumutugon na mga site ay maaaring mukhang mahusay sa ilang mga sukat ng pangunahing screen (karaniwan ay sukat na tumutugma sa mga popular na device na magagamit sa merkado), ngunit ang visual na disenyo ay madalas na masira sa pagitan ng mga popular na resolution.

Halimbawa, ang isang site ay maaaring mukhang mahusay sa layout ng malawak na screen ng 1400 pixels, ang mid-screen na laki ng 960 pixels, at ang maliit na screen ay tumingin sa 480 pixels, ngunit paano ang tungkol sa mga pagitan ng mga estado ng mga laki na ito? Bilang isang taga-disenyo, ikaw ay may maliit na walang kontrol sa mga in-sa pagitan ng mga laki at ang visual na hitsura ng pahina sa mga laki ay madalas na mas mababa kaysa sa perpekto.

Sa isang agpang website, mayroon kang higit pang kontrol sa disenyo sa iba't ibang mga layout na ginagamit dahil ang mga ito ay mga nakapirming laki batay sa iyong itinatag na mga breakpoint. Ang mga mahirap na pagitan sa pagitan ng mga estado ay hindi isang problema dahil na maingat na iyong dinisenyo ang bawat "hitsura" (ibig sabihin bawat display breakpoint's) na maihahatid sa mga bisita.

Bilang kaakit-akit na antas ng kontrol ng disenyo na ito ay maaaring tunog, dapat mong malaman na ito ay may isang presyo. Oo, mayroon kang ganap na kontrol sa hitsura ng bawat breakpoint, ngunit nangangahulugan ito na dapat mong mamuhunan ang oras ng disenyo na kinakailangan upang mag-disenyo para sa bawat isa sa mga natatanging layout na iyon. Ang mas maraming mga breakpoint na pipiliin mo sa disenyo para sa, mas maraming oras ang kakailanganin mong gastusin sa prosesong iyon.

Sukat ng Suporta

Parehong tumutugon at agpang web disenyo tangkilikin ang medyo matatag na suporta, lalo na sa mga modernong browser.

Ang mga agpang website ay nangangailangan ng alinman sa bahagi ng server o Javascript para sa screen size detection. Malinaw na, kung nangangailangan ng Javascript ang isang agpang na site, nangangahulugan ito na kailangan ng isang browser na ma-enable ito upang maayos ang site na iyon. Iyon ay hindi maaaring maging isang pangunahing pag-aalala sa iyo dahil karamihan sa mga tao ay may Javascript sa kanilang mga browser, ngunit anumang oras ang isang site ay may isang kritikal na dependency sa anumang bagay, ito ay dapat na nabanggit.

Ang mga nakikiramay na website at ang mga query sa media na nagpapalakas sa kanila ay gagana nang mahusay sa lahat ng mga modernong browser. Ang tanging mga problema ay mayroon ka sa mga pinakalumang bersyon ng Internet Explorer dahil ang mga bersyon 8 at ibaba ay hindi sumusuporta sa mga query sa media . Upang magtrabaho sa paligid nito , isang Javascript polyfill ay kadalasang ginagamit , na nangangahulugang mayroong dependency sa Javascript dito rin, hindi bababa sa para sa mga sinaunang bersyon ng IE. Muli, maaaring hindi ito isang pag-aalala sa iyo, lalo na kung ipinapakita ng analytics ng iyong site na hindi ka nakatanggap ng maraming bisita gamit ang mga lumang bersyon ng browser.

Hinaharap Kabait

Ang tuluy-tuloy na likas na katangian ng mga tumutugon na mga website ay nagbibigay sa kanila ng isang kalamangan sa mga nakakapag-agpang mga site pagdating sa hinaharap-kabaitan. Ito ay dahil ang mga tumutugon na mga site ay hindi binuo upang mapaunlakan lamang ang dating itinatag na hanay ng mga breakpoint. Sila ay umangkop upang umangkop sa lahat ng mga screen , kabilang ang mga hindi maaaring aktwal na nasa merkado ngayon. Nangangahulugan ito na ang mga tumutugon na mga site ay hindi kailangang "maayos" kung ang isang bagong resolution ng screen ay biglang nagiging sikat.

Sa pagtingin sa hindi kapani-paniwalang pagkakaiba-iba sa landscape ng aparato (bilang ng Agosto 2015, mayroong higit sa 24,000 natatanging mga Android device sa merkado), ang pagkakaroon ng isang site na pinakamahusay na upang mapaunlakan ang malawak na hanay ng mga screen ay critically mahalaga para sa hinaharap-kabaitan. Ito ay dahil sa landscape na ito ay hindi maaaring makakuha ng anumang mas magkakaibang sa hinaharap, na nangangahulugan na ang pagdidisenyo para sa mga partikular na screen o sukat ay magiging imposible, kung hindi pa natin naabot ang katotohanan.

Sa kabilang panig ng sitwasyong ito sa paghahambing, kung ang isang site ay nakakapag-agpang at hindi ito tumanggap ng mga bagong resolution na maaaring maging mahalaga sa merkado, pagkatapos ay maaari kang mapilit na idagdag ang breakpoint na iyon sa mga site na iyong nilikha. Nagdadagdag ito ng oras ng disenyo at pag-unlad sa mga proyekto at nangangahulugan ito na ang mga mapagkompetong site na ito ay dapat na patuloy na sinusubaybayan upang matiyak na walang bagong mga breakpoint na ipinakilala sa merkado na dapat idagdag sa site. Muli, na ang pagkakaiba-iba ng aparato ay kung ano ito, ang pagkakaroon ng patuloy na pag-check para sa mga bagong laki at posibleng tumanggap ng mga ito sa mga bagong breakpoints ay isang patuloy na hamon na may epekto sa trabaho na kailangan mo upang suportahan ang isang site at ang gastos ng pagpapanatili para sa ang kumpanya o organisasyon kung kanino ang site ay para sa.

Pagganap

Ang matagal na disenyo ng web ay matagal nang inakusahan (hindi makatarungang gayon sa maraming kaso) ng pagiging isang mahinang solusyon mula sa bilis ng pag-download / pananaw sa pagganap. Ito ay higit sa lahat dahil sa ang katunayan na sa mga unang araw ng diskarte na ito, maraming mga web designers lamang tacked maliit na screen ng mga query sa media papunta sa isang umiiral na CSS site. Pinilit nito ang mga imahe at mga mapagkukunan na inilaan para sa mas malaking mga screen upang maihatid sa lahat ng mga device, kahit na ang mga mas maliliit na screen ay hindi ginagamit ang mga ito sa kanilang huling mga layout. Ang nakikiramay na disenyo ay dumating sa isang mahabang paraan mula sa mga araw na iyon at ang katotohanan ay ang kalidad na tumutugon mga site ngayon ay hindi magdusa mula sa mga problema sa pagganap.

Ang mga mabagal na bilis ng pag-download at mga tinapa na website ay hindi isang tumutugon na problema sa website - ito ay isang problema na maaaring matagpuan sa lahat ng mga website. Ang mga imahe na masyadong mabigat, mga feed mula sa social media, labis na mga script at higit pa at timbangin ang isang site pababa, ngunit ang parehong tumutugon at mapagkompetong mga website ay maaaring binuo upang maging mabilis-loading. Siyempre , maaari din silang itayo sa isang paraan na hindi ginagawang prayoridad ang pagganap, ngunit hindi ito isang katangian ng solusyon mismo, kundi isang pagmumuni-muni ng pangkat na kasangkot sa pag-unlad ng site mismo.

Higit pa sa Layout

Ang isa sa mga pinaka-nakakahimok na aspeto ng adaptive web design ay hindi lamang ikaw ay may kontrol sa disenyo ng site para sa mga set breakpoints, kundi pati na rin ang mga mapagkukunan na naihatid para sa mga bersyon ng site. Halimbawa, nangangahulugan ito na ang mga retina na imahe ay maipapadala lamang sa mga retina device, habang ang mga non-retina screen ay nakakakuha ng mas angkop na mga imahe na mas maliit sa laki ng file. Ang iba pang mga mapagkukunan ng site (mga file ng Javascript, mga estilo ng CSS, atbp.) Ay maaaring maipadala nang maayos kapag kinakailangan ang mga ito at gagamitin.

Ang paggamit ng adaptive web design napupunta sa kabila ng simpleng equation ng "kung ikaw ay retrofitting sa isang website, ang adaptive ay maaaring maging isang mas madaling diskarte sa paggamit." Ang lahat ng mga site, kabilang ang kumpletong mga muling idisenyo, ay maaaring makinabang mula sa isang mas matalinong diskarte sa isang mas pinasadya na karanasan.

Ang sitwasyong ito ay nagpapakita ng nuanced na likas na katangian ng "tumutugon laban sa adaptive" na debate. Habang totoo na ang isang agpang diskarte ay maaaring maging mas mahusay na angkop kaysa tumutugon para sa mga retrofits ng site, maaari rin itong maging isang mahusay na solusyon para sa buong muling pagdidisenyo. Sa katulad na paraan, sa ilang mga kaso ang isang tumutugon diskarte ay maaaring idagdag sa isang code na base ng umiiral na site, na nagbibigay sa site na iyon ang lahat ng mga benepisyo ng isang ganap na tumutugon diskarte.

Aling Pamamaraan ang Mas Mabuti?

Pagdating sa tumutugon laban sa adaptive web design, walang malinaw na "winner", bagaman ang tumutugon ay tiyak na mas popular na diskarte. Sa katunayan, ang "mas mahusay" na diskarte ay nakasalalay sa mga pangangailangan ng isang partikular na proyekto. Higit pa rito, hindi ito kailangang maging isang "alinman / o" sitwasyon. Mayroong maraming mga propesyonal sa web na nagtatayo ng mga site na pinagsasama ang pinakamahusay na tumutugon sa disenyo ng web (mga lapad ng likido, suporta sa hinaharap) na may mga lakas ng agpang disenyo (mas mahusay na kontrol ng disenyo, matalinong paglo-load ng mga mapagkukunan ng site).

Karaniwang kilala bilang RESS (Responsive Web Design na may Component ng Server Side), ipinakikita ng diskarte na walang tunay na "isang sukat ang naaangkop sa lahat ng solusyon." Ang parehong tumutugon sa disenyo ng web at nakakapag-agpang ay may kanilang mga lakas at mga hamon, kaya kailangan mong matukoy kung alin ay gagana nang husto para sa iyong partikular na proyekto, o kung ang isang hybrid na solusyon ay maaaring maging angkop sa iyo.