Ένας ιστότοπος, πολλές οθόνες. Ο σχεδιασμός με δυνατότητα προσαρμογής επιτρέπει σε μια ενιαία διάταξη να προσαρμόζεται σε διαφορετικά μεγέθη και προσανατολισμούς συσκευών. Ο όρος επινοήθηκε από τον Ethan Marcotte το 2010, βασιζόμενος σε προηγούμενες ιδέες σχετικά με ευέλικτα πλέγματα και ρευστές εικόνες. Αντί να δημιουργούν ξεχωριστούς ιστότοπους για υπολογιστές και κινητά, οι σχεδιαστές δημιουργούν μία βάση κώδικα που αναδιατάσσεται με βάση το πλάτος του παραθύρου προβολής.

Τρία τεχνικά στοιχεία το κάνουν να λειτουργεί. Τα ρευστά πλέγματα χρησιμοποιούν ποσοστά αντί για σταθερά pixel, επομένως οι στήλες τεντώνονται και συρρικνώνονται. Οι ευέλικτες εικόνες κλιμακώνονται μέσα στα κοντέινερ τους. Τα ερωτήματα πολυμέσων ανιχνεύουν το μέγεθος της οθόνης και εφαρμόζουν διαφορετικούς κανόνες CSS σε καθορισμένα σημεία διακοπής. Μια διάταξη επιφάνειας εργασίας τριών στηλών μπορεί να συμπτυχθεί σε μία μόνο στήλη σε ένα τηλέφωνο, με την πλοήγηση να μετακινείται σε ένα μενού χάμπουργκερ. Ο στόχος δεν είναι ο τέλειος έλεγχος σε pixel, αλλά η ομαλή προσαρμογή.

Βασικές τεχνικές

• Ρευστά πλέγματα με βάση ποσοστά.
• Ευέλικτες εικόνες και μέσα.
• Ερωτήματα πολυμέσων σε καθορισμένα σημεία διακοπής.
• Προτεραιότητα στο περιεχόμενο για κινητά.

Ο σχεδιασμός με δυνατότητα προσαρμογής (responsive design) αποτελεί πλέον συνήθη πρακτική. Οι χρήστες αναμένουν ότι ένας ιστότοπος θα λειτουργεί, είτε τον ανοίγουν σε τηλέφωνο, tablet, φορητό υπολογιστή είτε σε τηλεόραση.