Μετακίνηση από το φλας στο html5

Τον Νοέμβριο του 2011, η Adobe ανακοίνωσε ότι θα διακόψει την ανάπτυξη του Flash Player για κινητές συσκευές μετά την κυκλοφορία του Flash Player 11.1 για τις συσκευές Android και το BlackBerry Playbook, προτιμώντας να επικεντρωθεί σε εργαλεία για την κατασκευή εφαρμογών HTML5 για κινητές συσκευές. Παρόλο που η Adobe επιβεβαίωσε την υποστήριξή της στο Flash Player για προγράμματα περιήγησης προσωπικών υπολογιστών, πολλοί πιστεύουν ότι είναι απλώς θέμα χρόνου πριν η Adobe τερματίσει την υποστήριξη για την έκδοση PC. Αυτό είναι κακά νέα για τις εταιρείες που επενδύονται σε εφαρμογές Flash, καθώς και για προγραμματιστές που έχουν επενδύσει χρόνο για να αποκτήσουν τις δεξιότητες προγραμματισμού που απαιτούνται για την κατασκευή εφαρμογών Flash.

Ας δούμε μερικές από τις διαφορές μεταξύ του Flash και του HTML5 και παρέχουμε μερικές συμβουλές και εργαλεία για να διευκολύνουμε τη μετάβαση μεταξύ αυτών των δύο πλατφορμών.

Βασικά στοιχεία της πλατφόρμας Flash

Το Flash συχνά χρησιμοποιείται ως όρο ομπρέλα για να αναφερθεί σε μια ιδιόκτητη πλατφόρμα Adobe που αποτελείται από τα ακόλουθα στοιχεία:

• Flash: Ένα εργαλείο που χρησιμοποιείται κυρίως για το σχεδιασμό και τη δημιουργία κινούμενων εικόνων
• Flex: Το περιβάλλον ανάπτυξης που χρησιμοποιείται για την κατασκευή εφαρμογών, συμπεριλαμβανομένου ενός κιτ ανάπτυξης λογισμικού (SDK)
• MXML: Γλώσσα σήμανσης που χρησιμοποιείται σε έργα Flash
• ActionScript: Μια γλώσσα scripting

Για να εκτελέσετε μια εφαρμογή Flash σε ένα πρόγραμμα περιήγησης στο Web, πρέπει να γίνει λήψη του plug-in Flash Player. Ως εναλλακτική λύση, μια εφαρμογή Flash μπορεί να μεταγλωττιστεί για να εκτελεστεί στο περιβάλλον λειτουργίας runtime της επιφάνειας εργασίας Adobe AIR. Και πάλι, το Adobe AIR πρέπει να εγκατασταθεί στον υπολογιστή του χρήστη για να εκτελεστεί μια εφαρμογή AIR.

Το Flash χρησιμοποιεί τις ακόλουθες κύριες μορφές αρχείων:

• .fla: αρχείο έργου Flash
• .flv: αρχείο βίντεο Flash
• .swf: Σύνταξη αρχείου εφαρμογών Flash / Flex που μπορεί να περιέχει αρχεία .flv

Βασικά στοιχεία της πλατφόρμας HTML5

Το HTML5 είναι μια ανοιχτή τυποποιημένη πλατφόρμα που αποτελείται από τα εξής:

• HTML5: Γλώσσα σήμανσης που χρησιμοποιείται για τη δημιουργία ιστοσελίδων
• Διακοσμητικά φύλλα στυλ 3 (CSS3): Γλώσσα φύλλου στυλ που χρησιμοποιείται για τον προσδιορισμό της μορφοποίησης για αντικείμενα σε μια ιστοσελίδα HTML5
• Διεπαφές προγραμματισμού εφαρμογών (API): API για υποστήριξη λειτουργιών όπως η μεταφορά και απόθεση και η ανταλλαγή μηνυμάτων μεταξύ εγγράφων
• JavaScript: Γλώσσα δέσμης ενεργειών που χρησιμοποιείται με HTML5 για ενεργοποίηση της κινούμενης εικόνας

