Δωρέαν JavaScript βιβλία

Η JavaScript είναι εδώ και πολύ καιρό η επίσημη γλώσσα του web. Είναι η γλώσσα που χρησιμοποιείται πίσω από όλες τις HTML5 εφαρμογές που μας εντυπωσιάζουν (με άλλα λόγια είναι η γλώσσα που χρησιμοποιούν όλα τα HTML5 APIs, και όχι μόνο). Το κακό με την Javascript είναι πως έχει αρκετές παραξενιές, οι οποίες κάνουν την εκμάθηση της αρκετά δύσκολη, ακόμα και σε έμπειρους προγραμματιστές. Αν θέλετε να ξεκινήσετε σωστά, το δωρεάν βιβλίο του Cody Lindley ¨Javascript Enlignment¨ είναι μια πολυ καλη αρχή. Επίσης οι πιο μυημένοι μπορούν να ρίξουν μια ματιά και στο επίσης δωρεάν βιβλίο του Addy Osmani ¨Essential JavaScript and jQuery designs patterns¨.

Καθόλου άσχημες τιμές 😉

HTML5 σκέψεις

Αυτό το καλοκαίρι το έριξα – όπως και πολλοί άλλοι φαντάζομαι – στην HTML5 η οποία έχει ήδη αρχίσει να κάνει δειλά-δειλά την εμφάνιση σε αρκετά sites, σε μικρότερο ή μεγαλύτερο βαθμό. Τα βιβλία που διάβασα ήταν το “HTML5 for web designers” του Jeremy Keith και το “Introducing HTML5” των Bruce Lawson και Remy Sharp. Καταρχάς όποιος σκέφτεται να αγοράσει κάποιο βιβλίο αυτήν την στιγμή, του προτείνω το δεύτερο (Introducing HTML5), μιας και το πρώτο με απογοήτευσε αρκετά για “A book apart” βιβλίο. Γενικότερα δεν θα το περιέγραφα καν ως βιβλίο, αλλά σαν μια γενική, θεωρητική εισαγωγή για το τι είναι η HTML5. Αντίθετα, το Introducing HTML5 με ξάφνιασε ευχάριστα τόσο με τα πολλά θέματα που καλύπτει όσο και με τον τρόπο που τα καλύπτει, μιας και δεν μένει μόνο στην θεωρία, αλλά προχωράει και στην πράξη (ρίξτε οπωσδήποτε και μια ματιά στα παραδείγματα του βιβλίου).

Μετά από αυτήν την μικρή εισαγωγή λοιπόν, και με την ελάχιστη εμπειρία που έχω στο θέμα, θέλω να καταγράψω κάποιες σκέψεις, προβληματισμούς, και γενικότερα να ξεκινήσω μια συζήτηση με τα πιο ανήσυχα μυαλά… Θα προσπαθήσω να είμαι σαφής και γρήγορος, έτσι ώστε να μην μπερδέψω  και να μην κουράσω. Επίσης σε αυτό το post γράφοντας HTML5 εννοώ και τα APIs ή τις τεχνολογίες οι οποίες δεν είναι μέρος του επίσημου HTML5 specification (είναι από μόνα τους ξεχωριστά specifications), ωστόσο θα χρησιμοποιηθούν κυρίως με αυτήν την markup και την ίδια περίοδο. Ας δούμε λοιπόν τι μας επιφυλάσσει το μέλλον, ε, το παρόν ήθελα να πω!

Markup

Ας ξεκινήσουμε με το πιο απλό μέρος της HTML5 – θεωρητικά πάντα – την markup και τα semantics. Τα semantics λοιπόν έχουν αλλάξει αρκετά και πλέον γίνεται ακόμα πιο δύσκολο το να γράψεις σημασιολογική markup. Παρακάτω περιγράφω αυτά που μου φάνηκαν πιο περίεργα, σημαντικά ή παράξενα!

  • Το outline – το οποίο δεν έχει υλοποιηθεί ακόμα από κανέναν browser (!!!) – αλλάζει τελείως τον νόημα των headings (h1-h6). Πλέον ένα h3 heading μπορεί να είναι πιο σημαντικό από ένα h1 heading! Στην ουσία στην HTML5 θα μπορούσαμε να είχαμε ένα και μοναδικό τύπο heading (h για παράδειγμα), ωστόσο υπάρχουν ακόμα έξι (h1-6) για compatibility θέματα. Μένει να δούμε πως θα επηρεάσει και το SEO αυτό το θέμα.
  • Τα sections και τα articles είναι αρκετά δύσκολα στην κατανόηση, μιας και το ένα μπορεί να υπάρχει μέσα στο άλλο αρκετές φορές! Θέλει αρκετή μελέτη έτσι ώστε να τα χρησιμοποιήσει κάποιος σωστά.
  • Τέλος είμαι πραγματικά περίεργος να δω πως θα φτιάξουν τους WYSIWYG web editors (Dreamweaver για παράδειγμα) έτσι ώστε να γράφουν semantic HTML5. Παλιότερα τα πράγματα ήταν πανεύκολα, απλά πετούσαν παντού ένα div και το θέμα τελείωνε, τώρα τι λύση θα βρουν άραγε;

