Tidlige webutviklere måtte ikke bekymre seg mye over å designe nettsteder som brukere ville se dem på datamaskiner og de datamaskinene hadde en fast skjermoppløsning. Med mobilrevolusjonen søker flere og flere personer på sine mobile enheter - tabletter eller mobiltelefoner - for informasjon. Det har derfor blitt nødvendig for webutviklere å lage et nettsted som passer for alt fra Windows PC til mobile enheter. Denne artikkelen forklarer forskjellen mellom adaptiv vs responsiv webdesign og lar deg bestemme hvilken som er bedre for deg og din organisasjon.
Responsivt webdesign
Responsive Web Design innebærer ekstra koding og benytter det som kalles "fluid grids". Tallene er angitt i "prosent" i stedet for eksakt antall piksler. Dette gjør at samme nettsidekode gjengis riktig på en PC-skjerm og på en mobiltelefonskjerm. Således, uansett hvordan du endrer størrelsen på skjermen, blir den samme nettsiden presentert på en enkel måte. For mindre nettsteder kan teksten og bildene enkelt flyte med skjermrommet og passe inn i det uten å bryte nettstedet eller uten å kutte deler av nettstedet.
En Responsive webdesign tilnærming gjør det obligatorisk å bruke CSS3 i stedet for bare CSS. Det gjør også bruk av skalerbare bilder og fluidnettet som er litt vanskelig å kode.
Adaptive Web Design
Adaptiv webdesign er også fokusert på å presentere synlig nettside på tabletter og mobiltelefoner i tillegg til PC-skjermer. Tilnærmingen er litt annerledes skjønt. I responsivt webdesign var det fleksibilitet som tillot gratis tekstflytning og dimensjonering av bilder for å passe på de forskjellige skjermbildene.
I adaptiv webdesign bruker utviklerne forhåndsdefinerte skjermstørrelser og kode tilsvarende. Det vil si at når en bruker lander på nettstedet, bestemmer nettstedet hvilken type enhet som brukes, og presenterer nettstedet utformet for den bestemte skjermstørrelsen på en enhet. Innholdet kan i enkelte tilfeller variere på tvers av enheter.
For eksempel vil utviklerne vurdere 1280 × 800 piksler for PCer, 8 "for tabletter og 5" for mobiler. Den tidlige koden for adaptiv webdesign inneholder identifikasjon av skjermbilder. Hvis det er PC, vis PC-versjonen av nettstedet. Hvis det er en tablett på 8 ", viser tablettversjonen av nettstedet, og hvis enheten er en mobiltelefon, kan du vise mobilversjonen av nettstedet. Dette oppnås ved å bruke "IF" -oppsettet, etterfulgt av forskjellige dimensjoner angitt nøyaktig i piksler i stedet for å gjøre det i prosent.
Hvis nye enheter kommer over med forskjellig skjermoppløsning, må utviklerne gå tilbake til koding for å innlemme de nyere skjermoppløsningene. Dermed har adaptiv webdesign noen muligheter for beskjæring på mindre enheter hvis utviklerne ikke er forsiktige.
Sammenlignet med responsiv webdesign, tilpasser webdesign i enklere å kode, og de fleste utviklere velger sistnevnte over det responsive webdesignet.
Responsive vs Adaptive webdesign
Responsive nettsteder er vanskelig å kode. Koden er kompleks og benytter prosentverdier i stedet for faste pixelverdier. Det trenger god mengde konsentrasjon for å bygge et nettsted som skalerer i forhold til enhetens skjermstørrelse. Tvert imot er det lettere å lage forskjellige nettsteder for forskjellige enheter, slik det er tilfelle i adaptiv webdesign. Selv om arbeidet er mer i adaptiv webdesign, da utviklerne ville skape forskjellige nettsteder for ulike enhetsstørrelser, er det enda enklere enn responsivt webdesign.
Siden det er for mange mobile enheter på markedet, kan utviklerne ikke nødvendigvis inkludere alle typer skjermoppløsninger. Det fører til beskjæring av nettsteder i mindre skjermer når adaptiv webdesign tilnærming brukes.
Adaptive nettsider er litt treg i lasting da nettstedet først har funnet ut hvilken enhet og hvilken skjermoppløsning som brukes. Basert på det er den relaterte versjonen av nettstedet lastet inn på enhetens skjerm. I tilfelle av responsiv webdesign, brukes en enkelt kode, og den krympes automatisk for å passe til mobilskjermene.
Du vil kanskje også se på dette innlegget på MSDN-tittelen Hvorfor jeg foretrekker adaptivt webdesign over responsivt webdesign.
OPPDATERING: Den koblede siden er ikke tilgjengelig på Microsoft. Du vil kanskje sjekke ut SharePoint Responsive Web Design i stedet.
