JoomlaDay 2013 (και η παρουσίαση μου εκεί)

Το προηγούμενο Σάββατο (15 Ιουνίου) είχα την τιμή να βρίσκομαι στο JoomlaDay 2013 ως ομιλητής (και όχι μόνο). Το event ήταν πάρα πολύ καλά οργανωμένο και ανά πάσα στιγμή μπορούσες να βρεις την παρουσίαση που σου ταίριαζε στις 2 αίθουσες του κινηματογράφου Δαναού. Αξίζουν συγχαρητήρια στον Φώτη που κάθε χρόνο αναλαμβάνει και οργανώνει ένα μεγάλο event το οποίο μπορούν να παρακολουθήσει ο καθένας εντελώς δωρεάν! Αυτό που μου άρεσε – δεν ξέρω αν θα συμφωνήσουν όλοι με αυτήν την άποψη – είναι πως σχεδόν οι μισές παρουσιάσεις δεν είχαν να κάνουν με το Joomla αλλά γενικότερα με το web design, web developemt, με mobile developement (Firefox OS και Windows mobile) αλλά και με cloud services. Βρίσκω μόνο θετικά μια τέτοια αντιμετώπιση και ελπίζω να συνεχιστεί και σε άλλα event – μην κολλάμε με τεχνολογίες/CMS/frameworks… Παρακολούθησα όλες (εκτός από μία) τις παρουσιάσεις του Σαββάτου (αυτές που γινόντουσαν στην μεγάλη αίθουσα) και μου άρεσαν ιδιαίτερα οι παρουσιάσεις από τα παιδιά της Mozilla Greece για το Firefox OS, του Γεράσιμου για “Web Typography” αλλά και του Γιάννη τόσο για το “Responsive Web Design Workflow” όσο και για το “Fire the workaholics”! Δυστυχώς την Κυριακή την έχασα λόγο άλλων υποχρεώσεων, ωστόσο κατάφερα να ρίξω μια ματιά ματιά σε ελληνικές προσπάθειες που δεν γνώριζα όπως το Radiojar αλλά και σε άλλες που γνώριζα όπως το Akeeba backup και ελπίζω στο μέλλον να καταφέρω να δω κάποιες παρουσιάσεις τους. Τέλος για αυτούς που έχασαν την παρουσίαση μου, με θέμα “Responsive Web Design & Touch Devices” μπορούν να την δουν/κατεβάσουν από το Speakerdeck. Κάποια στιγμή θα έχουμε και το video της παρουσίασης ωστόσο μέχρι τότε μπορείτε να χαζέψετε τα slides. Άντε και του χρόνου.

Adaptive vs Responsive design: Ποια είναι η διαφορά;

Ακούω όλο και περισσότερο τους δύο παραπάνω όρους, τον δεύτερο σχεδόν καθημερινά, ωστόσο οι περισσότεροι έχουν την αίσθηση πως πρόκειται για ακριβώς το ίδιο πράγμα (συνωνυμία), κάτι που δεν ισχύει. Και επειδή αυτό μπορεί να οδηγήσει σε παρεξηγήσεις, γι αυτόν ακριβώς τον λόγο αποφάσισα να γράψω το παρακάτω 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 το πως  θα ονόμαζε αλλά και τι εννοούσε (σε αυτό το μπέρδεμα συνείσφεραν ακόμα και γνωστά βιβλία) ωστόσο πλέον καλό θα είναι να ξέρουμε να τα διαχωρίζουμε.