Φόρμες (forms)

Οι φόρμες επιτέλους δεν θα σπάνε τα νεύρα σε αυτούς που τις φτιάχνουν. Μερικά attributes στην markup μας και θα αφήνουμε τον browser να κάνει όλη την “βρόμικη” δουλειά. Οι περισσότεροι browsers υποστηρίζουν λίγα πράγματα προς το παρόν (ο πιο ολοκληρωμένος browser στο θέμα είναι ο Opera) ωστόσο σιγά-σιγά θα τον φτάσουν και οι υπόλοιποι.

  • Πολύ έξυπνο compatibility μιας και όλες οι φόρμες εμφανίζονται σαν απλά text inputs σε παλιότερους browsers που δεν καταλαβαίνουν τα νέα HTML5 attributes.
  • Δυστυχώς θα γράφουμε για πολύ καιρό ακόμα Javascript validation scripts (ιδιαίτερα στην Ελλάδα, με τους αρχαιοελληνικούς browsers που κυκλοφορούν)!
  • Πρέπει οπωσδήποτε να υπάρξει μια επίσημη γραμμή για το πως θα εμφανίζονται/φαίνονται τα διάφορα widgets (πχ. επιλογή ημερομηνίας) και τα λάθη (validation errors), καθώς και για το πως θα διαγράφουμε αυτά τα default browser styles, γιατί προβλέπω να γίνεται χαμός σε αυτό το θέμα.
  • Ακόμα λιγότερη Javascript χάρις τα autofocus, placeholder, autocomplete και required attributes.
  • Το pattern attribute απλά τα σπάει! Ελέγχει κατευθείαν στον browser το regular expression που έχει δηλωθεί στο pattern!

Video και Audio

Εδώ πέρα τα πράγματα ξεκίνησαν καλά και απλά, αλλά μια (τραγική;) παράληψη στο specification έκανε τα εύκολα δύσκολα! Όπως όλοι ξέρουμε ο κάθε κατασκευαστής browser αποφάσισε (ή θα αποφασίσει) να υποστηρίξει τον video codec που τον συμφέρει.

  • Χρησιμοποιώντας πολλαπλά source elements μπορούμε να φορτώσουμε πολλά διαφορετικά φορμάτ. Πολύ χρήσιμο για την κατάσταση που θα επικρατήσει.
  • Χρησιμοποιώντας το video element με codec Ogg Theora (.ogg), H.264 (mp4) και webM (βασισμένο στον VP8 codec της Google), είμαστε καλυμμένοι στους μοντέρνους browsers, ωστόσο 3 διαφορετικές κωδικοποιήσεις είναι πολλές για το ίδιο video.
  • Και μην ξεχνάτε πως πρέπει να το κωδικοποιήσουμε και σε Flash video για να παίζει σε παλιότερους browsers!
  • Στο audio τα πράγματα είναι αρκετά πιο απλά, μιας και με ένα mp3 έχουμε τελειώσει.
  • Στα θετικά είναι πως το API του video και audio tag είναι ακριβώς το ίδιο (αν θυμάμαι καλά το audio element έχει κανα-δυο λιγότερες methods και attributes – όπως πχ. width και height).

Canvas

Με το Canvas API μπορείς να κάνεις πραγματικά τρελά πράγματα, ωστόσο το θέμα accessibility είναι τεράστιο! Στην ουσία ότι “ζωγραφίζεται” πάνω στον καμβά, δεν μπορεί να διαβαστεί από screen readers. Είναι δηλαδή (προς το παρόν) ένα καθαρά οπτικό (visual) element/API, χωρίς μάλιστα να έχει προβλεφθεί κάποια εναλλακτική λύση για την προβολή περιεχομένου (όπως στο video tag για παράδειγμα)!

Client-side Data storage

Και εδώ δεν γνώριζα αρκετά πράγματα. Οι 2 σοβαρές τεχνολογίες ονομάζονται Web Storage και Web SQL Database (υπάρχει και μια τρίτη από την Mozilla η οποία μάλλον θα σβήσει – δεν θυμάμαι καν το όνομα της), με αρκετή υποστήριξη από τους browsers.

  • Το Web Storage είναι κάτι σαν cookies on steroids. Επίσης η τεχνολογία υποστηρίζετε από όλους (!!!) τους μοντέρνους browsers.
  • H Web SQL υποστηρίζεται σε Opera, Chrome και Safari ενώ η SQL μηχανή που χρησιμοποιούν είναι η SQLite (δεν γνωρίζω εάν το αναφέρει πουθενά το specification, ωστόσο αυτή την έκδοση SQL έχουν οι παραπάνω browsers).
  • Και πάλι θα συνεχίσουμε να γράφουμε για πολύ καιρό cookies για να υποστηρίξουμε τους παλιότερους browsers (fallback κώδικας).

