Skip to main content

A válaszadók és az adaptív web dizájn közötti különbségek

Beyond Scared Straight: ‘Boy’ Gets a Whole New Meaning (Season 8 Flashback) | A&E (Április 2024)

Beyond Scared Straight: ‘Boy’ Gets a Whole New Meaning (Season 8 Flashback) | A&E (Április 2024)
Anonim

A reagáló és adaptív webes megjelenés mindkét módszer több eszközbarát webhely létrehozására, amelyek jól működnek a különböző méretű képernyőn. Bár a Google ajánlja a megfelelő webes tervezést, és a két megközelítés népszerűbb, mindkét módszer a több eszközű webes tervezéshez erősségeit és gyengeségeit tartalmazza.

Nézzük meg a különbségeket az érzékeny és adaptív webes tervezés között, különös tekintettel ezekre a kulcsfontosságú területekre:

  • Könnyű fejlődés
  • Az irányítás szintje, amellyel a tervezésen túl van
  • A készülék / képernyő támogatásának szélessége
  • A jövőben milyen barátságos megoldás
  • Teljes letöltési sebesség és a webhely teljesítménye

Néhány meghatározás

Mielőtt belevágnánk a reagáló és adaptív webes tervek egymás melletti összehasonlításába, várjunk egy pillanatra, hogy megnézzük e két megközelítés magas szintű definícióját.

A válaszadó webhelyek olyan folyadékelrendezéssel rendelkeznek, amely változik és alkalmazkodik a használt képernyőmérettől függetlenül. A média lekérdezések lehetővé teszik a válaszadó webhelyek számára, hogy akár a böngésző átméretezésén is változtassanak, ha a légy.

Az adaptív kialakítás előre meghatározott felbontási pontokon alapuló rögzített méretek használatával biztosítja a legmegfelelőbb elrendezési verziót az oldal első betöltésekor észlelt képernyőméret számára.

Ezekkel a széleskörű definíciókkal kapcsolatban forduljunk a legfontosabb középpontjainkhoz.

Fejlesztés könnyű

A legmegfelelőbb különbség a reagáló és az adaptív webdesign között olyan módon történik, hogy ezeket a megoldásokat egy weboldalra alkalmazzák. Mivel a reakcióképes kialakítás teljesen folyékony elrendezést hoz létre, a legjobban olyan projekteknél alkalmazható, ahol újból áttervezi a webhelyet. Ha megpróbál egy már meglévő webhelyet átalakítani, hogy reagálhasson, akkor gyakran fáradságos ügy, mert egyszerűen nincs olyan irányítási szint, amely akkor lenne, ha a kódot a semmiből és a megfelelő tervezés figyelembe vételével kezdte a legkorábbi szakaszaiban. ezt a folyamatot. Ez azt jelenti, hogy amikor újratelepít egy webhelyet ahhoz, hogy reagáljon rá, kénytelenek vagyunk kompromisszumokat kötni ahhoz, hogy a létező kódbázisban maradhassunk.

Ha egy meglévő, fix szélességű webhellyel dolgozik, az adaptív megközelítés azt jelenti, hogy elhagyhatja azt a méretet, amelyre a webhelyet sértetlenül tervezték, és szükség szerint további adaptív töréspontokat adhat hozzá. Bizonyos esetekben, ha egy projekt költségvetése kicsi, és ha csak kis mennyiségű fejlesztési munkát vehet igénybe, úgy dönthet, hogy csak új adaptív töréspontokat ad hozzá a kisebb képernyő / mobil centrikus mérethez. Ez azt jelenti, hogy lehetővé tenné, hogy a nagyobb képernyők ugyanazt az elrendezést használják - talán egy 960-as töréspontos verzió, amely az eredetileg erre a helyre lett tervezve.

Az adaptív megközelítés felfelé, hogy jobban kihasználhatja a létező webhely kódját, de az egyik hátránya, hogy különböző elrendezési sablonokat hoz létre minden egyes támogatási pontra vonatkozóan. Ez hatással lesz a megoldás hosszú távú fejlesztésére és fenntartására irányuló munkaterhelésre.

Design Control

A válaszoló webhelyek egyik erőssége, hogy a mozgékonyságuk lehetővé teszi számukra, hogy alkalmazkodjanak és támogassanak minden képernyőméretet, szemben az adaptív megközelítésben meghatározott előre meghatározott határértékekkel. A valóság azonban az, hogy a reagáló oldalak nagyszerűek lehetnek bizonyos kulcsfontosságú képernyőméreteknél (jellemzően a piacon elérhető népszerű eszközöknek megfelelő méretűek), de a vizuális megjelenítés gyakran lebontja ezeket a népszerű felbontásokat.

