Wat is Responsive Design? (Explainer Video en Infographic)

responsive webûntwerp

It hat in desennium duorre foar responsive webûntwerp (RWD) om sûnt mainstream te gean Cameron Adams yntrodusearre earst it konsept. It idee wie yngenieus - wêrom kinne wy ​​gjin siden ûntwerpe dy't oanpasse oan 'e werjeftepoarte fan it apparaat wêrop it wurdt besjoen?

Wat is Responsive Design?

Responsive web design (RWD) is in oanpak fan webûntwerp rjochte op it meitsjen fan siden om in optimale kijkervaring te leverjen - maklik lêzen en navigaasje mei in minimum fan grutte, panning en scrollen - oer in breed skala oan apparaten (fan mobile tillefoans oant buroblêdcomputer monitors). In side ûntwurpen mei RWD past de yndieling oan oan 'e werjefteomjouwing troch floeiende, proporsjoneel basearre roosters, fleksibele ôfbyldings, en CSS3 media-fragen te brûken, in útwreiding fan' e @media-regel.

Wikipedy

Mei oare wurden, eleminten lykas ôfbyldings kinne oanpast wurde lykas de opmaak fan dy eleminten. Hjir is in fideo dat ferklearret wat responsyf ûntwerp is en ek wêrom jo bedriuw it moat ymplementearje. Wy hawwe koartlyn de DK New Media side om responsyf te wêzen en no wurkje oan Martech Zone itselde te dwaan!

De metodyk foar it bouwen fan in side-responsive is in bytsje ferfeelsum, om't jo in hiërargy moatte hawwe oan jo stilen dy't binne organisearre op basis fan 'e grutte fan' e werjefte.

Browsers binne har bewust fan har grutte, sadat se it stylblêd fan boppen nei ûnderen lade, en freegje de oanbelangjende stilen foar de grutte fan it skerm. Dit betsjuttet net dat jo ferskate stylblêden moatte ûntwerpe foar elke grutte skerm, jo ​​moatte gewoan de nedige eleminten ferpleatse.

Operearje mei in mobile-earste mentaliteit is hjoed de basisline standert. Best-in-class merken tinke net allinich oer oft har side mobylfreonlik is, mar oer de folsleine klantûnderfining.

Lucinda Duncalfe, CEO fan Monetate

Hjir is in infografyk fan Monetate dy't de potensjele foardielen fan it meitsjen fan ien responsyf ûntwerp foar meardere apparaten yllustreart:

Responsive webûntwerp Infographic

As jo ​​in responsive side yn aksje wolle sjen, wizigje jo dan Google Chrome browser (ik leau dat Firefox deselde funksje hat) nei DK New Media, Selektearje no Sjoch> Untwikkelder> Untwikkelders ark út it menu. Dit sil in bosk ark lade oan 'e ûnderkant fan' e browser. Klikje op it lytse mobile ikoan helemaal links fan 'e menubalke Developer Tools.

responsive-testen-chrome

Jo kinne de navigaasje-opsjes boppe-op brûke om de werjefte fan lânskip nei portret te feroarjen, of sels in oantal foarprogrammeare werjefportgrutte te selektearjen. Jo moatte miskien de side opnij lade, mar it is it coolste ark yn 'e wrâld om jo responsive ynstellingen te kontrolearjen en derfoar te soargjen dat jo side op alle apparaten geweldich sjocht!

3 Comments

  1. 1
  2. 2

    Tige tank Douglas foar dit goed útlein artikel. Ik moat hjir wol mei iens wêze oan 'e ynhâldkant fan' e dingen. Foar de measte siden meitsje wy in responsive opmaak sil net genôch wêze. Wy hawwe responsive ynhâld nedich. Mar foar de mear basale websides sille wy grif jo goed dokuminteare artikel brûke oer hoe dit te behanneljen is!

Wat tinksto?

Dizze side brûkt Akismet om spam te ferleegjen. Learje hoe't jo kommentaargegevens ferwurke wurde.