Offline Application Caching

Μια τεχνολογία που δεν είχα ιδέα πως λειτουργούσε, η οποία αν και εντυπωσιακή για κάποιο λόγο δεν μου αρέσει ο τρόπος λειτουργίας της (ωστόσο θα ενθουσιάσει αυτούς που ασχολούνται με web servers, .htaccess files κτλ.). Πολύ απλά δηλώνουμε σε ένα “μανιφέστο” ποια αρχεία θέλουμε να cachαριστούν (αλήθεια πως θα το μεταφράζατε αυτό;) στον browser, έτσι ώστε το site/web app μας να συνεχίζει να λειτουργεί ακόμα και εάν πάψει να λειτουργεί η σύνδεση μας.

  • Η χρήση είναι σχετικά απλή, απλά δημιουργούμε ένα .manifest αρχείο στο οποίο αναφέρουμε τα αρχεία που θέλουμε να cashaρηστούν, και το δηλώνουμε στην markup μας (<html manifest="demo.manifest">). Για κάποιο λόγο ωστόσο δεν μου αρέσει αυτός ο τρόπος λειτουργίας… Με κάνει να αισθάνομαι κάπως έξω από τα νερά μου, μιας και όπως εξήγησα και πιο πάνω μοιάζει πιο πολύ με την δημιουργία κάποιου .htaccess αρχείου, κάτι που δεν κάνει συχνά κάποιος web designer (ή έστω front-end developer).

Geolocation

Ένα από τα πιο εύκολα και αγαπημένα μου χαρακτηριστικά. Το Geolocation API δεν είναι μέρος της HTML5, ωστόσο το αναφέρω για τους λόγους που εξήγησα στην εισαγωγή. Είναι σχετικά απλό (με 2 methods έχετε καθαρίσει – getCurrentPosition και watchPosition), και πιστεύω πως όλο και περισσότερα sites θα το χρησιμοποιούν για να μας δείχνουν πιο “ντόπια” προϊόντα, διαφημίσεις, νέα, προσφορές, κτλ. κτλ. Με λίγα λόγια, “θα φορεθεί πολύ”…

Web Messaging API, Web Workers API και Web Sockets API

Τα παραπάνω APIs τα αναφέρω και τα 3 μαζί μιας και είναι φτιαγμένα για καθαρά Web εφαρμογές (δεν είναι ούτε και αυτά μέρος της HTML5). Με τα παραπάνω APIs μας δίνονται οι παρακάτω δυνατότητες:

  • Το Web Messanging υποστηρίζεται από πολλούς browsers (και IE) και μας επιτρέπει να κάνουμε διάφορα ωραία, όπως να στέλνουμε μηνύματα σε άλλα domains κτλ. Φανταστείτε το κάτι σαν AJAX on steroids και αυτό.
  • Χρησιμοποιώντας Web Workers μπορούμε να κάνουμε την web εφαρμογή μας να τρέχει την Javascript σε διαφορετικά threads! Από μια γρήγορη ματιά που έριξα, η λογική είναι αρκετά πολύπλοκη και πιστεύω πως αυτήν την στιγμή είναι πολύ κακό για το τίποτα, ωστόσο οφείλω να ομολογήσω πως σε μια πολύπλοκη web εφαρμογή (φανταστείτε κάτι σε Photoshop στο web) μπορεί να κάνει τρελή διαφορά (πχ. να χρησιμοποιεί ένα φίλτρο, και ενώ ο web worker κάνει τους υπολογισμούς του, ο χρήστης να συνεχίζει να χρησιμοποιεί την εφαρμογή, χωρίς αυτή να φαίνεται σαν να έχει κολλήσει).
  • Τα Web Sockets ανοίγουν μια αμφίδρομη επικοινωνία μεταξύ του server και του client χρησιμοποιώντας τον browser σαν “μεσάζοντα”. Αρκετά βολικό και χρήσιμο…
Αυτές είναι οι πρώτες εντυπώσεις/σκέψεις μου για την HTML και όλα τα άλλα ωραία καλούδια που έρχονται μαζί της. Έχετε στο μυαλό σας πως  υπολογίζουν πως η HTML5 θα είναι 100% ολοκληρωμένη (σε browser επίπεδο τουλάχιστον) γύρω στο 2020 (!!!) ωστόσο δεν χάνουμε τίποτα με το να χρησιμοποιούμε και να μαθαίνουμε τα νέα χαρακτηριστικά της. Πολλά από αυτά άλλωστε υποστηρίζονται και από τους σημερινούς μοντέρνους browsers ενώ λογικά με την έλευση του IE9 θα δούμε ακόμα πιο πολλές HTML5-based εφαρμογές. Μην φοβάστε λοιπόν να την χρησιμοποιήσετε εδώ και τώρα, απλή HTML είναι άλλωστε 😉 Τα υπόλοιπα τα λέμε στα σχόλια!