Ένα από τα πλεονεκτήματα του HTML5 είναι ότι τρέχει σε προγράμματα περιήγησης στο Web και δεν απαιτεί plug-in. Ωστόσο, για να λειτουργεί σωστά, ένα πρόγραμμα περιήγησης πρέπει να υποστηρίζει τις λειτουργίες HTML5 και CSS3 για μια ιστοσελίδα HTML5. Τα μεγάλα προγράμματα περιήγησης έχουν διαφορετικά επίπεδα υποστήριξης για HTML5 και CSS3 και η εφαρμογή δεν είναι πλήρης. Το JavaScript υποστηρίζεται σχεδόν καθολικά από προγράμματα περιήγησης. Ωστόσο, οι χρήστες έχουν την επιλογή να "απενεργοποιήσουν" το JavaScript, οπότε δεν δημιουργούνται δέσμες ενεργειών που δημιουργούνται με JavaScript.

Οι μορφές αρχείων HTML5 περιλαμβάνουν τα εξής:

• .htm / .html: αρχείο HTML5 ιστοσελίδας
• .css: αρχείο φύλλου στυλ CSS3

Από το 2011, η τρέχουσα προδιαγραφή HTML5 δεν καθορίζει τις υποστηριζόμενες μορφές αρχείων βίντεο, αφήνοντας στα μεμονωμένα προγράμματα περιήγησης να επιλέξουν ποιες μορφές θα υποστηρίξουν. Οι τρέχουσες υποστηριζόμενες μορφές περιλαμβάνουν τα εξής:

• .mp4: αρχείο βίντεο MPEG 4 με κωδικοποιητή βίντεο H.264 και κωδικοποιητή ήχου AAC
• .webm: αρχείο βίντεο WebM με κωδικοποιητή βίντεο VP8 και κωδικοποιητή ήχου Vorbis
• .ogg: αρχείο βίντεο Ogg με κωδικοποιητή βίντεο Theora και κωδικοποιητή ήχου Vorbis

Μετατροπή έργων Flash σε HTML5

Η μη αυτόματη μετατροπή ενός σύνθετου έργου Flash σε HTML5 είναι μια διαδικασία έντασης εργασίας και χρονοβόρα, λόγω διαφορών πλατφόρμας. Ο προγραμματιστής πρέπει να μετατρέψει τις κινούμενες εικόνες που έχουν δημιουργηθεί με το Flash και το ActionScript σε HTML5 και JavaScript. Ευτυχώς, υπάρχουν μερικά εργαλεία που βοηθούν στην αυτοματοποίηση της μετατροπής από το Flash σε HTML5.

Η Adobe έχει κυκλοφορήσει το Wallaby, ένα πειραματικό εργαλείο που μπορεί να μεταφορτωθεί δωρεάν από την ιστοσελίδα του Adobe Labs. Το Wallaby παίρνει ένα αρχείο έργου Flash (.fla) ως είσοδο και εξαγωγή HTML5 και υποστηρίζει αρχεία CSS και JavaScript. Ωστόσο, οι σημειώσεις έκδοσης του Wallaby περιέχουν μια αρκετά μεγάλη λίστα χαρακτηριστικών που δεν έχουν μετατραπεί - τα σημαντικότερα εκ των οποίων είναι η ActionScript, οι ταινίες και ο ήχος. Το Wallaby είναι ένα περιορισμένο εργαλείο που έχει σχεδιαστεί κυρίως για τη μετατροπή κινούμενου γραφικού περιεχομένου σε HTML5, έτσι ώστε να μπορεί να ενσωματωθεί σε ιστοσελίδες χρησιμοποιώντας ένα εργαλείο σχεδίασης ιστοσελίδων.

Το Google Labs έχει κυκλοφορήσει το Swiffy, ένα δωρεάν εργαλείο που βασίζεται στο Web και μετατρέπει ένα αρχείο εφαρμογής Flash (.swf) σε HTML5. Η έξοδος μπορεί στη συνέχεια να ενσωματωθεί σε μια ιστοσελίδα, αλλά δεν είναι εύκολη για έναν προγραμματιστή να επεξεργαστεί. Όπως και η Wallaby, η Swiffy δεν μετατρέπει όλες τις λειτουργίες του Flash. Το Swiffy υποστηρίζει τη μετατροπή ActionScript, αλλά μόνο η έκδοση 2.0 (ActionScript είναι αυτή τη στιγμή στην έκδοση 3.0). Η έξοδος Swiffy τρέχει μόνο σε προγράμματα περιήγησης που υποστηρίζουν Scalable Vector Graphics (SVG).

