Responsive design er en måde at designe hjemmesider på. Man designer hjemmesiden med den hensigt, at den skal kunne ses og bruges på både smartphones, tablets og almindelige desktop computere.
Ideen er, at hjemmesiden automatisk skal kunne tilpasse sig skærmens størrelse, således at tekst, billeder, tabeller, menuer, grafik osv. skalleres enten op eller ned, alt afhængig af hvilken enhed brugeren benytter til at se siden.
At have en responsive hjemmeside, er i takt med den eksplosive udbredelse af mobile enheder, blevet vigtigere end nogensinde før. Et godt på en responsive hjemmeside er NemProgrammering.dk selv. Når du besøger siden, så prøv at gøre dit browservindue større og mindre.
Du vil opleve, at hjemmesiden automatisk tilpasser sig størrelsen på dit browservindue. Hvis ikke du oplever, at hjemmesiden ændre sig, så er det sandsynligvis fordi du anvender en ældre browser, som ikke understøtter CSS3 media queries (som en responsiv hjemmeside bl.a. bygger på).
Man designer typisk ud fra følgende skærmstørrelser:
Tricket er, at lave en jævn overgang mellem de fire skærmtyper, hvor store billeder skalleres ned og skriftstørrelsen skalleres op, hvis man f.eks. går fra en tablet til en smartphone.
Et alternativ til en responsive hjemmeside, er at en dedikeret side til mobile enheder samt en dedikeret side til desktops. Dette betyder dog, at du skal vedligeholde flere separate sider, hvilket godt kan blive uoverskueligt og tidkrævende i længden. Med et responsivt design har du én hjemmeside, hvor indholdet er det samme, men hvor det blot skalleres ned eller op om nødvendigt. En responsive hjemmeside kan derfor i mange tilfælde være nemmere at vedligeholde end to dedikerede sider til mobil og desktop.
Du kan lære meget mere om responsive design med NemProgrammering.dk´s gratis responsive design kursus.