GotAPI reference site

Όσοι από εσάς δεν τα πάνε καλά με τις σελίδες A4 και τα cheetsheets (όλο χάνονται, ποτέ δεν τα βρίσκεις όταν τα χρειάζεσαι, κτλ.) ή απλά έχουν οικολογικές ευαισθησίες, ας ρίξουν μια ματιά στο gotAPI.com! To εν λόγω site πρόκειται για ένα καταπληκτικό reference site, το οποίο προσφέρει ουσιαστικό reference σε πάρα πολλές τεχνολογίες, από απλή HTML και CSS μέχρι AJAX libraries και custom APIs (όπως το Flickr API). Πολύ βολικό για όλους εμάς, μιας και σε μία μόνο σελίδα μπορείς να προσθέσεις όλες τις τεχνολογίες που δουλεύεις και να έχεις πανεύκολα γρήγορο reference αλλά και παραδείγματα τους!!! Εμένα βρίσκεται πλέον μονίμως ανοιχτό σε κάποιο tab του Firefox…

Η HTML 5 έρχεται…

Για τα ανήσυχα μυαλά που θέλουν να είναι έτοιμοι πριν από όλους τους άλλους, το W3C δημοσίευσε την προηγούμενη εβδομάδα τα πρώτα specifications της HTML 5! Μαζί με τις διαφορές που υπάρχουν μεταξύ HTML 5 και HTML 4 καθώς και τον επίσημο οδηγό του web developer στην HTML 5, είναι τα πληρέστερα (και επίσημα) κείμενα που υπάρχουν για την νέα markup language, αυτήν την στιγμή.

Αν και δεν μπορώ να πω πως έχω μελετήσει αναλυτικά όλα τα παραπάνω specifications της HTML 5, έχω ανακαλύψει ήδη πολλά ενδιαφέροντα χαρακτηριστικά, όπως :

  • Πολλά νέα elements για καλύτερο και πιο semantic structure, όπως header, footer, nav, section, article, aside, dialog κτλ.
  • Πολλά βελτιωμένα elements για embedded content, όπως figure, audio και video. Στα δύο τελευταία δίνεται και η δυνατότητα ενσωμάτωσης user interface μέσω της markup αλλά και ενός API, έτσι ώστε ο χρήστης να μπορεί να ελέγχει το video/audio file. Το user interface θα δημιουργείτε από την rendering engine του εκάστοτε user agent!
  • time element, που θα αντιπροσωπεύει χρόνο (ημερομηνία, ώρα, κτλ.)
  • canvas element, για on-line rendering γραφικών
  • Templates elements όπως datatemplate, rule, and nest. Με αυτόν τον τρόπο η ίδια η markup αποκτά templating δυνατότητες!
  • Form validation μέσω της markup (σε client-side επίπεδο φυσικά). Έτσι στα input elements, δηλώνοντας απλά τον τύπο τους (type) στην markup (όπως πχ. date, number, email, url, κτλ) θα αναγκάζουμε τον user agent του browser να αναλαμβάνει το client-side validation

Μαζί με τα νέα χαρακτηριστικά, η καινούργια markup αφήνει πίσω της πολλά άχρηστα elements και attributes τα οποία είχαν παρατήσει εδώ και καιρό οι έμπειροι developers, όπως :

  • font, επιτέλους όλο το styling θα γίνεται αναγκαστικά μέσω CSS
  • frame, frameset και noframes. Δεν νομίζω πως χρειάζονται περαιτέρω διευκρινήσεις για την επιλογή του W3C σε αυτό το θέμα
  • applet
  • Όλες τις presentational attributes όπως : align, background, bgcolor, cellpadding, cellspacing, border, valign κτλ. Εάν κάποιος θέλει να τις χρησιμοποιήσει, θα πρέπει και πάλι να στραφεί στην CSS

Τέλος αξίζει να σημειωθεί πως πάνω στην καινούργια markup θα χτιστούν και πολλά API για την ευκολότερη υλοποίηση web εφαρμογών, όπως :

  • 2D drawing API το οποίο θα χρησιμοποιείται για on-line rendering γραφικών μέσω του νέου canvas element
  • API για την δημιουργία interface στοιχείων (όπως play, pause, κτλ.) στα video και audio elements
  • Δυνατότητα client-side αποθήκευσης δεδομένων. Τώρα αυτό το κομμάτι δεν ξέρω πως θα υλοποιηθεί από τον κάθε browser, αλλά θα μάθουμε σύντομα περισσότερες λεπτομέρειες
  • API για δημιουργία offline web εφαρμογών. Έτσι ακόμα και εάν δεν υπάρχει internet access, η web εφαρμογή θα συνεχίσει να λειτουργεί κανονικά! Σε συνδυασμό με το χαρακτηριστικό μιας client-side database καταλαβαίνουμε όλοι πόσο μπροστά θα πάνε τα πράγματα
  • Drag and drop API, το οποίο θα μπορεί να γίνει attached σε σχεδόν οποιοδήποτε element μέσω της νέας draggable attribute
  • Editing API, το οποίο θα λειτουργεί με τα elements που έχουν την νέα contenteditable attribute. Όπως καταλαβαίνεται τα Wiki-like και γενικότερα τα social-based sites θα περάσουν σε άλλο επίπεδο
  • Network API
  • Διάφορα άλλα API μικρότερης σημασίας ή πιο εξειδικευμένων λειτουργιών