Edge, ένα νέο εργαλείο ανάπτυξης για HTML5

Καθώς η HTML5 γίνεται η πλατφόρμα επιλογής, αναδύονται νέα εργαλεία που παρέχουν περιβάλλοντα σχεδιασμού και ανάπτυξης που ενσωματώνουν HTML5, CSS3 και JavaScript.

Τον Αύγουστο του 2011, η Adobe κυκλοφόρησε μια έκδοση προεπισκόπησης του εργαλείου ανάπτυξης Edge. Το Edge επιτρέπει σε έναν σχεδιαστή να δημιουργήσει κινούμενα σχέδια HTML5 και να προσθέσει κινούμενα σχέδια σε υπάρχοντα έργα HTML5. Οι σχεδιαστές Flash θα αναγνωρίσουν ορισμένα γνωστά στοιχεία στο περιβάλλον εργασίας χρήστη Edge, συμπεριλαμβανομένου του σταδίου, των παραθύρων ιδιοτήτων και της γραμμής χρόνου κίνησης. Το Edge, ωστόσο, δημιουργεί αρχεία CSS και JavaScript και το περιεχόμενο κινούμενης εικόνας αποθηκεύεται σε δομή δεδομένων JSON (Object Notation).

Τη στιγμή της γραφής, η Edge αναμένει την τέταρτη απελευθέρωσή της. Νέες λειτουργίες προστίθενται σε κάθε έκδοση.

Μετατροπή του YouTube σε HTML5

Ένα σημάδι της μετάβασης στο HTML5 είναι ότι το YouTube τώρα προσφέρει τη δυνατότητα χρήσης ενός βίντεο αναπαραγωγής HTML5 για την προβολή βίντεο.

Πριν από την προσφορά της επιλογής HTML5, όλα τα βίντεο του YouTube μεταδόθηκαν μέσω ενός βίντεο αναπαραγωγής Flash. Οι χρήστες θα μπορούσαν να μεταφορτώσουν αρχεία βίντεο σχεδόν σε οποιαδήποτε μορφή και το YouTube θα μετατρέψει κάθε βίντεο στην απαιτούμενη μορφή Flash (.flv).

Το YouTube κωδικοποιεί πλέον βίντεο με τον κωδικοποιητή βίντεο H.264 και τη μορφή WebM για την παράδοση HTML5. Για να προβάλετε βίντεο στη μορφή HTML5, πρέπει να έχετε ένα πρόγραμμα περιήγησης που υποστηρίζει την ετικέτα βίντεο HTML5 και μια μορφή βίντεο που χρησιμοποιείται από το YouTube.

Η κληρονομιά του Flash

Όπως σημειώθηκε προηγουμένως, η Adobe συνεχίζει την ανάπτυξη στην έκδοση PC του Flash Player - για τώρα. Ακόμα και αν η Adobe σταματήσει να υποστηρίζει το Flash Player στο μέλλον, οι εφαρμογές Flash θα εξακολουθήσουν να υποστηρίζονται στον Ιστό - πιθανόν για χρόνια. Συνεπώς, το Flash δεν ξεφεύγει καθόλου σύντομα. Εργαλεία είναι διαθέσιμα για τη μετατροπή εφαρμογών Flash σε εφαρμογές HTML5, αλλά αυτή τη στιγμή, αυτά τα εργαλεία δεν υποστηρίζουν τη μετατροπή όλων των λειτουργιών του Flash. Καθώς το πρότυπο HTML5 κυριαρχεί, είναι πιθανό τα εργαλεία μετατροπής αρχείων Flash να γίνουν πιο εξελιγμένα και να δημιουργηθούν νέα εργαλεία για την ανάπτυξη περιεχομένου με την πλατφόρμα HTML5.