Kas yra reaguojantis interneto dizainas?

Suprasti lankstų interneto svetainių kūrimą

TurinysIšskleisti

Visame pasaulyje naudojami milijonai įrenginių – nuo ​​planšetinių kompiuterių iki telefonų iki didelių stalinių kompiuterių. Įrenginių naudotojai nori sklandžiai peržiūrėti tas pačias svetaines bet kuriame iš šių įrenginių. Responsive svetainės dizainas yra metodas, naudojamas siekiant užtikrinti, kad svetaines būtų galima peržiūrėti visų dydžių ekranuose, neatsižvelgiant į įrenginį.





Kas yra reaguojantis svetainės dizainas?

Atsakingas interneto svetainės dizainas yra metodas, leidžiantis svetainės turinį ir bendrą dizainą perkelti ir keisti, atsižvelgiant į įrenginį, kurį naudojate jį peržiūrėti. Kitaip tariant, reaguoja svetainė į įrenginį ir atitinkamai pateikia svetainę.

Pavyzdžiui, jei pakeisite šio lango dydį dabar, Lifewire svetainė pasislinks ir pasislinks, kad atitiktų naują lango dydį. Jei atidarysite svetainę savo mobiliajame įrenginyje, pastebėsite, kad mūsų turinio dydis bus pakeistas į vieną stulpelį, kad jis atitiktų jūsų įrenginį.



Trumpa istorija

Nors kiti terminai, tokie kaip sklandus ir lankstus, buvo vartojami jau 2004 m., interaktyvų interneto dizainą pirmą kartą sugalvojo ir 2010 m. pristatė Ethanas Marcotte'as. Jis manė, kad svetainės turi būti sukurtos atsižvelgiant į „atoslūgius ir atoslūgius“, o ne išlikti statiškos.

Po to, kai jis paskelbė savo straipsnį ' Reaktyvus interneto dizainas “, terminas įsibėgėjo ir pradėjo įkvėpti žiniatinklio kūrėjus visame pasaulyje.



Kaip veikia reaguojanti svetainė?

Interaktyvios svetainės sukurtos taip, kad būtų galima koreguoti ir keisti dydį tam tikrais dydžiais, dar vadinamais lūžio taškais. Šie lūžio taškai yra naršyklės pločiai, turintys specifinį CSS medijos užklausa kuris pakeičia naršyklės išdėstymą, kai ji patenka į tam tikrą diapazoną.

Dauguma svetainių turės dvi standartines pertraukos taškus tiek mobiliesiems įrenginiams, tiek planšetiniams kompiuteriams.

Dvi moterys žiūri svetainę nešiojamajame kompiuteryje ir dideliame ekrane

Maskot / Getty Images

Paprasčiau tariant, kai keičiate naršyklės plotį, kai keičiate jos dydį arba peržiūrite ją mobiliajame įrenginyje, gale esantis kodas reaguoja ir automatiškai pakeičia išdėstymą.



Kodėl jautrus dizainas yra svarbus?

Moteris, laikanti išmanųjį telefoną ir žiūrinti į interneto dizaino idėjas lentoje

Westend61 / Getty Images

Dėl savo lankstumo interaktyvus interneto dizainas dabar yra auksinis standartas, kai kalbama apie bet kurią svetainę. Bet kodėl tai taip svarbu?



    Patirtis vietoje: Interaktyvus žiniatinklio dizainas užtikrina, kad svetainės bet kuriam interneto vartotojui, nepaisant naudojamo įrenginio, būtų sklandžiai ir kokybiški.Turinio dėmesys: mobiliųjų įrenginių naudotojams interaktyvus dizainas užtikrina, kad jie pirmiausia matytų tik patį svarbiausią turinį ir informaciją, o ne tik mažą fragmentą dėl dydžio apribojimų.„Google“ patvirtinta: Interaktyvus dizainas leidžia „Google“ lengviau priskirti puslapiui indeksavimo ypatybes, o ne indeksuoti kelis atskirus puslapius atskiriems įrenginiams. Žinoma, tai pagerina jūsų paieškos variklio reitingą, nes „Google“ šypsosi svetainėms, kurios yra pirmiausia skirtos mobiliesiems.Produktyvumo taupymo priemonė: Anksčiau kūrėjai turėjo kurti visiškai skirtingas svetaines staliniams ir mobiliesiems įrenginiams. Dabar interaktyvus žiniatinklio dizainas leidžia atnaujinti vienos svetainės turinį, palyginti su daugybe svetainių, taip sutaupant labai daug laiko.Geresni konversijų rodikliai: Įrodyta, kad įmonėms, bandančioms pasiekti savo auditoriją internete, interaktyvus žiniatinklio dizainas padidina konversijų rodiklius ir padeda plėsti verslą.Padidintas puslapio greitis: Svetainės įkėlimo greitis tiesiogiai paveiks vartotojo patirtį ir paieškos variklio reitingą. Interaktyvus žiniatinklio dizainas užtikrina, kad puslapiai vienodai greitai įkeliami visuose įrenginiuose, o tai teigiamai paveiks reitingą ir patirtį.

Reaktyvus dizainas realiame pasaulyje

Kaip interaktyvus dizainas veikia interneto vartotojus realiame pasaulyje? Apsvarstykite mums visiems pažįstamą veiksmą: apsipirkimą internetu.

Pavaizduokite, kad naudojatės nešiojamuoju kompiuteriu, kad apsipirktumėte internetu, o šalia mobiliojo įrenginio užsirašytumėte užrašus

Westend61 / Getty Images



Per pietų pertrauką vartotojas gali pradėti produktų paiešką darbalaukyje. Suradę prekę, kurią ketina įsigyti, jie įdeda jį į krepšelį ir grįžta į darbą.

Daugelis vartotojų nori perskaityti atsiliepimus prieš pirkdami. Taigi, vartotojas vėl apsilanko svetainėje, šį kartą planšetiniu kompiuteriu namuose, kad perskaitytų produkto apžvalgas. Tada jie turi vėl palikti svetainę, kad galėtų tęsti savo vakarą.



Prieš išjungdami šviesą tą naktį, jie paima mobilųjį įrenginį ir vėl apsilanko svetainėje. Šį kartą jie pasiruošę atlikti galutinį pirkinį.

Interaktyvus žiniatinklio dizainas užtikrina, kad vartotojas gali ieškoti produktų staliniame kompiuteryje, skaityti atsiliepimus planšetiniame kompiuteryje ir sklandžiai apsipirkti mobiliuoju telefonu.

Kiti realaus pasaulio scenarijai

Apsipirkimas internetu yra tik vienas scenarijus, kai interaktyvus dizainas yra labai svarbus norint naudotis internetu. Kiti realaus pasaulio scenarijai apima:

  • Planuoja keliones
  • Ieškau naujo būsto įsigyti
  • Šeimos atostogų idėjų tyrinėjimas
  • Ieško receptų
  • Sekite naujienas ar socialinę žiniasklaidą

Tikėtina, kad kiekvienas iš šių scenarijų laikui bėgant apims daugybę įrenginių. Tai pabrėžia interaktyvaus svetainės dizaino svarbą.