Εάν έχετε κάποια εμπειρία σε (X)HTML και βαριέστε να διαβάσετε όλα τα specifications της HTML 5 (όπως εγώ), προτείνω να ξεκινήσετε από το κείμενο που περιγράφει τις διαφορές που έχει με την HTML 4. Το κείμενο είναι περιεκτικότατο, σαφέστατο και δεν κουράζει καθόλου (σε αντίθεση με τα επίσημα specifications)! Καλό διάβασμα!

Mozilla Weave

Τα εργαστήρια της Mozilla έχουν ανακοινώσει εδώ και κάποιες μέρες το Mozilla Weave, το οποίο σαν ιδέα ακούγεται πολύ ενδιαφέρουσα, ωστόσο πιστεύω πως αυτή την στιγμή το όλο project είναι απλά ένα concept και τίποτα παραπάνω. Η ιδέα λοιπόν είναι η κατασκευή ενός layer υπηρεσιών μεταξύ του Firefox και του internet το οποίο θα ονομάζεται Weave, έτσι ώστε να έχεις πάντα στην κατοχή σου και από οποιοδήποτε μηχάνημα, πληροφορίες όπως ιστορικό (history) του browser, bookmarks, preferences, documents και διάφορα άλλα αρχεία. Το όνειρο της Mozilla όπως μπόρεσα να καταλάβω, είναι πως πέρα από αυτά τα browser χαρακτηριστικά και ευκολίες που θα προσφέρει για τον Firefox μέσω του Weave, είναι και η δημιουργία εργαλείων και API έτσι ώστε να έχουν την δυνατότητα και προγραμματιστές τρίτων site, όπως πχ. del.icio.us και Flickr να βοηθήσουν τους χρήστες που θα χρησιμοποιούν Firefox με χαρακτηριστικά όπως αυτόματο login ανεξάρτητα από το computer που χρησιμοποιούν, ενωποίηση των site τους με τον browser, όπως για παράδειγμα τα bookmark του del.icio.us να ελέγχονται και να ανανεώνονται κατευθείαν μέσω του browser, και άλλα αντίστοιχα καλούδια. Όπως όλοι καταλαβαίνετε το Weave γίνεται και ακόμα πιο διασκεδαστικό όταν σε όλα αυτά εισέρχεται και ο όρος “social“, όπου θα υπάρχει η δυνατότητα να μοιράζεται με φίλους και γνωστούς σας τις φωτογραφίες, τα links σας και γενικότερα ότι άλλη πληροφορία βρίσκεται on-line ή χρησιμοποιείτε σε κάποια on-line υπηρεσία πολύ πιο εύκολα και γρήγορα (μέσω του browser σας!).

Όπως ανέφερα και παραπάνω το Mozilla Weave είναι σε πολύ πρώιμο στάδιο αυτήν την στιγμή και πιστεύω πως ούτε και η ίδια η Mozilla δεν ξέρει τι ακριβώς φτιάχνει. Επειδή έριξα μια ματιά στο documentation νομίζω πως αυτό που περιγράφω παραπάνω είναι και αυτό που θέλει να πετύχει και η Mozilla πάνω-κάτω, ωστόσο μπορεί να κάνω και λάθος. Όπως και να έχει πιστεύω πως το Weave θα αργήσει πολύ ακόμα, αλλά εάν τελικά καταφέρει να δημιουργήσει κάτι τέτοιο η Mozilla, και πείσει άλλα site και vendors να υποστηρίξουν τις εφαρμογές τους σε αυτό, μπορούμε να μιλάμε για την αρχή του intrenet OS, μιας και οι εφαρμογές θα είναι on-line υπηρεσίες, και θα ελέγχονται από ένα browser Operating System!!! Το κλειδί στην ιστορία είναι να κλείσει συμφωνίες με τα μεγάλα site και υπηρεσίες, και να στηρίξει την όλη προσπάθεια σε ανοιχτά και standards-based εργαλεία, κάτι πού ήδη έχει δηλώσει και που πιστεύω πως δεν θα το διαψεύσει Είμαι πολύ περίεργος να δω τι θα γίνει τελικά με αυτό το θέμα…

Mapstraction: η library για χάρτες

