Ακούω όλο και περισσότερο τους δύο παραπάνω όρους, τον δεύτερο σχεδόν καθημερινά, ωστόσο οι περισσότεροι έχουν την αίσθηση πως πρόκειται για ακριβώς το ίδιο πράγμα (συνωνυμία), κάτι που δεν ισχύει. Και επειδή αυτό μπορεί να οδηγήσει σε παρεξηγήσεις, γι αυτόν ακριβώς τον λόγο αποφάσισα να γράψω το παρακάτω post. Παρακάτω λοιπόν προσπαθώ να εξηγήσω με όσο το δυνατόν ευκολότερο τρόπο την διάφορα ενός Responsive και ενός Adaptive design.
Responsive design
Θα ξεκινήσω με τον πιο διάσημο όρο το Responsive design, τo οποίο χρησιμοποιεί απαραίτητα 3 χαρακτηριστικές web τεχνικές. Αυτό είναι το fluid grid (για το layout), media queries (για τον έλεγχο μεγέθους των οθονών) και flexible media (images, video, κτλ.). Αν λοιπόν το layout μας έχει και τα 3 παραπάνω χαρακτηριστικά, τότε είναι responsive, που πολύ απλά σημαίνει πως αν έχει κατασκευαστεί σωστά θα παίζει σε οποιαδήποτε ανάλυση/συσκευή. Δεν θέλω να σταθώ σε λεπτομέρειες και τεχνικές τύπου “mobile first” (όπου για λόγους bandwidth καλό είναι να κατασκευάζουμε το site ξεκινώντας από την μικρότερη ανάλυση που θέλουμε να υποστηρίξουμε, και να συνεχίσουμε με τις μεγαλύτερες) για την ώρα, ίσως το κάνω σε κάποιο άλλο post.
Adaptive design
Λέγοντας Adaptive design εννοούμε πως δεν ικανοποιεί και τα τρία προαναφερθέντα χαρακτηριστικά (συνήθως το fluid grid layout) και απλά προσπαθεί με τα media queries να προσαρμόσει (adapt) το layout όσο καλύτερα γίνεται σε διάφορες αναλύσεις και συσκευές. Η συγκεκριμένη τεχνική χρησιμοποιείται όλο και λιγότερο, μιας και όπως καταλαβαίνεται το responsive design αν και δυσκολότερο στην υλοποίηση, προσφέρει περισσότερα πλεονεκτήματα.
Τέλος θα ήθελα να θυμίσω πως βασικός λόγος δημιουργίας αυτής της σύγχυσης/παρεξήγησης στην ονοματολογία, ήταν πως στην γέννηση των media queries (άρα και των παραπάνω τεχνικών ) δεν υπήρχε standard ορολογία, οπότε ήταν καθαρά στην κρίση του designer το πως θα ονόμαζε αλλά και τι εννοούσε (σε αυτό το μπέρδεμα συνείσφεραν ακόμα και γνωστά βιβλία) ωστόσο πλέον καλό θα είναι να ξέρουμε να τα διαχωρίζουμε.