Ang Mga Kalainan Tali sa Responsive ug Adaptive Web Design

Pagpaanggid sa Duha ka nagkalainlain nga pamaagi sa Web Design nga Multi-Device

Ang responsive ug mapahiangay nga disenyo sa web mao ang duha ka pamaagi alang sa pagmugna sa multi-device nga mahigalaong mga website nga maayo ang pagtrabaho sa nagkalainlaing mga gidak-on sa screen. Samtang ang girekomenda nga disenyo sa web girekomenda sa Google ug mao ang mas popular sa duha ka mga pamaagi, ang duha niini nga mga pamaagi alang sa multi-device nga disenyo sa web adunay mga kalig-on ug mga kahuyang niini.

Atong tan-awon ang mga kalainan tali sa responsive ug mapahiangay nga disenyo sa web, ilabi na nga nagpunting sa mga importante nga mga dapit:

Pipila ka Kahulugan

Sa dili pa kita moapil sa atong mga pagtandi sa mga responsive ug mapahiangay nga disenyo sa web, us aka panahon sa pagtan-aw sa taas nga kahulugan sa duha niining mga pamaagi.

Ang mga responsable nga mga website adunay usa ka fluid layout nga nag-usab ug nagpahiangay bisan unsa ang gigamit sa gidak-on sa screen. Ang mga pangutana sa media nagtugot sa mga responsive nga mga site sa pagbag-o "sa langaw" kon ang browser adunay sukaranan.

Ang adaptive design naggamit sa mga gidak-on nga gidak-on base sa gitakda nga mga breakpoint aron mahatag ang labing tukma nga bersyon sa layout alang sa gidak-on sa screen nga nakit-an sa diha nga ang pahina nag-load.

Uban sa mga lapad nga mga kahulogan sa dapit, atong ibalik ang atong importanting mga lugar nga gitutukan.

Dali nga Pagpalambo

Ang labing mahinungdanon nga kalainan tali sa responsive ug mapahiangay nga disenyo sa web mao ang paagi nga kini nga mga solusyon gipadapat sa usa ka website. Tungod kay ang responsive nga disenyo naglangkob sa usa ka hingpit nga likido nga layout, mas maayo kini nga gigamit sa mga proyekto diin imong giraha pag-desinyo ang site gikan sa ibabaw . Ang pagtinguha sa pag-usab sa code sa kasamtangan nga website nga mahimong responsive sagad usa ka malisud nga kalihokan tungod kay ikaw walay yano nga pagkontrol nga imong makuha kon imong gipalambo ang maong code gikan sa sinulat ug gikuha ang responsableng desinyo alang sa unang mga hugna sa proseso . Kini nagpasabot nga sa dihang imong gibag-o ang usa ka site nga mahimong responsive, napugos ka paghimo sa pagkompromiso aron magpabilin sulod sa kasamtangan nga codebase.

Kon nagtrabaho ka sa usa ka kasamtangan nga fixed-width website, usa ka mapadayunon nga pamaagi nagpasabot nga imong mabiyaan ang gidak-on nga ang site gidesinyo alang sa wala ug pagdugang sa dugang nga mga mapakgang nga mga breakpoint kung gikinahanglan. Sa pipila ka mga kaso, kon ang badyet sa usa ka proyekto gamay ra, ug kung kini maka-accommodate lamang sa gamay nga buluhaton sa pag-uswag, mahimong pilion nimo ang pagdugang lamang sa mga bag-ong adaptive breakpoints alang sa gagmay nga screen / mobile-centric nga gidak-on. Kini nagpasabot nga imong tugotan ang mas dako nga mga tableta sa tanan nga paggamit sa susama nga layout - tingali usa ka 960 nga breakpoint nga bersyon nga mao ang giandam sa orihinal nga dapit.

