Wat is responsiewe ontwerp? (Explainer Video en Infographic)

responsiewe webontwerp

Dit neem 'n dekade vir responsiewe webontwerp (RWD) om sedertdien hoofstroom te maak Cameron Adams die eerste keer bekendgestel die konsep. Die idee was vernuftig - waarom kan ons nie webwerwe ontwerp wat aanpas by die aansig van die toestel waarop dit gekyk word nie?

Wat is responsiewe ontwerp?

Responsive web design (RWD) is 'n webontwerpbenadering wat daarop gemik is om webwerwe te skep om 'n optimale kykervaring te bied - maklike lees en navigasie met 'n minimum grootte, skuif en blaai - oor 'n wye verskeidenheid toestelle (van selfone tot desktop rekenaars) monitors). 'N Webwerf ontwerp met RWD pas die uitleg aan by die kykomgewing met behulp van vloeibare, proporsionele roosters, buigsame beelde en CSS3-media-navrae, 'n uitbreiding van die @media-reël.

Wikipedia

Met ander woorde, elemente soos beelde kan aangepas word, sowel as die uitleg van die elemente. Hier is 'n video wat verduidelik wat responsiewe ontwerp is, asook waarom u onderneming dit moet implementeer. Ons het onlangs die DK New Media werf reageer en nou werk daaraan Martech Zone om dieselfde te doen!

Die metodiek om 'n werf te reageer, is 'n bietjie vervelig, want u moet 'n hiërargie hê in u style wat georganiseer is op grond van die grootte van die uitsig.

Blaaiers is selfbewus van die grootte daarvan, en laai die stylblad van bo na onder en vra die toepaslike style vir die grootte van die skerm. Dit beteken nie dat u verskillende stylblaaie vir elke grootte skerm moet ontwerp nie, u moet net die nodige elemente skuif.

Om met 'n mobiele eerste mentaliteit te werk, is vandag die standaard. Beste handelsmerke dink nie net daaraan of hul webwerf selfoonvriendelik is nie, maar ook oor die volledige kliënte-ervaring.

Lucinda Duncalfe, uitvoerende hoof van Monetate

Hier is 'n infografie van Monetate wat die potensiële voordele van die skep van een responsiewe ontwerp vir verskeie toestelle illustreer:

Responsiewe webontwerpinfografie

Wys u 'n responsiewe webwerf in aksie Google Chrome blaaier (ek glo Firefox het dieselfde funksie) DK New Media. Kies nou Bekyk> Ontwikkelaar> Ontwikkelaarhulpmiddels vanaf die spyskaart. Dit laai 'n klomp gereedskap onder in die blaaier. Klik op die klein mobiele ikoon heel links van die menubalk vir ontwikkelaarhulpmiddels.

reageer-toets-chroom

U kan die navigasie-opsies bo-op gebruik om die aansig van landskap na portret te verander, of selfs enige aantal voorafgeprogrammeerde aansiggroottes van die aansigportaal kies. Miskien moet u die bladsy herlaai, maar dit is die coolste hulpmiddel ter wêreld om u responsiewe instellings te verifieer en te verseker dat u werf op alle toestelle goed lyk!

3 Comments

  1. 1
  2. 2

    Baie dankie Douglas vir hierdie goed verduidelikde artikel. Ek moet hiermee saamstem, maar aan die inhoudelike kant van die saak. Vir die meeste van die webwerwe sal ons nie genoeg reageer nie. Ons het responsiewe inhoud nodig. Maar vir die meer basiese webwerwe, sal ons u goed gedokumenteerde artikel gebruik om dit te hanteer!

Wat dink jy?

Hierdie webwerf gebruik Akismet om spam te verminder. Leer hoe jou opmerking verwerk is.