Σκέψεις, ιδέες και προτάσεις γύρω από τον σχεδιασμό ιστοσελίδων
17.01.2010 (01:43)
Τις τελευταίες ημέρες έχει ενταθεί η κουβέντα μεταξύ των web designer-developers (ειδικά στα άρθρα του Andy Clarke & στο φετινό 24ways.org), για το αν θα πρέπει να δημιουργούμε σελίδες που θα χρησιμοποιούν τις καινούργιες τεχνολογίες (CSS3 & HTML5) ή θα πρέπει να φτιάχνουμε σελίδες που θα είναι και θα μοιάζουν ίδιες μεταξύ όλων των browser συμπεριλαμβανομένου και του Internet Explorer 6.
Για πολύ καιρό μπορώ να πω ότι συμφωνούσα με την δεύτερη λογική, αλλά βλέποντας μια μέρα ένα κουτί από ηλεκτρονικό παιχνίδι έκανα τον παραλληλισμό. Γιατί να μην λειτουργούμε και εμείς όπως στην βιομηχανία των ηλεκτρονικών παιχνιδιών;
Στην βιομηχανία παιχνιδιών βλέπουμε μεγάλους κατασκευαστές να δημιουργούν παιχνίδια που υποστηρίζουν την τελευταίας τεχνολογίας κονσόλα ή το τελευταίας τεχνολογία σύστημα ώστε η εμπειρία του χρήστη να είναι η καλύτερη. Φυσικά θέτουν κάποιες ελάχιστες απαιτήσεις που ναι μεν μπορείς να παίξεις υποφερτά αλλά χάνεις όλη την μαγεία με τα γραφικά κλπ. Για να έχει την καλύτερη εμπειρία με το παιχνίδι ο χρήστης πρέπει να αναβαθμίσει το σύστημά του ή να αγοράσει καινούργια κονσόλα. Φυσικά και θα μπορούσαν να δημιουργήσουν παιχνίδια που να παίζουν το ίδιο σε όλα τα συστήματα, αλλά δεν το κάνουν γιατί θέλουν να προσφέρουν την καλύτερη εμπειρία στον χρήστη και να φτιάξουν ένα παιχνίδι που δεν θα είναι βαρύ και φυσικά να βοηθήσουν στην προώθηση των καινούργιων συστημάτων και τεχνολογιών που κάνουν την δουλειά τους ευκολότερη.
Χρησιμοποιώντας το παραπάνω παράδειγμα, μπορούμε να δούμε γιατί εμείς σαν web developers είμαστε υποχρεωμένοι να χρησιμοποιούμε τις τεχνολογίες που προσφέρουν οι τελευταίας τεχνολογίας browser. Πρέπει να αρχίσουμε να σκεφτόμαστε την εμπειρία που δίνουμε στον χρήστη. Να δίνουμε σκιές και στρογγυλεμένες γωνίες με CSS και όχι με 4-5 διαφορετικές εικόνες και 7-8 extra στοιχεία στην σελίδα. Να χρησιμοποιούμε το font embedding αυξάνοντας την εργαλειοθήκη μας με καινούργιες γραμματοσειρές. Να δημιουργούμε gradients χωρίς να πρέπει να κόψουμε διαφορετικές εικόνες για κάθε ξεχωριστό κομμάτι. Και προπαντός να κάνουμε την δουλειά μας και την δουλειά των συναδέλφων μας ευκολότερη αφού θα έχουμε βάλει το λιθαράκι ώστε να εξαπλωθούν οι νέες τεχνολογίες.
Και φυσικά κάποιος θα σκεφτεί: “Τι ωραία μας τα λες ρε Δημήτρη. Και πως θα υποστηρίξουμε του παλιότερους browsers;”
Μα τους υποστηρίζουμε. Εκεί που έχει gradient θα εμφανίζεται ένα μόνο χρώμα. Εκεί που έχει σκιές, δεν θα εμφανίζονται. Εκεί που έχει βάλει embedded γραμματοσειρές θα εμφανίζεται μια παρόμοια που υπάρχει στο σύστημα του χρήστη και θα έχεις διαλέξει σαν εναλλακτική. Θα έχει απλές γωνίες και όχι στρογγυλεμένες.
Στην ουσία δίνουμε στον χρήστη το περιεχόμενο που πρέπει αλλά δεν του δίνουμε την ολόκληρη την εμπειρία. Ακριβώς όπως κάνουν οι κατασκευαστές παιχνιδιών. Και φυσικά αν ο πελάτης επιμένει να θέλει να εμφανίζεται η σελίδα παρόμοια σε όλους τους διαφορετικούς browser, μπορούμε να του το προσφέρουμε με την ανάλογη πληρωμή. Τον τρόπο τον ξέρουμε έτσι και αλλιώς.
Σκεπτόμουν αυτά τα πράγματα που αναφέρεις και κατέληξα σε κάτι που δεν είχα συνειδητοποιήσει: αν όντως πάμε με τα νέα specifications και τους browsers που τα υποστηρίζουν, τελικά το design μας θα υποστηρίζεται σχεδόν 100% απ’ όλους τους browser, εκτός των IE6, IE7. Όλοι οι άλλοι έχουν ήδη εξελιχθεί.
Το οποίο είναι από μόνο του αρκετός λόγος για μη μείνουμε στα παλιά.
Απλώς θα πρέπει να αναπροσαρμόσουμε την επιχειρηματολογία μας απέναντι στους πελάτες μας. Πράγμα που έχουμε κάνει ήδη στο παρελθόν. Γιατί όχι και τώρα λοιπόν;
Υποστηρίζεται 100% σε όλους τους browser εκτός όλης της γκάμας του IE. Ακόμα και ο IE8 δεν έχει υποστήριξη CSS3.
Αλλά η λογική μου είναι: Γιατί πρέπει να υποστηρίζουμε πλήρως ένα πρόγραμμα που είναι παλιό και να μην προσπαθούμε απλώς να φαίνεται υποφερτά σε αυτό. Δηλαδή σαν να λέμε ότι η εταιρίες παιχνιδιών δημιουργούν παιχνίδια που παίζουν τέλεια και στο PSone και στο PS3 επειδή υπάρχει ακόμα ένα μεγάλο market share.
Ταπεινή μου γνώμη είναι πως θα πρέπει ο κάθε προγραμματιστής να στήσει το κάθε project του ώστε να φαίνεται σωστά στους browsers που υπάρχουν ενσωματωμένοι(IE6-XP,IE8-vista/7 κ.ο) & μέτα να σκεφτούν για της επόμενης γενιάς.
Το όλο θέμα με CSS3, HTML5 και λοιπά καλούδια μου φαίνεται σαν να προσπαθούμε να δημιουργήσουμε κβαντική τεχνολογία όταν ο τελικός χρήστης(καταναλωτής) είναι στην εποχή του ατμού.
Μα δεν υποστηρίζω και το αντίθετο. Ίσα ίσα που λέω ότι πρέπει να κάνουμε σελίδες που να μπορεί ο χρήστης να διαβάσει άσχετα με το τι χρησιμοποιεί. Άλλο όμως το να φαίνεται σωστά και άλλο το να μην χρειάζεται να νοιαζόμαστε για την ομοιογένεια του σε όλους τους browser.
Και για το σχόλιο περί CSS3 & HTML5. Με αυτή τη λογική δεν θα έπρεπε να βγαίνουν παιχνίδια που να χρησιμοποιούν στο έπακρο τις καινούργιες κάρτες γραφικών και τους καινούργιους επεξεργαστές γιατί ο κόσμος δεν τις έχει ακόμα αγοράσει και μπορεί ποτέ να μην τις αγοράσει.
Το θέμα είναι εμείς να βλέπουμε το μέλλον και όχι να περιμένουμε να έρθει.
Με παρεξήγησες, όταν είπα για “εποχή του ατμού” απευθυνόμουν στο ότι είμαστε αναγκασμένοι εν έτη 2010 να σπάμε τα κεφάλια μας γιατί ο IE 6 που υπάρχει στα XP για παράδειγμα προεγκατεστημένος δεν θα δείξει σωστά το site μου & πρέπει να προσθέσω 3,5,10 CSS styles γιατί έτσι.
Περι HTML5.
Πως βγάζεις HTML5 παλικάρι μου απ’ την στιγμή που ΕΝΑΣ μόνο browser την υποστηρίζει; Τι θα γίνει αν η Microsoft και κάθε Microsoft αρνηθεί να την υποστηρίξει και πάει με τον δικό της Θεό;(βλέπε silverlight), για μένα είναι αίσχος αυτό που βλέπω αν και ελπίζω να μην ψώνισαν μερικοί & πάνε για Microsoft εποχές.
Πρώτα από όλα την HTML5 ένας browser δεν την υποστηρίζει και αυτός είναι ο IE. Αν πάντως θυμάμαι καλά, ο IE9 Μάλλον θα υποστηρίζει πολλά από αυτά. Και πάλι δεν υπάρχει πρόβλημα γιατί μπορείς να την υποστηρίξεις και στον IE6. Περισσότερα μπορείς να δεις στο http://html5doctor.com/how-to-get-html5-working-in-ie-and-firefox-2/
Και δεν σε παρεξήγησα. Ακριβώς αυτό κατάλαβα. Ότι είμαστε υποχρεωμένοι να υποστηρίζουμε τον IE6. Το θέμα είναι ότι δεν χρειάζεται να κάνουμε τις σελίδες μας να φαίνονται ίδιες σε όλους τους browser. Όπως λέει και ο Andy Clarke στο άρθρο του για το 24ways.org: “Ignorance is bliss” (http://24ways.org/2009/ignorance-is-bliss). Μερικές φορές δεν χρειάζεται να ξέρει ο πελάτης όλη την αλήθεια.
Και όπως λέω στο άρθρο “τους υποστηρίζουμε. Εκεί που έχει gradient θα εμφανίζεται ένα μόνο χρώμα. Εκεί που έχει σκιές, δεν θα εμφανίζονται. Εκεί που έχει βάλει embedded γραμματοσειρές θα εμφανίζεται μια παρόμοια που υπάρχει στο σύστημα του χρήστη και θα έχεις διαλέξει σαν εναλλακτική. Θα έχει απλές γωνίες και όχι στρογγυλεμένες.” Αν πάλι θέλει και επιμένει τότε δεν είναι κακό να τον χρεώσεις έξτρα.
Όπως είπες μόνο ο ΙΕ δεν την υποστηρίζει και αν θυμηθείς παρόμοια συμβάντα του παρελθόντος περί Microsoft & άλλες εταιριίες η πρώτη κατέληξε με πατέντα που λιγότερα απ’ τα μισά δούλευαν. Εν’ συνεχεία
Αν υπολογίσεις τα Windows 7 ως καινούργια μόδα στα παρόντα συστήματα Η/Υ βγαίνει το συμπέρασμα πως τα sites που θα προβάλονται από τους standard browsers των Win7 δεν θα φαίνονται σωστά ή καθόλου λόγω αυτής της έλειψης υποστήριξης. Επομένως ή θα αλλάξει browser ο end-user ή θα φάει το κεφάλι του ο προγραμματιστής να κάνει HTML5 & HTML* versions για το site.
Ανέφερες ότι η καινούργια μόδα είναι τα Windows 7. Σε αυτά υπάρχει ο IE8 που έχει υποστήριξη στην HTML5. Οπότε δεν μπορείς να πεις ότι δεν θα φαίνονται οι σελίδες σε αυτή τη καινούργια μόδα. Σίγουρα δεν έχεις όλη την υποστήριξη της HTML5 (canvas, video) αλλά σίγουρα μπορείς να φτιάξεις μια σελίδα που να μπορεί ο χρήστης να χρησιμοποιήσει. Ακόμα και σε IE6.
Είμαι 100% σίγουρος ότι απ’ τη στιγμή που θα αρχίσουν οι προγραμματιστές να γράφουν σε HTML5 τα αντίστοιχα forums για προγραμματισμό θα γεμίσουν με threads του είδους “This not working on IE, that isn’t correct on IE” και θα οδηγηθούμε σε μια επανάληψη εποχής IE6-IE7.
Προς στιγμήν για μ’ενα flash/video codebase και άγιος ο Θεός μέχρι να αποφασίσουν να δημιουργήσουν σωστά κάτι.
Νομίζω ότι δεν χρειάζεται να πάμε σε HTML5 & CSS3 για να γεμίσουν τα forum με αυτές τις ερωτήσεις.
Ο IE είναι ήδη αρκετά buggy ακόμα και με τα τωρινά δεδομένα.
Όμως δεν νομίζω ότι αυτό μας έχει σταματήσει να δημιουργούμε σελίδες που καινοτομούν.
Γεια σας κι από μένα.
Συμφωνώ απόλυτα με το να χρησιμοποιούμε τις νέες τεχνολογίες.
Επειδή κάποιοι αρνούνται να προχωρήσουν μπροστά δεν πάει να πει ότι όλοι οι υπόλοιποι πρέπει να μένουν στάσιμοι.
Εμείς που κάνουμε αυτή τη δουλειά πρέπει να εκπαιδεύσουμε τους πελάτες μας και τον κόσμο όλο.
Θα μου πεις τι να σου κάνω εγώ κι εσυ? Κι όμως δείτε πως έφαγε χώμα ο explorer απο τον firefox και τώρα έχει το μεγαλύτερο κομμάτι τις πιτας. Βοήθησαν όλοι… μα πρώτοι από όλους εμείς οι developers, μετά οι προχωρημένοι χρήστες κι έπειτα όλοι οι άλλοι. Φυσικά βοήθησε και η μαμά Google μη το ξεχνάμε αυτό, όπως βοηθάει και τον Chrome τώρα και μέσα σε λίγο καιρό έχει πάρει το 10% κάτι που οι Safari και Opera δεν θα δουν ποτέ.
Τα πράγματα μπορούν να γίνουν πιό απλά.
Φανταζεστε τι έχει να γίνει αν ένα ωραίο πρωϊ Google, Facebook, Youtube, Twitter και Yahoo απαγορέψουν την είσοδο στις υπηρεσίες τους από legacy browsers?
Τότε θα δείτε πως όλη η υφήλιος κάνει upgrade μέσα σε 2 μέρες…
Εγώ στα προσωπικά μου projects δεν υποστηρίζω IE6… δικαίωμά μου.
Έχω φάει πολλές ώρες απ’τη ζωή μου και έχω χτηπήσει άπειρες φορές το κεφάλι μου στον τοίχο για αυτόν.
Αν και ξέρω να ξεπεράσω τα περισσότερα από τα bugs του δεν το κάνω πλέον.
Συμφωνώ πάντως με την άποψη ότι οι χρήστες με παλιότερους browsers θα πρέπει να βλέπουν κάτι…
Μια λευκή σελίδα με χυμα κείμενο.
Α και κάτι άλλο…
Για όσο συνεχίζουμε να φτιάχνουμε sites για legacy browsers είναι φυσικό οι χρήστες να μην κάνουν upgrade ποτε.
Αν σταματήσουν κάποια μέρα να βλέπουν τα sites σωστά ίσως αναρωτηθούν και το ψάξουν λίγο παραπάνω.
Πως δηλαδή η Adobe έχει το θράσος και σου λέει “φίλε αν θες να δεις το video κανε αναβάθμιση στον Flash Player ταδε”.
Θα το δει μια, θα το δει δυο, την τρίτη θα κάνει upgrade.