Responsiv Web Design

Responsiv design betyder att sidans utseende beror på webbläsarens storlek. Alltså att den ser olika ut beroende på ifall man använder en smartphone eller en dator

Med hjälp av CSS kan man styra detta genom att ange en speciell kod. Här är ett typexempel:

@media (min-width: 500px) and (max-width: 600px) {
h1 {
color: blue;
}

I exemplet ovan blir resultatet att H1 kommer att visas med blå färg OM webbläsaren är mellan 500px och 600px

Steg-för-steg

Design

För att detta ska bli bra måste man börja designa med relativa värden; alltså använda procent i st f pixel-värden.

Resurser

Google Developer: Responsive Web Design
Exempel: mostly fluid viewport units