Η Mapstraction είναι μία Javascript library, η οποία παρέχει ένα κοινό API για δημιουργία χαρτών σε όλα τα Javascript APIs που υπάρχουν εκεί έξω! Το παραπάνω με απλά λόγια σημαίνει πως μπορείτε να δημιουργήσετε εύκολα και γρήγορα κάποιον χάρτη από οποιαδήποτε μεγάλη υπηρεσία, όπως Google Maps, Yahoo! Maps, Microsoft Virtual Earth Maps και πολλά άλλα, χρησιμοποιώντας μόνο την Mapstraction library! Τώρα πολύ έξυπνα θα ρωτήσει κάποιος, και γιατί να μην χρησιμοποιήσεις κατευθείαν τα επίσημα API των άλλων εταιρειών? Για δύο πολύ σημαντικούς λόγους :

  1. Μαθαίνοντας μόνο μία library μπορείς να την χρησιμοποιήσεις σε όλα τα map APIs εκεί έξω, άρα μαθαίνεις μία library και την χρησιμοποιείς σε όλα!
  2. Εάν το αφεντικό/πελάτης σας αλλάξει γνώμη τελευταία στιγμή για την υπηρεσία χάρτη που θέλει να έχει το site (πχ. αντί για Google Maps, του έρθει το Microsoft Virtual Earth Maps), δεν χρειάζονται αλλαγές στον κωδικά! Το μόνο που αλλάζει είναι μια γραμμή που υποδηλώνει την υπηρεσία που θα χρησιμοποιείτε!

Όποιοι δουλεύεται με χάρτες σε projects, σκεφτείτε σοβαρά την συγκεκριμένη πρόταση, γιατί σίγουρα θα σας λύσει τα χέρια!

HTML 5 και XHTML 2: ο νέος πόλεμος στο web

Έτσι όπως εξελίσσεται η κατάσταση, ο νέος πόλεμος στο web δεν θα γίνει ανάμεσα σε browsers αλλά σε τεχνολογίες (υπάρχει και η πιθανότητα να συνεχιστεί και στους browsers, αλλά το πρόβλημα θα προκύψει από τις τεχνολογίες που θα αποφασίσουν να υποστηρίξουν)! Αυτήν την στιγμή λοιπόν, οι αντικαταστάτες της κλασικής μας (X)HTML markup είναι δύο, και μάλιστα με αρκετές διαφορές τόσο στον κώδικα (elements, attributes, κτλ.) όσο και στην φιλοσοφία τους. Φυσικά κάνω λόγο για την HTML 5 και την XHTML 2 οι οποίες βρίσκονται αυτήν την στιγμή σε κατάσταση working drafts, πράγμα που σημαίνει ότι θα καθυστερήσουν αρκετά να ολοκληρωθούν και ακόμα πιο πολύ να τις υποστηρίξουν οι διάφοροι browsers, αλλά όπως και να έχει η ερώτηση είναι εξής : Πως προέκυψαν δύο web standards για την ίδια δουλεία?!?!

Καλύτερα να τα πάρουμε τα πράγματα από την αρχή. Στην αρχή λοιπόν τα πράγματα ήταν πολύ απλά με την HTML 1 να είναι η μοναδική markup στον internet, απόγονος της πολύ παλιάς αλλά και δοκιμασμένης SGML. Επειδή σιγά-σιγά το internet άρχισε να γίνεται πιο διάσημο και mainstream λοιπόν, κάποιοι, κατασκευαστές browser κυρίως, άρχισαν να προσθέτουν επιπλέον presentational (παρουσιαστικά) tags και ιδιότητες στην λιτή HTML και να χαλάνε την δομή της (structure) με αυτά, όπως font tags, nested tables, και πολλά άλλα, ενώ η κατάσταση είχε ξεφύγει τελείως από το W3C που δρούσε σαν απλός παρατηρητής. Μετά λοιπόν από τις HTML version 2 και 3, και τον πόλεμο τον browsers που υπήρχε μέχρι και εκείνη την στιγμή, κάποιοι developers όπως ο Jeffrey Zeldman, ο Eric Meyer, και πολλοί άλλοι, αποφάσισαν να πείσουν όλους τους υπόλοιπους, developers και κατασκευαστές browser να χρησιμοποιούν τα επίσημα standards του W3C για την δημιουργία web sites! Είναι η περίοδος που η HTML 4.01 είναι η νεότερη έκδοση της markup για το internet, ενώ έχει ήδη αρχίσει να χρησιμοποιείται από τους πιο σκληροπυρηνικούς και ψαγμένους η νέα XHTML όπου είναι στην ουσία η κλασική HTML 4 αναδιατυπωμένη σαν XML (δεν ήξερα πως αλλιώς να μεταφράσω το reformulation!). Η μεγάλη διαφορά της XHTML με την HTML είναι πως προσπαθεί να συμμαζέψει το περιεχόμενο (content) σε μια ακόμα καθαρότερη δομή (structure), άλλοτε με πιο αυστηρούς κανόνες και άλλοτε όχι – ανάλογα με το doctype – και να αφήσει το παρουσιαστικό (presentation) κομμάτι σε άλλη τεχνολογία, την CSS. Με αυτόν τον τρόπο η markup θα ξαναχρησιμοποιηθεί για τον λόγο που είχε εφευρεθεί, την σωστή δομή του περιεχομένου δηλαδή!