Ang kutob sa usa ka mapahiangay nga pamaagi mao nga mahimo nimo nga mas maayo ang usa ka kodigo sa kasamtangan nga site, apan ang usa sa mga kasabutan mao nga imong gimugna ang lain-laing mga templates sa layout alang sa matag breakpoint nga imong gipili nga suportahan. Kini nga adunay epekto sa workload nga gikinahanglan sa pagpalambo ug pagmentinar niini nga solusyon sa dugay nga panahon.

Pagkontrol sa Disenyo

Ang usa sa mga kalig-on sa mga responsive nga mga website mao nga ang ilang kahilig nga nagtugot kanila sa pagpahiangay ug pagsuporta sa tanang mga gidak-on sa screen nga sukwahi sa mga pre-set breakpoint nga gitino sa usa ka mapadayunon nga paagi. Ang kamatuoran, bisan pa niana, mao nga ang mga responsive nga mga site mahimo nga makita sa mga gidak-on sa gidak-on nga mga screen (kasagaran mga gidak-on nga nahisubay sa popular nga mga himan nga anaa sa merkado), apan ang visual design sa kasagaran nadaut tali sa mga popular nga resolusyon.

Pananglitan, ang usa ka site mahimong nindot tan-awon sa lapad-screen nga layout sa 1400 ka pixel, ang mid-screen nga gidak-on sa 960 ka pixel, ug ang gamay nga screen motan-aw sa 480 ka pixel, apan komosta ang sulod sa mga estado niini nga mga gidak-on? Ingon sa usa ka tigdesinyo, wala ka'y ​​pagkontrol sa mga kini nga mga gidak-on ug ang makita nga panid sa panid sa mga gidak-on mao ang kanunay dili kaayo maayo.

Uban sa usa ka mapahiangay nga website, adunay daghan ka nga pagdumala sa disenyo sa lainlaing mga layout nga gigamit tungod kay kini ang mga gidak-on nga gidak-on pinasukad sa imong mga gitakdang mga breakpoint. Kadtong dili maayo sa taliwala nga mga estado dili na problema tungod kay imong girekomenda pag-ayo ang matag "pagtan-aw" (nagpasabot sa matag pasundayag sa breakpoint) nga ipadala ngadto sa mga bisita.

Ingon nga madanihon ingon nga kini nga ang-ang sa pagdumala sa disenyo mahimo nga maayo, ikaw kinahanglan nga mahibalo nga kini moabut sa usa ka bili. Oo, hingpit ka nga pagkontrolar sa pagtan-aw sa matag breakpoint, apan nagpasabot nga imong kinahanglan nga mamuhunan sa panahon nga gikinahanglan aron magplano alang sa matag usa niining talagsaon nga mga hut-ong. Kon daghan ka nga breakpoints nga imong gipili nga buhaton, mas daghang oras nga imong gikinahanglan sa paggahin niana nga proseso.

Sukaranan sa Pagpaluyo

Ang duha ka responsive ug adaptive web design nalingaw og maayo nga suporta, ilabi na sa modernong mga browser.

Ang mga agianan sa adaptive nga mga website nagkinahanglan sa bisan hain nga sangkap sa server o Javascript alang sa pagkakita sa gidak-on sa screen Dayag, kung ang usa ka lugar nga mapakatap adunay gikinahanglan nga Javascript, kini nagpasabot nga ang usa ka browser kinahanglan nga makapahimo niini aron nga ang site magtrabaho sa husto nga paagi. Kana dili mahimo nga usa ka dako nga kabalaka kanimo tungod kay kadaghanan sa mga tawo adunay Javascript sa ilang mga browsers, apan sa bisan unsa nga panahon nga ang usa ka site adunay usa ka mahinungdanon nga pagsalig sa bisan unsang butang, kini kinahanglan nga makita.