Például egy webhely nagyszerűen jelenhet meg 1400 képpontos széles képernyős megjelenítéssel, 960 képpontos közepes képernyővel, és a kis képernyő 480 képpontra nézve, de mi a helyzet az ilyen méretek között? Mint tervezők, ezeknek a köztes méreteknek kevéssé lehet ellenőrizni, és az oldal vizuális megjelenése ilyen méretben gyakran kisebb, mint ideális.

Egy adaptív weboldalon sokkal több a tervezési irányítás a különböző elrendezések felett, mivel fix méretűek az Ön által meghatározott töréspontok alapján. Azok a félelmetes köztes államok nem jelentenek többé problémát, mert gondosan megterveztük mindegyiküket, az "észlelés" -t (azaz minden egyes töréspont kijelzőjét), amelyet a látogatóknak szállítanak.

Olyan vonzó, mint ez a tervezési ellenőrzés hangja, tudnia kell, hogy ára van. Igen, teljes pontosan ellenőrizheti minden egyes töréspont megjelenését, de ez azt jelenti, hogy be kell fektetnie a tervezéshez szükséges időt mindegyik egyedi elrendezéshez. Minél több töréspontot választasz a tervezéshez, annál több időt kell majd költeni erre a folyamatra.

Támogatás köre

Mind a rugalmasan reagáló, mind az adaptív webes megoldások nagyszerű támogatást élveznek, különösen a modern böngészőkben.

Az adaptív weboldalak szerver oldali komponenseket vagy a képernyő méretének észleléséhez Javascriptet igényelnek. Nyilvánvaló, hogy egy adaptív webhelynek Javascript-ra van szüksége, ez azt jelenti, hogy a böngészőnek engedélyeznie kell, hogy az adott webhely megfelelően működjön. Ez nem feltétlenül aggodalomra ad okot, mivel a legtöbb embernek van Javascript böngészőjében, de bármikor, ha a webhely kritikusan függ a semmiből, meg kell jegyezni.

A felelős weboldalak és a média lekérdezések, amelyek a hatalmat biztosítják, jól működnek minden modern böngészőben. Az egyetlen probléma az Internet Explorer legrégebbi változatával történik, mivel a 8-as vagy az alatti verziók nem támogatják a médiakérdéseket. Ennek megértéséhez gyakran használnak Javascript polipet, ami azt jelenti, hogy itt is függ a JavaScripttől, legalábbis az IE elavult verzióihoz képest.Ismét ez nem feltétlenül aggodalomra ad okot, különösen, ha weboldalad elemzései azt mutatják, hogy nem sok látogatót kap a régebbi böngészőverziók használatával.

Jövőbarátság

A reagáló weboldalak folyékony természete előnyhöz juttatja őket az alkalmazkodó oldalakkal szemben, amikor a jövőbarátságról van szó. Ez azért van, mert ezek a válaszadó oldalak nem csak egy korábban meghatározott töréspontok befogadására szolgálnak. Alkalmazkodnak az illeszkedéshez minden képernyő , beleértve azokat is, amelyek nem feltétlenül jelen vannak a piacon. Ez azt jelenti, hogy a reagáló webhelyek nem kell "rögzítettnek" lennie, ha az új képernyőfelbontás hirtelen népszerűvé válik.

A készülék tájképének hihetetlen változatosságát vizsgálva (2015. augusztusától több mint 24 000 különálló Android-eszköz található a piacon), mivel egy weboldal, amely mindent megtesz annak érdekében, hogy megfeleljen ennek a széles képernyős képernyőnek, kritikus fontosságú a jövőbeni barátság szempontjából. Ennek az az oka, hogy a táj valószínűleg kevésbé változatos lesz a jövőben, ami azt jelenti, hogy a konkrét képernyőkhöz vagy méretekhez való tervezés lehetetlen lesz, ha még nem jutottunk el a valósághoz.

