Flash-Centric παρερμηνείες του HTML5
Με σχεδόν μια δεκαετία εμπειρίας στον σχεδιασμό ιστοσελίδων, έχω συναντήσει αρκετές λανθασμένες πεποιθήσεις για τα τελευταία εργαλεία και τεχνολογίες σχεδιασμού. αλλά τίποτα δεν χτυπά τις παρερμηνείες γύρω από τη χρήση του HTML 5.
Ως προγραμματιστές έχουμε τη δική μας σειρά λανθασμένων πεποιθήσεων σχετικά με μια συγκεκριμένη τεχνολογία, αλλά καθώς αρχίζουμε να χρησιμοποιούμε την τεχνολογία αυτή, μπορούμε να κατανοήσουμε το όλο θέμα, τη χρήση και το πεδίο εφαρμογής της.
Εμπνευσμένη από ορισμένες απαιτήσεις HTML5 που έχω συναντήσει με την πάροδο του χρόνου, ήθελα να προσθέσω τα δύο λεπτά μου για να καθαρίσω τον αέρα σε ορισμένες πτυχές του HTML5. Οι περισσότερες παρερμηνείες σχετικά με το HTML5 είναι επειδή πολλοί άνθρωποι σκέφτονται ότι αντικαθιστούν το Flash.
Καταρχάς, θα ήθελα να καταστήσω σαφές ότι δεν πρόκειται για μια ανάρτηση HTML5 σε σχέση με το Flash. Η αλήθεια είναι ότι δεν μπορεί κανείς να ενεργήσει ως αντικαταστάτης του άλλου, οπότε δεν υπάρχει μάχη «εμείς εναντίον τους». Αλλά, εκεί είναι το κενό των παρανοήσεων. Το πρόβλημα είναι ότι οι άνθρωποι πιστεύουν ότι το HTML5 είναι μια βελτιωμένη εναλλακτική λύση στο Flash. Όλες οι παρανοήσεις είναι αποτέλεσμα αυτής της σκέψης.
Τεχνική επισκόπηση της HTML 5
Η πέμπτη σημαντική αναθεώρηση της γλώσσας του Παγκοσμίου Ιστού μπορεί να γραφτεί και σε σύνταξη HTML και XML και έχει ενσωματωθεί ειδικά σε λεπτομερή μοντέλα επεξεργασίας για τη διευκόλυνση των διαλειτουργικών υλοποιήσεων και την ταυτόχρονη βελτίωση της σήμανσης για έγγραφα HTML και εφαρμογές ιστού. Βασικός σκοπός του είναι να επιλύσει την εξάρτηση μεταξύ των πλατφορμών στην βιομηχανία ιστού.
Εάν όλα αυτά ακούγονται Ελληνικά για εσάς, ας ξεδιπλώσουμε τι κάνει το HTML5 σε μια γλώσσα που είναι εύκολα κατανοητή, χωρίς να μπείτε στα σύνθετα τεχνικά χαρακτηριστικά:
- Το HTML5 είναι μια ενημερωμένη γλώσσα σήμανσης που ακολουθεί τα πρότυπα XML.
- Η ιδέα πίσω από το HTML5 είναι να εξασφαλιστεί η συνεκτικότητα στην απόδοση και την απόδοση των προϊόντων web σε όλα τα λειτουργικά συστήματα, συμπεριλαμβανομένων των iOS, Android, Windows, μεταξύ πολλών άλλων.
Οι πιο κοινές παρανοήσεις σχετικά με το HTML είναι σχεδιαστικές. Ας ρίξουμε μια ματιά στο τι προσφέρει το HTML 5 από την άποψη του σχεδιασμού.
- Η ενσωματωμένη υποστήριξη ήχου και βίντεο, η οποία βοηθά στην ενσωμάτωση μέσων απευθείας σε έγγραφα HTML, έχει καταστήσει περιττή τη χρήση εξωτερικών πινάκων.
- Το HTML5 υποστηρίζει στοιχεία SVG και καμβά για κινούμενα σχέδια.
- Προσφέρει στους σχεδιαστές ένα στοιχείο καμβά που διευκολύνει την απόδοση γραφικών 2D σε 'άμεση λειτουργία'. Αυτό σημαίνει ότι γραφικά αντικείμενα μεταδίδονται απευθείας στην οθόνη.
- Έχει αναπτυχθεί για τη δημιουργία διαδραστικών εφαρμογών που είναι βαρύ περιεχόμενο και δεν είναι μόνο φιλικές προς τον χρήστη, αλλά και φιλικές προς το SEO.
Γιατί οι άνθρωποι πιστεύουν ότι το HTML5 είναι ένα υποκατάστατο Flash;
Το Flash είναι ένα πρόγραμμα δημιουργίας πολυμέσων το οποίο βοηθά στην παροχή διαδραστικού περιεχομένου περιεχομένου, το οποίο παρέχει στους χρήστες πλούσια εμπειρία στο web. Είναι μια πολύ δημοφιλής πλατφόρμα που φτάνει το 99% των προγραμμάτων περιήγησης για υπολογιστές και υπολογιστές και προσφέρει το ίδιο σύνολο τεχνικών και οπτικών επιδόσεων σε όλα τα προγράμματα περιήγησης. Αλλά έχει ένα σημαντικό μειονέκτημα, το οποίο είναι ότι δεν υποστηρίζεται αποτελεσματικά από λειτουργικά συστήματα κινητής τηλεφωνίας όπως το iOS.
Για αυτό, υπάρχει HTML5.
Τώρα κοιτάξτε προσεκτικά αυτή τη δήλωση. Αν ληφθεί υπόψη η ονομαστική του αξία, μπορεί να σημαίνει ότι το HTML5 αποτελεί υποκατάστατο του Flash, όταν πρόκειται για την ανάπτυξη εξαιρετικά διαδραστικών εφαρμογών για την πλατφόρμα iOS.
Τα σενάρια, στα οποία οι πελάτες έχουν ζητήσει από τους προγραμματιστές να αντιγράψουν μια εφαρμογή Flash στο σύνολό τους χρησιμοποιώντας HTML5, για μια συγκεκριμένη κινητή συσκευή ή tablet, είναι αρκετά συνηθισμένα. Το πρόβλημα είναι ότι οι πλατφόρμες ανάπτυξης και οι λειτουργίες τους δεν πρέπει να λαμβάνονται με την ονομαστική τους αξία. Ναι, ένα από τα βασικά πλεονεκτήματα που προσφέρει το HTML 5 είναι να διευκολύνει την ανάπτυξη εφαρμογών που λειτουργούν σε όλα τα λειτουργικά συστήματα κινητής τηλεφωνίας αντί να κωδικοποιεί μια νέα εφαρμογή για κάθε κινητό λειτουργικό σύστημα.
Αλλά αυτό δεν σημαίνει ότι πρόκειται για αντικατάσταση Flash.
Δημοφιλείς παρανοήσεις σχετικά με το HTML5
Θα σας οδηγήσω απλώς σε μια σειρά σεναρίων, τα οποία απεικονίζουν τις παρερμηνείες που έχουν οι άνθρωποι σχετικά με το HTML 5.
Σενάριο 1 : Μετατροπή ενός υπάρχοντος εργαλείου σχεδιασμού Flash σε HTML 5
Η λανθασμένη αντίληψη : Το HTML 5 δεν μπορεί να καλύψει τις εικόνες με τρόπο παρόμοιο με το Flash. η κάλυψη της εικόνας δεν είναι ούτε μέχρι το σημάδι ούτε ομαλή. Το πιο σημαντικό είναι ότι το Flash είναι πιο γρήγορο και όταν πρόκειται για συγκεκριμένες λειτουργίες όπως ο υπολογισμός των περιοχών και των διαμέτρων. Το φλας είναι πολύ καλύτερη επιλογή. Χαρακτηριστικά όπως Drag / Scale και Zoom λειτουργούν επίσης καλύτερα στο Flash σε σύγκριση με το HTML 5.
Σενάριο 2 : Μετατροπή α Βιβλιοθήκη ήχου βασισμένη σε φλας σε βιβλιοθήκη συμβατή με tablet που βασίζεται σε HTML5.
Η λανθασμένη αντίληψη : Το HTML5 προσφέρει υποστήριξη ήχου και βίντεο, αλλά με ορισμένους περιορισμούς. Αυτή η ιστοσελίδα με βάση το Flash είχε σχεδόν 800 αρχεία mp3. καθιστώντας την εφαρμογή μεγάλης κλίμακας. Το πρόβλημα έγκειται στο γεγονός ότι ενώ το Mozilla υποστηρίζει τη μορφή .ogg και το chrome / safari υποστηρίζει τη μορφή .mp3, έτσι ώστε εάν το προτιμώμενο πρόγραμμα περιήγησης του χρήστη είναι το IE8, ο Flash Audio Player γίνεται απαραίτητη. Οι περιορισμένες επεκτάσεις που είναι διαθέσιμες σε HTML5 σημαίνουν ότι η μόνη λύση είναι να μετατρέψετε όλα τα αρχεία ήχου σε δύο μορφές - mp3 και ogg / wave. Για να μετατρέψετε 800 αρχεία σε δύο μορφές αρχείων δεν είναι απλώς μια χρονοβόρα διαδικασία αλλά επίσης αυξάνει την αποθήκευση του διακομιστή.
Το αποτέλεσμα είναι μια εφαρμογή iPad που επιβραδύνει τα μπλοκ.
Σενάριο 3 : Μετατροπή a Ιστοσελίδα με βάση το Flash σε έναν ιστότοπο που βασίζεται σε HTML5.
Η λανθασμένη αντίληψη: Υπάρχει μια εσφαλμένη αντίληψη ότι το HTML5 μπορεί να χειριστεί όλα τα είδη κινούμενων σχεδίων, ακόμα και αυτά της μεγάλης ποικιλίας. Αλλά δεν μπορεί, τουλάχιστον όχι ακόμα. Η ικανότητά του να προσφέρει 3D εφέ και να τρέχει ταυτόχρονα πολλαπλά κινούμενα σχέδια είναι εξαιρετικά περιορισμένη. Είναι η διαμόρφωση του συστήματος που καθορίζει την απόδοση των κινούμενων εικόνων HTML5 και μέχρι στιγμής έχει αποδειχθεί ότι είναι ένας τρώγων μνήμης. Υπάρχει μια καλή πιθανότητα ότι η χρήση του HTML5 θα επηρεάσει την απόδοση του ιστότοπου εάν του ζητηθεί να κάνει πολλά από την άποψη της κινούμενης εικόνας. Ο ιστοχώρος θα διακοπεί ή η ταχύτητά του θα επηρεαστεί. Έτσι, στην παραπάνω περίπτωση, ο ιστότοπος HTML 5 ενδέχεται να μην είναι σε θέση να προσφέρει το ίδιο σήμα απόδοσης.
Debunking κοινές HTML 5 παρανοήσεις
Πρώτον, το HTML 5 προσφέρει μια πολύ βολική λύση ήχου και βίντεο με ορισμένες προηγμένες λειτουργίες. Όλα καλά και καλά, αλλά αυτό που πολλοί άνθρωποι αγνοούν είναι το γεγονός ότι αυτά τα αρχεία ήχου και βίντεο παίζονται μέσα στα προγράμματα περιήγησης. Κάθε πρόγραμμα περιήγησης έχει ενσωματωμένα plugins για ήχο και βίντεο, αλλά διαφορετικά προγράμματα περιήγησης υποστηρίζουν διαφορετικές εκδόσεις του ήχου και του βίντεο. Εξαιτίας αυτού, είναι δύσκολο να ικανοποιηθούν οι απαιτήσεις όλων των προγραμμάτων περιήγησης.
Δεύτερον, τα στοιχεία SVG και Canvas σίγουρα έχουν διευκολύνει τους προγραμματιστές να υλοποιήσουν και να ενσωματώσουν 2D κινούμενα σχέδια, αλλά παρατηρήθηκε ότι αυτή η κινούμενη εικόνα έχει επιζήμια αποτελέσματα στην απόδοση του ιστότοπου. Επίσης, το HTML5 αποδεικνύεται αδύναμο όταν πρόκειται για το χειρισμό τρισδιάστατων κινούμενων εικόνων, με αποτέλεσμα οι προγραμματιστές να μην μπορούν να αναπαράγουν ολόκληρη την ιστοσελίδα Flash με παρόμοια απόδοση στο HTML5. Θα υπάρχουν πάντα περιορισμοί.
Τρίτον, μπορείτε να χρησιμοποιήσετε εμπλουτισμένες εφαρμογές HTML5 στο Internet, αλλά μην έχετε την εσφαλμένη αντίληψη ότι μπορούν να σας προσφέρουν την ίδια αποτελεσματικότητα και λειτουργικότητα που μπορεί να προσφέρει η Flash / Flex, για παράδειγμα το Flash μπορεί να επικοινωνήσει απευθείας με απομακρυσμένες υπηρεσίες, ενώ το HTML5 δεν μπορεί .
Τώρα που ξέρετε τι HTML5 δεν μπορεί να κάνει, επιτρέψτε μου να σας προσφέρω μια μικρή λίστα με πράγματα που μπορεί να κάνει το HTML5 και, στην πραγματικότητα, μπορεί να κάνει πολύ καλά. Αυτό μπορεί επίσης να συμβάλει στη μείωση των παρανοήσεων σε μεγάλο βαθμό.
- Μπορείτε να δημιουργήσετε μια ενιαία εφαρμογή που λειτουργεί στο iPad, iPhone, Windows κ.λπ. Με άλλα λόγια, διευκολύνει την ανεξαρτησία της πλατφόρμας / συσκευής - ένα τεράστιο όφελος από μόνο του.
- Βοηθά στην ανάπτυξη ενός μόνο ιστότοπου που λειτουργεί ταυτόχρονα στο tablet, στο κινητό και στην επιφάνεια εργασίας.
- Εάν χρησιμοποιείται καλά και ο τρόπος που υποτίθεται ότι θα χρησιμοποιηθεί, μπορεί να βελτιώσει την απόδοση του ιστότοπου.
- Επιτρέπει τη χρήση ετικετών ήχου και βίντεο σε όλες τις πλατφόρμες, αλλά προετοιμαστείτε να κάνετε κάποια σκληρή δουλειά.
- Τα βίντεο, ο ήχος και οι εικόνες είναι όλα γραμμένα απευθείας στους κώδικες, εξαλείφοντας την ανάγκη για οποιοδήποτε λογισμικό τρίτου μέρους.
- Γρήγορος χρόνος φόρτωσης σε σύγκριση με την παλαιότερη έκδοση λόγω της εφαρμογής του WebSockets.
- Προσφέρει υπέροχα κινούμενα σχέδια για γραφικά και εφέ φωτισμού, αλλά μην περιμένετε το φεγγάρι, τον ήλιο και τα αστέρια όταν πρόκειται για κινούμενα σχέδια. Το φλας είναι πολύ πιο μπροστά από αυτή την άποψη.
- Παρέχει τις κατάλληλες ενσωματωμένες δηλώσεις επικύρωσης και τύπου για να προσφέρει συγκεκριμένη υποστήριξη πληκτρολογίου.
Το HTML 5 έχει σίγουρα τη δυνατότητα να αναβαθμίσει το Flash με περισσότερους τρόπους από το ένα, αλλά είναι προς το παρόν ένα έργο σε εξέλιξη. Ακόμη και με το τρέχον είδωλο, βοηθάει τις εφαρμογές κινητής τηλεφωνίας να γίνουν πιο προσιτές και οι προγραμματιστές μπορούν τώρα να δημιουργήσουν καθολικές εφαρμογές για διαφορετικά κινητά τηλέφωνα. Επιπλέον, δεν υπάρχει αμφιβολία ότι προσφέρει μεγαλύτερη ευελιξία στη δημιουργικότητα του ιστότοπου. Προς το παρόν, αρκεί. Αυτό που συμβαίνει στο μέλλον είναι καθαρή υπόθεση.
Αποποίηση: Όλες οι εικόνες που χρησιμοποιούνται σε αυτό το άρθρο είναι για επεξήγηση μόνο για να εξηγήσουν τα σχετικά σενάρια.
Εφαρμόζετε ήδη κάποιες λειτουργίες HTML5 που δεν υποστηρίζονται ευρέως; Ποια χαρακτηριστικά προσβλέπουμε περισσότερο στην υιοθεσία; Ενημερώστε μας στα σχόλια!