Skálázhatóság és típusú web design, geekbrains - learning portál programozók

Próbáld megérteni, mik a lehetőségek ki a mintát a helyszínen.

10-15 évvel ezelőtt nem volt ilyen sokszínűség és a monitorok száma. Ezért fejleszteni tervez honlapok volt könnyű. Létrehoz egy közönséges statikus tervezés, hogy a rögzített szélességű a képernyő, és biztos lehet benne, - a felhasználók többsége fogja látni a helyén oly módon tervezték.

Mostanáig, akkor találkozhat több változatát is, hogyan kell érteni a „alkalmazkodó design” különféle IT-szakemberek. Próbáljuk kitalálni, hogy mi vagyunk a fejlesztési lehetőségeiről design a helyén.

statikai tervezés

„Steady-state” vagy „statikus” kifejezés helyén áll, hogy a megváltoztathatatlan HTML-oldalakat. Ez az oldal azt jelenti, fix téma fix szélességű, és gyakran egy vagy csak néhány oldalra. Megjelenítéséhez az oldalon a vászon közepe elég 1000 px. Tartalom mindig igazodik pontosan a közepén.

Azt is érdemes figyelembe venni, hogy a frissítés a statikus oldal csak egy személy, egy jó web fejlesztési tapasztalat. Ebben nincs admin felületen, tehát minden változás történhet a forráskódot.

Az előnyök a statikai tervezés:

Hátrányai statikai tervezés:

• Mobil eszközt csatlakozni fog megjelenni a vízszintes görgetősáv;
• Szélesvásznú monitorok statikai tervezés meglehetősen kopott - nem alternatíva azok számára, akik igyekeznek hatékonyan.

Statikus oldalak szokott lenni még sok más - a kialakulását és fejlődését a CMS hozzájárult csökkentését számuk mellett a dinamikus. Példák statikus weboldalak:

dinamikus dizájn

„Adaptív tervezés - az egyik legfontosabb trendek a fejlesztés a helyszínek, hogy azért jött, hogy maradjon” - ilyen címek most tele szinte minden oldalon szentelt webfejlesztés és webdesign. Ismerje meg, mi is ez, nem nehéz. Azonban vannak olyan finomságok, amelyek befolyásolják a megértés és felfogás ilyen design. Nézzük meg őket.

"Rubber" design

A fő jellemzője a tervezés, hogy az oszlop szélességét megadott százalékában, és nem a pixel. Ezért a „gumi” kialakítás minden képernyőfelbontás van nyújtva teljes képernyő szélességének. Ahhoz, hogy egy ilyen terv, különösen akkor, ha a blokk elrendezés némileg bonyolultabb, mint a rögzített, de a felhasználó nem fogja látni az üres mezőt az oldalon. Érdemes megjegyezni, hogy a design a gumi A kezdetben meglehetősen széles körben használják RuNet, míg a fejlesztők a nyugati sokáig elkötelezett maradt a statikai tervezés.

Érzékeny tervezés

Az adaptív tervezése indokolt létrehozni nagyszabású projektek: információs portálok, online boltok, fórumok, vállalati oldalak, és egyéb hasonló források. Különösen hatékony nézi a monitort, átlós legalább 15,6 „”.

alkalmazkodóképesség elv azon alapul, hogy hozzanak létre egy egységes URL, amely alkalmazkodik a tartalmat különböző képformátumok között. példák:

Lásd, hogy az elrendezés a szöveg és a képek különböző képernyőkön. Miért van ez jó? Ennek egyik oka - Google előnyben részesíti ezeket a forrásokat a keresési eredmények között. A másik ok - ezek az oldalak könnyebb tervezni és fenntartani, és ez megkönnyíti a munkát a sok ember.

„Adaptív” design

Az utolsó módszer, elérte a webes tervezők, hogy „érzékeny” design (Eng. Érzékeny tervezés), amely ellensúlyozni a hagyományos „alkalmazkodó” design (Eng. Adaptive tervezés), bár a mai napig ezek a kifejezések gyakran zavaros és fogyasztott hasonló módon. „Adaptív” design egyesíti a funkciók adaptív és a „gumi” design. Ez automatikusan alkalmazkodik bármilyen szélessége a képernyőn, valamint a gumi. Ebben az esetben, kiigazítás az eljárás változhat blokkok helyét, méretű képek. Ők is megjelennek, eltűnnek vagy változtatni néhány elemet. Példának okáért a vízszintes menü megváltoztathatja a legördülő menüben.

Egy még fontosabb pont - egy hely, ahonnan az emberek jönnek a webhelyen. Ezért nagyon fontos, hogy figyelembe veszi az internet sebessége, mert az emberek nagy számban élnek a távoli területeken, ahol az internet sebessége nem is 1 Mb / s. Van egy tanulmányt, amely szerint 57% a felhasználó elhagyja a webhely, ha be van töltve több mint egy pár másodpercig. Nem is olyan régen, a Google elkezdte figyelembe venni a sebességet, amikor rangú telek. Nem nagy hatással helyzetéről szóló oldalak átlagos letöltési sebesség, de ha az oldal nem töltődik be egy ideig, a keresési algoritmus szankciókat alkalmaz egy ilyen oldal.

Mindez arra készteti bennünket, hogy egy közelebbi pillantást a sebesség az internet, és lehetővé teszi a felhasználók számára letölthető tartalom elég gyorsan a legtöbb alacsony sebességgel. Ez „reagáló” design - ez nem csak a történet méretben kapható, de a különböző forgatókönyvek, melyek megoldások rugalmas legyen, és jól átgondolt „és”.

Területek, ahol lehet látni a „reagáló” (reagáló) tervezési akcióban:

Előnyei dinamikus design:

• Finomítani, és frissítse az elemek ilyen forrás bármikor, anélkül, hogy módosítsa az összes oldalt.
• Fejleszteni skálázható hely egyaránt lehet nulla, kézzel téve a szükséges szkripteket, programkód, és így tovább. És használja a CMS.
• Az adaptív tervezés könnyen módosítható, figyelembe véve nemcsak a kívánságait az ügyfél, hanem a vonatkozó követelményeknek az ipar, az új programozási lehetőségek az objektív körülmények. Minden beállítás keresztül adminpanel szerkesztése nélkül kódfájlokhoz.
• Lehetőségek web designer, hogy működjön együtt a dinamikus hely korlátozott, csak a képzelete.

Hátrányai dinamikus design:

• Ahhoz, hogy hozzon létre egy jó „gumi” helyszínek elég izzadság - ez a feladat nem a lusta és megköveteli, hogy bizonyos készségek a web designer;
• A szélesvásznú monitorok túl hosszú sorokat tartalom olvasható - meg kell, hogy folyamatosan gondolkodni, hogyan lehet javítani a felfogása a felhasználói adatokat.

By the way, itt megpróbáltuk bizonyítani a különbség a fajta kialakítás. Próbálja kiválasztani egyet a 4 lehetőséget és poizmenyat szélessége a böngésző ablakot. Itt, az adaptív - adaptív tervezése, folyadék - gumi, reagáló - reagál, és statikus - statikus.