Az összehasonlító forgatókönyv másik oldalán, ha egy webhely adaptív, és nem fogad el olyan új állásfoglalásokat, amelyek fontos szerepet játszhatnak a piacon, akkor kényszerülhet arra, hogy hozzáadja azt a töréspontot az Ön által létrehozott webhelyekhez. Ez növeli a tervezési és fejlesztési időt a projektekre, és azt jelenti, hogy ezeket az adaptív helyszíneket következetesen ellenőrizni kell annak biztosítására, hogy a piacon nem adjanak új töréspontokat, amelyeket hozzá kell adni a webhelynek. Ismét azzal, hogy a készülék sokszínűsége az, ami az új méretek folyamatos ellenőrzése és azok új töréspontokkal való ellátása, egy olyan folyamatos kihívás, amely hatással lesz a munkára, amelyet támogatnia kell egy webhelynek és a karbantartás költségeinek az a cég vagy szervezet, amelyre a webhely vonatkozik.

Teljesítmény

A felelősségteljes webes tervezést régóta vádolják (igazságtalanul sok esetben), hogy a letöltési sebesség / teljesítmény szempontból rossz megoldás. Ez nagyrészt annak tudható be, hogy a megközelítés kezdetén sok webes tervező egyszerűen a kis méretű média lekérdezéseket vetette fel a webhely meglévő CSS-jére. Ez arra késztette a nagyobb képernyőkre szánt képeket és erőforrásokat, hogy minden eszközre továbbíthatók legyenek, még akkor is, ha ezek a kisebb képernyők nem használják őket a végső elrendezésükben. A reakciókészség hosszú idő óta megy végbe, és a valóság az, hogy a minőségi reagáló oldalak ma nem szenvednek teljesítményproblémákkal.

A lassú letöltési sebességek és a felgyülemlett webhelyek nem érzékeny weboldalak problémája - ez minden webhelyen megtalálható probléma. A túl nehéz képek, a közösségi média, a túlzott forgatókönyvek és egyebek mérése és a webhely lemérése, de a gyorsan reagáló és adaptív webhelyek gyorsan feltölthetők. természetesen , olyan módon is kialakíthatók, hogy a teljesítményt ne tegye prioritássá, de ez nem maga a megoldás vonása, hanem a csapat fejlesztése, amely maga is részt vett a webhely fejlesztésében.

Az elrendezésen túl

Az adaptív webdesign egyik legérdekesebb aspektusa az, hogy nemcsak a webhely megtervezésének vezérlése van a meghatáro- zott töréspontoknál, hanem az ezekhez a webhelyverziókhoz szállított források is. Például ez azt jelenti, hogy a retina képeket csak a retina eszközökre lehet elküldeni, míg a nem retina képernyők a megfelelő méretű képeket kapják, amelyek kisebbek a fájlméretben. Más webhely erőforrásai (Javascript fájlok, CSS stílusok stb.) Csak akkor érhetők el okosan, ha szükség van rá, és felhasználásra kerülnek.

Ez az alkalmazkodó webes tervezés messze túlmutat az egyszerű egyenleten, "ha egy weboldal utólagos felszerelését teszi lehetővé, az alkalmazkodó lehet a könnyebb megközelítés a felhasználáshoz." Az összes webhely, beleértve a teljes újratervezést is, jobban el tudja látni a személyre szabottabb tapasztalatok jobb megoldását.

Ez a forgatókönyv a "reagáló, illetve adaptív" viták színpompás jellegét mutatja be. Bár igaz, hogy egy adaptív megközelítés jobban megfelel, mint a telephelyre való felépítésre reagálva, ez is nagyszerű megoldás a teljes újratervezéshez. Hasonlóképpen, bizonyos esetekben a meglévő webhely kódalapjára egy hozzáértő megközelítést lehet hozzáadni, így a webhely teljes mértékben reagáló megközelítéssel jár.

Melyik módszer jobb?

Amikor a reagáló vagy alkalmazkodó webes megoldásról van szó, nincs egyértelmű "győztes", bár a válaszadók biztosan a népszerűbb megközelítés. Valójában a "jobb" megközelítés egy adott projekt igényeitől függ. Ezenkívül nem kell "vagy / vagy" helyzet. Számos webes szakember dolgozik, akik építenek olyan weboldalakat, amelyek a legmegfelelőbb webdesignot (folyadékszélességet, jövőbeni támogatást) ötvözik az adaptív tervezés erősségeivel (jobb tervezésvezérlés, a webhely erőforrásainak hatékony betöltése).

Általában RESS (Responsive Web Design és Server Side Components) néven ismert, ez a megközelítés azt mutatja, hogy valójában nincs "egy méretre illeszkedik az összes megoldás." Mind a reagáló webes kialakítás, mind az adaptív erőssége és kihívásai vannak, ezért meg kell határozni, melyik a legjobban működik az adott projekthez, vagy hibrid megoldás valóban megfelel Önnek.