Ang mga responsable nga mga website ug ang mga pangutana sa media nga makahatag kanila og gahum sa tanan nga mga modernong mga browser. Ang bugtong mga problema nga imong maangkon mao ang labing karaan nga bersyon sa Internet Explorer tungod kay ang mga bersyon 8 ug sa ubos wala mosuporta sa mga pangutana sa media . Sa pagtrabaho sa palibot niini , ang usa ka polyfill sa Javascript sagad gigamit , nga nagpasabot nga adunay pagsalig sa Javascript dinhi ingon man, labing menos alang sa mga kuno nga bersyon sa IE. Usab, kini dili tingali kabalaka alang kanimo, ilabi na kon ang analytics sa imong site nagpakita nga wala ka makadawat sa daghang mga bisita nga naggamit sa mga daan nga bersyon sa browser.

Pag-abiabi sa Umaabot

Ang likido nga kinaiya sa mga responsive nga mga website naghatag kanila og bentaha sa mga mapahiangay nga mga dapit kabahin sa umaabut nga pagkamahigalaon. Kini tungod kay dili matukod ang mga mitubag nga mga site aron sa pagdawat lamang sa kanhi gitukod nga mga breakpoint. Sila mopahiangay aron mahiangay sa tanan nga mga talan-awon , lakip na kadtong dili tinuod nga anaa sa merkado karon. Kini nagpasabot nga ang mga responsive nga mga site dili kinahanglan nga "husto" kon ang usa ka bag-ong resolusyon sa screen kalit nga nahimong popular.

Sa pagtan-aw sa talagsaon nga matang sa device landscape (ingon sa Agosto 2015, adunay kapin sa 24,000 ka lain-laing mga Android device sa merkado), adunay usa ka site nga ang labing maayo sa pag-accommodate niini nga nagkalain-laing mga screens importante kaayo alang sa kaugmaon-pagkamahigalaon. Kini tungod kay ang talan-awon dili tingali magkagamay sa umaabot, nga nagpasabot nga ang pag-desinyo alang sa mga partikular nga talan-awon o gidak-on mahimong imposible, kon wala pa nato makab-ot ang maong kamatuoran.

Sa pikas nga kilid niining sitwasyon sa pagkomparar, kung ang usa ka site mao ang mapasibo ug kini dili maka-accommodate sa mga bag-ong resolusyon nga mamahimong importante sa merkado, nan mahimo nga mapugos ka nga idugang ang breakpoint sa mga site nga imong gibuhat. Kini nagdugang sa pagdisenyo ug pag-uswag sa mga proyekto ngadto sa mga proyekto ug kini nagpasabot nga ang mga mapahiangay nga mga site kinahanglan kanunay nga pagmonitor aron maseguro nga walay bag-ong mga breakpoint nga gipaila sa merkado nga kinahanglan idugang ngadto sa site. Pag-usab, uban sa nagkalainlain nga lihok sama sa unsa kini, ang kanunay nga pagsusi alang sa mga bag-ong gidak-on ug posible nga pag-accommodate kanila uban ang bag-ong mga breakpoints usa ka nagpadayon nga hagit nga adunay epekto sa trabaho nga kinahanglan nimo aron pagsuporta sa usa ka site ug ang kantidad sa pagmentinar alang sa ang kompaniya o organisasyon nga gigamit alang sa site.

Pagganap

Dugay na nga giakusahan ang responsive web design (dili makatarunganon sa daghang mga kaso) nga usa ka dili maayo nga solusyon gikan sa download speed / performance point. Kini tungod sa kamatuoran nga sa unang mga adlaw sa niini nga pamaagi, daghang mga tigdisenyo sa web ang nagsagop lamang sa mga pangutana sa gamay nga screen media ngadto sa usa ka CSS nga anaa sa site. Kini nagpugos sa mga hulagway ug mga kapanguhaan alang sa mas dako nga mga screen nga ipadala ngadto sa tanan nga mga himan, bisan kon ang gagmay nga mga screens wala magamit kini sa ilang katapusan nga mga hut-ong. Ang maayo nga desinyo dugay na nga nahanaw sukad niadtong mga adlawa ug ang kamatuoran mao nga ang mga kalidad nga mga responsive nga mga site karon wala mag-antus sa mga problema sa paghimo.

