Designing for Web and Tablets - Responsive Design

• April 29, 2024

Begrepet Responsive har stått i høysetet en stund, men hva betyr det egentlig? Internett har endret seg mye i løpet av årene, fra en for det meste tekstbasert plattform til et interaktivt, engasjerende, multimedia og multi-enhetsmiljø.

Nettsider har endret seg i løpet av det siste tiåret for å gjenspeile forbedringene på Internett og enhetene vi bruker for å se det. Når vi snakker om enheter, har vi flere typer å velge mellom, inkludert datamaskiner, minidatamaskiner, nettbrett og smarttelefoner. Når antallet enheter og deres variasjoner øker, blir et problem åpenbart. Hver enhet og hver variant av en enhet har sin egen skjermstørrelse.

Når vi bare måtte designe nettsteder for stasjonære og bærbare datamaskiner, var hovedvurderingen vår hvordan vi skulle sikre at nettsiden viste det samme uansett datamaskin eller nettleser. Svaret var å designe for topp nettlesere og de vanligste skjermoppløsningene. Det fungerte i kort tid. Et annet problem ble tydelig da disse parameterne fortsatte å endre seg. Skjermstørrelsen for min første datamaskin var 800 x 600, og jeg elsket den uansett. Da ble 1024 x 800 normen. Nå har datamaskiner vokst til 27 tommer og større. Så måloppløsningen for et nettsted endret seg.

Akkurat da vi begynte å glede oss over å designe for disse større skjermene, økte populariteten til smarttelefonen og nettbrettet sterkt, med deres kule apper, men mindre skjermer. Faktisk er det spådd at smarttelefoner og tabeller blir brukt oftere enn datamaskiner for å se på nettet i løpet av få år. Først var det bare noen få mobile enheter. Så vi begynte å designe både et hovednettsted for databrukeren og et andre nettsted for mobilbrukeren. Men dette løste ikke problemet fullstendig, fordi vi fremdeles designet for utforminger med fast bredde.

Nå kan du ikke anta hvilken enhet seeren bruker for å se nettstedet ditt. Så å designe for bestemte faste skjermstørrelser er ikke lenger det beste svaret på problemet. Det vi trenger er en måte å bestemme brukerens skjermstørrelse på enheten og vise nettsiden deretter. Derfor responsiv webdesign, som bruker CSS for å bestemme skjermbredden og for å vise en webside annerledes etter behov. Dette gjør at vi bare kan ha ett nettsted som vil omformes til flere versjoner etter behov.

Video Instruksjoner: How To: Responsive Web Design for Mobile and Tablet (April 2024).