Στην συνέχεια έρχεται μια μεταβατική περίοδος στο web, όπου τα μεγάλα site έχουν φτάσει τις συγκεκριμένες τεχνολογίες στα όρια τους και χρειάζονται κάτι πιο δυνατό για το Web 2.0 το οποίο έχει ήδη αρχίσει να δημιουργείται. Κάπου εδώ ξεκινάει και το μπέρδεμα. Το επίσημο W3C ξεκινάει λοιπόν το draft της XHTML 2, όμως κάποιοι ανεξάρτητοι – κατασκευαστές browser, web developers, ανεξάρτητοι οργανισμοί κτλ. – δημιουργούν την WHATWG community και ξεκινάνε το draft της HTML 5 (και των Web Forms 2.0), το οποίο μετά από κάποιο καιρό το παραδίδουν στο W3C και γίνεται και αυτό επίσημο standard! Έτσι αυτήν την στιγμή έχουμε δύο επίσημους διαδόχους τις (X)HTML οι οποίοι μάλιστα έχουν πάρει και αρκετά διαφορετικές κατευθύνσεις σε θέματα αρχιτεκτονικής και σχεδιασμού!

Αυτήν την στιγμή κανένα από τα δύο recomendations δεν είναι επίσημο ή έχει περισσότερη υποστήριξη, αλλά το μπέρδεμα έχει ήδη γίνει και μάλιστα είναι πολύ μεγάλο! Καταρχάς, τι θα γίνει εάν κάποιοι browsers επιλέξουν να υποστηρίξουν ένα από τα δύο standards (extreme σενάριο, αλλά ας μην ξεχνάμε πως ακόμα κάποιοι browsers προσπαθούν να υποστηρίξουν standards 7 χρόνων παλιά!). Επίσης τι θα γίνει σε development επίπεδο, όπου κάποια site θα υποστηρίξουν την μία markup και κάποια την άλλη? Όπως ανέφερα οι markup είναι πολύ διαφορετικές μεταξύ τους, ενώ η HTML 5 έρχεται και με διάφορα Javascript APIs για ευκολότερο development σε αυτήν, το οποίο όμως μπορεί να μπερδέψει πολλούς developers (ιδιαίτερα νέους), αλλά και κατασκευαστές browsers, οι οποίοι θα πρέπει να ενσωματώσουν στους καινούργιους browsers πολλά νέα APIs. Και σαν να μην έφταναν τα παραπάνω μπερδέματα, το θέμα μπορεί να γίνει και ακόμα πιο περίπλοκο μιας και η HTML 5 για παράδειγμα (στην οποία έχω ρίξει μια καλύτερη ματιά), έχει ήδη δύο parsing modes, ένα σαν HTML και ένα σαν XML, με το πρώτο να είναι πιο συμβατό με παλιότερους browsers ενώ το δεύτερο η αυστηρότερη έκδοση του και χρήση του σαν XML εφαρμογή! Υποθέτω πως και η XHTML 2 θα έχει ανάλογες επιλογές για parsing.

Όπως εύκολα μπορεί να καταλάβει ο μέσος web developer/designer, η κατάσταση είναι αρκετά μπερδεμένη, ενώ εντύπωση μου κάνει πως κανένας επίσημος φορέας, όπως το W3C ή άλλοι μεγάλοι οργανισμοί και guru, δεν έχουν κάνει κανένα σχόλιο πάνω σε αυτό το σημαντικότατο θέμα. Για την ακρίβεια δεν το έχουν θίξει καν! Ξέρω πως και οι δύο τεχνολογίες έχουν πολύ δρόμο ακόμα να διανύσουν, ο Lachlan Hunt στο άρθρο του A Preview of HTML 5 υπολογίζει πως η HTML 5 θα χρειαστεί περίπου άλλα 10 με 15 χρόνια (άρα άλλα τόσα θα χρειαστεί και η XHTML 2), αλλά γιατί να μην γινόντουσαν τα πράγματα πιο απλά για όλους μας ?!?! Ελπίζω η κατάσταση να αλλάξει σύντομα και το τοπίο να ξεκαθαρίσει στο συγκεκριμένο θέμα έτσι ώστε να βοηθηθούν όλοι και να παρθούν γρηγορότερα κάποιες αποφάσεις, γιατί η αλήθεια είναι πως όλοι μας χρειαζόμαστε μια νέα markup! Πολλές ενδιαφέρουσες απόψεις πάνω στο θέμα μπορεί κάποιος να βρει στο άρθρο της IBM, HTML V5 and XHTML V2, ενώ το καινούργιο άρθρο του A List Apart έχει ένα αναλυτικό preview στην HTML 5, και φυσικά για τους πιο σκληροπυρηνικούς υπάρχουν και τα επίσημα drafts.