Hinay nga pag-download sa mga katulin ug mga gipamulpa nga mga website dili usa ka responsive nga website nga problema - usa kini ka suliran nga makita sa tanang mga website. Ang mga hulagway nga hilabihan ka bug-at, gipakaon gikan sa social media, sobra nga mga script ug daghan pa ug gibug-aton ang usa ka site, apan ang mga responsive ug mapahiangay nga mga website mahimong matukod aron mahimong dali nga pagkarga. Siyempre , mahimo usab kini nga gitukod sa usa ka paagi nga dili paghimo sa paghimo nga usa ka prayoridad, apan kini dili usa ka kinaiya sa solusyon mismo, apan usa ka pagpamalandong sa tim nga nalangkit sa pagpalambo sa site mismo.

Gawas sa Layout

Usa sa pinakamaayo nga aspeto sa adaptive web design mao nga dili lamang ikaw adunay kontrol sa disenyo sa site alang sa set breakpoints, apan usab ang mga kapanguhaan nga gihatag alang sa mga bersyon sa site. Pananglitan, kini nagpasabot nga ang mga retina nga mga larawan mahimong ipadala lamang sa retina devices, samtang ang non-retina screens adunay mas tukma nga mga larawan nga mas gamay sa gidak-on sa file. Ang ubang mga kahinguhaan sa site (mga file sa Javascript, estilo sa CSS, ug uban pa) mahimong maantigo nga maabot lamang kung kini gikinahanglan ug gamiton.

Kini nga paggamit sa adaptive web design mas labaw pa sa yano nga equation sa "kung ikaw mag-retrofite sa usa ka website, ang mapahiangay nga paagi mahimong mas sayon ​​nga paagi sa paggamit." Ang tanan nga mga site, lakip ang kompleto nga pag-usab sa disenyo, makabenepisyo gikan sa mas maalamon nga pamaagi sa mas tukma nga kasinatian.

Kini nga sitwasyon nagpakita sa nuanced nga kinaiya niining "responsive versus adaptable" debate. Bisan tuod nga ang usa ka mapailin-ilinon nga pamaagi mahimong mas maayo nga himuyon kay sa responsive alang sa mga retrofits sa site, mahimo usab kini nga usa ka maayo nga solusyon alang sa hingpit nga mga pag-usab nga disenyo. Sa susama, sa pipila ka mga kaso ang usa ka sanong nga pagduol mahimo nga idugang ngadto sa kodigo nga base sa kasamtangan nga site, nga maghatag sa maong site sa tanang mga benepisyo sa usa ka hingpit nga pagsanong.

Unsang Paagi ang Mas Maayo?

Kon mahitungod sa responsive versus nga adaptive web design, wala'y tin-aw nga "winner", bisan pa nga ang responsive mao ang mas popular nga paagi. Sa pagkatinuod, ang "mas maayo" nga pamaagi nag-agad sa mga panginahanglan sa usa ka piho nga proyekto. Dugang pa, kini dili kinahanglan nga usa ka "bisan / o" sitwasyon. Adunay daghang mga propesyonal sa web nga nagtukod sa mga site nga nagsagol sa labing maayo nga responsive web design (mga gilapdon sa fluid, suporta sa umaabot) uban sa kalig-on sa mapahiangay nga disenyo (mas maayo nga pagkontrol sa disenyo, maayong pagkarga sa mga kapanguhaan sa site).

Ang kasagaran nga nailhan nga RESS (Responsive Web Design uban sa Server Side Components), kini nga paagi nagpakita nga walay usa ka "usa ka sukod nga mohaum sa tanang solusyon." Ang duha nga responsive web design ug adaptif adunay ilang mga kalig-on ug mga hagit, mao nga kinahanglan nimong mahibal-an magtrabaho nga labing maayo alang sa imong piho nga proyekto, o kon ang usa ka hybrid nga solusyon mahimong labing maayo nga mohaum kanimo.