Lynda.com Σχεδιάστε το βίντεο φόντου HTML στο Web

• Ενδέχεται 17, 2024

Το βίντεο στο παρασκήνιο είναι ένας πολύ καλός τρόπος για να εμπορευθεί το προϊόν σας και σε αυτό το πρόγραμμα κατάρτισης βίντεο Lynda.com με τίτλο Σχεδιασμός του Web: HTML Ιστορικό HTML με τον Chris Converse θα μάθετε πώς μπορείτε να προσθέσετε ένα βίντεο φόντου αυτόματης αναπαραγωγής στην ιστοσελίδα σας. Θα μάθετε επίσης πώς να χρησιμοποιείτε το CSS για να τοποθετήσετε άλλα στοιχεία σχεδίασης πάνω στο βίντεο φόντου. Και τα αρχεία άσκησης είναι δωρεάν ακόμα και για την ιδιότητα μέλους Standard.

Το Converse ξεκινά με ένα αρχείο html γυμνών οστών και κατασκευάζει το κύριο container div για τα στοιχεία σχεδίασης: το tagline, το λογότυπο svg και το βίντεο. Παρουσιάζει τον τρόπο χρήσης της αυτόματης αναπαραγωγής στην ετικέτα βίντεο και τον τρόπο ρύθμισης των δύο πιο συνηθισμένων τύπων βίντεο, .mp4 και .ogg.

Στη συνέχεια, το Converse μετακινείται στα αρχεία CSS και το CSS στυλ και τοποθετεί το βίντεο και την κεντρική εικόνα του λογότυπου. Προχωράει για να κάνει το ίδιο για το κείμενο γραμμωτού κώδικα. Μου άρεσε ιδιαίτερα η τεχνική του για την εργασία με τα σύνορα.

Το Converse συζητάει πώς να κάνει αυτό το layout απόκριση χρησιμοποιώντας ερωτήματα μέσων για μεσαίες και μικρές οθόνες και CSS. Και πάλι, ορίζει στυλ για το βίντεο, το λογότυπο και το tagline. Δείχνει επίσης πώς να ορίσετε μια εικόνα αντικατάστασης για μικρές οθόνες που δεν μπορούν να αναπαραγάγουν βίντεο και να αποκρύψουν το βίντεο.

Προχωρώντας σε πιο πολύπλοκα ζητήματα, το Converse δείχνει πώς να χρησιμοποιήσετε το JavaScript για να προσθέσετε πιο πολύπλοκο έλεγχο στην οθόνη για τις λειτουργίες των κινητών συσκευών, όπως τα συμβάντα αφής. Εισάγει έναν ιστότοπο τρίτου μέρους που ονομάζεται Modernizr ο οποίος θα δημιουργήσει κλάσεις CSS που μπορούν να προστεθούν στη σελίδα μέσω JavaScript βάσει των χαρακτηριστικών της τρέχουσας συσκευής. Δείχνει πώς να δημιουργήσει τον κώδικα, να το κατεβάσει και να τον προσθέσει στον κώδικα της ιστοσελίδας σας.

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

Αυτό το μάθημα αφορούσε το HTML και το CSS που χρησιμοποιούνται για το στυλ και την τοποθέτηση ενός βίντεο φόντου για web και κινητές συσκευές. Ωστόσο, ελπίζω ότι ο συγγραφέας θα συζητήσει επιλογές για φιλοξενία και βελτιστοποίηση του αρχείου βίντεο για γρήγορη λήψη. Επίσης, θα ήταν ωραίο να γνωρίζουμε πώς να προσθέτουμε διαδραστικά στοιχεία σχεδιασμού πάνω στο βίντεο φόντου αντί για απλά στατικά στοιχεία.

Ο Chris Converse έχει πτυχίο γραφικού σχεδιασμού από το Ινστιτούτο Τεχνολογίας του Rochester και 22 χρόνια εμπειρίας στο σχεδιασμό και την τεχνολογία.

//www.lynda.com/HTML-utorials/Design-Web-HTML-Background-Video/373560-2.html

Αποκάλυψη: Δεν είχα οικονομικά αποζημιωθεί για αυτό το άρθρο. Οι απόψεις είναι τελείως δικές μου βασισμένες στην εμπειρία μου.

Οδηγίες Βίντεο: But what is a Neural Network? | Deep learning, chapter 1 (Ενδέχεται 2024).