Open Social : Το απόλυτο API

Το Open Social είναι το νέο υπέρ-API της Google, το οποίο έχει σαν στόχο να διευκολύνει τους developers να δημιουργήσουν web εφαρμογές για social networking sites κάτω από ένα ενοποιημένο API. Μπορεί κάποιος να το χαρακτηρίσει και σαν την Java των social networking sites, αφού γράφοντας κάποια web εφαρμογή πάνω στο συγκεκριμένο API, θα μπορεί να χρησιμοποιηθεί σε όσα site υποστηρίξουν το Open Social. Τα site που έχουν ήδη συμφωνήσει είναι αρκετά, όπως Engage.com, Friendster, hi5, Hyves, imeem, LinkedIn, MySpace, Ning, Oracle, orkut, Plaxo, Salesforce.com, Six Apart, Tianji, Viadeo και XING, ενώ το Facebook είναι ο μεγάλος απών της λίστας (ας μην ξεχνάμε πως ένα πολύ μικρό κομμάτι μετοχών του Facebook κατέχει πλέον η Microsoft, η μεγαλύτερη αντίπαλος της Google).

Τα παραπάνω site λοιπόν θα αφομοιώσουν τα χαρακτηριστικά του Open Social (κάποιοι ήδη άρχισαν να το ονομάζουν και plug-in API) και θα λειτουργούν σαν “containers” των εφαρμογών του. Το σκεπτικό δηλαδή είναι ίδιο με αυτό του Facebook (όπου λειτουργεί σαν container των Facebook εφαρμογών), απλά στην περίπτωση του Open Social μιλάμε για κάτι πολύ πιο μεγάλο, το οποίο θα χρησιμοποιεί πολλά sites σαν “containers” και οι εφαρμογές θα μπορούν να τρέξουν native και χωρίς κανένα customization σε όλα αυτά! Από ότι διάβασα, αν και δεν είναι τίποτα σίγουρο ακόμα, η Google δεν θέλει να δημιουργίσει νέες markup και Query languages για την λειτουργία του API, σε στυλ FBML (Facebook Markup Language) and FQL (Facebook Query Language), αλλά σκέφτεται να στηρίξει όλο της το API σε W3C standard τεχνολογίες, όπως (X)HTML και Javascript! Εάν τελικά γίνει κάτι τέτοιο, ο οποιοσδήποτε γνωρίζει Javascript και HTML θα μπορεί να δημιουργήσει αμέσως εφαρμογές για το Open Social, κάτι που βρίσκω πολύ ενθαριντικό.

Η κίνηση της Google είναι πολύ έξυπνη, μιας και έχει καταλάβει που θα παιχτεί το παιχνίδι στο μέλλον (στο web software και όχι στο desktop/παραδοσιακό), ενώ προσωπικά μου αρέσει και η δυνατότητα που δίνει σε μικρότερους παίχτες (όπως πχ. έλληνες developers) να μπορέσουν να δημιουργήσουν κάτι που θα τρέχει σε πολλά μεγάλα site ταυτόχρονα και φυσικά την δυνατότητα ανάδειξης τους (κάτι που λείπει από την μικρή ελληνική αγορά). Φυσικά υπάρχει και ο γνωστός αντίλογος όπου η Google παρουσιάζεται σαν την Microsoft του web (κάτι που ισχυεί φυσικά), πως η εταιρεία θα ελέγχει ακόμα περισσότερα προσωπικά μας δεδομένα, πως προσπαθεί να ελέγξει άλλα site χρησιμοποιώντας την μηχανή αναζήτησης της και άλλες υπηρεσίες της (όπως το συγκεκριμένο API) και άλλα ανάλογα σενάρια. Σίγουρα έχουν κάποιο δίκιο, ωστόσο η δύναμη της Google στηρίζεται στους χρήστες της, κάτι που γνωρίζει καλύτερα από όλους, οπότε πρέπει να προσέξει χίλιες φορές πιο περισσότερο πριν αποφασίσει να εξοργίσει κάποιους από αυτούς και φυσικά να τους χάσει. Πάντως εγώ από την μεριά του developer, και ιδιαίτερα του έλληνα developer, θα με ενδιέφερε κάτι που φτιάχνω να το δει όσος περισσότερος κόσμος γίνεται και φυσικά εάν είναι καλό να πάρω τα ανάλογα credits.

Τέλος για όσους θέλουν να διαβάσουν περισσότερες πληροφορίες για το Open Social, μπορούν να ρίξουν μια ματιά στο επίσημο blog του καθώς και στα δύο πολύ ενδιαφέροντα άρθρα του Marc Andreessen.