Πώς να προσθέσετε βίντεο φόντου με το Adobe Muse

Τι πρέπει να γνωρίζετε

• Με την Σπίτι σελίδα σε Σχέδιο προβολή, πηγαίνετε στο Παράθυρο > Βιβλιοθήκη > [MR] Βίντεο φόντου πλήρους οθόνης φάκελο και σύρετε το widget στη σελίδα.
• Για να προσθέσετε ένα βίντεο, μεταβείτε στο Αρχείο > Προσθήκη αρχείων για μεταφόρτωση > φάκελος βίντεο> Ανοιξε.

Το Adobe Muse σάς επιτρέπει να δημιουργείτε ιστοσελίδες χρησιμοποιώντας παρόμοια ροή εργασίας με τις δημοσιεύσεις. δεν χρειάζεστε βαθιά κατανόηση του κώδικα που δημιουργεί έναν ιστότοπο ή μια σελίδα, αν και η εξοικείωση με HTML5, CSS και JavaScript δεν θα βλάψει. Αν και το παραδοσιακό διαδικτυακό βίντεο προστίθεται συνήθως μέσω HTML5 Video API, το Adobe Muse επιτυγχάνει το ίδιο πράγμα μέσω widget που δημιουργούν το HTML 5 που απαιτείται για συγκεκριμένες εργασίες, αλλά χρησιμοποιούν μια διεπαφή απλής γλώσσας στο Muse για να γράψουν τον κώδικα όταν δημοσιεύεται η σελίδα.

Πώς να προετοιμάσετε μια σελίδα για βίντεο φόντου στο Adobe Muse CC

Με το widget εγκατεστημένο, μπορείτε πλέον να δημιουργήσετε τη σελίδα που θα χρησιμοποιεί το βίντεο.

1. Πριν ξεκινήσετε, δημιουργήστε ένα φάκελο για τον ιστότοπό σας στο Muse. Μέσα σε αυτόν το φάκελο, δημιουργήστε έναν άλλο φάκελο – χρησιμοποιούμε «μεσο ΜΑΖΙΚΗΣ ΕΝΗΜΕΡΩΣΗΣ«- και μετακινήστε τις εκδόσεις mp4 και webm του βίντεο σε αυτόν το φάκελο.

2. Όταν ξεκινάτε το Muse, επιλέξτε Αρχείο > Νέος ιστότοπος.

3. Όταν ανοίξει το παράθυρο διαλόγου Διάταξη, επιλέξτε Επιφάνεια εργασίας ως το Αρχική διάταξη και αλλάξτε το Πλάτος σελίδας και Ύψος σελίδας τιμές σε 1200 και 900. Κάντε κλικ Εντάξει.

4. Διπλό κλικ Κύρια σελίδα στην προβολή σχεδίου για να ανοίξετε την κύρια σελίδα. Όταν ανοίξει η Κύρια σελίδα, μετακινήστε τους οδηγούς κεφαλίδας και υποσέλιδου στην κορυφή και στο κάτω μέρος της σελίδας. Δεν χρειάζεστε πραγματικά κεφαλίδα και υποσέλιδο για αυτό το παράδειγμα.

Πώς να χρησιμοποιήσετε το Widget βίντεο φόντου πλήρους οθόνης στο Adobe Muse CC

Η χρήση του widget είναι απλή.

1. Το πρώτο πράγμα που πρέπει να κάνετε είναι να επιστρέψετε στην προβολή σχεδίου επιλέγοντας Θέα > Λειτουργία σχεδίου.

2. Όταν ανοίξει η προβολή σχεδίου, κάντε διπλό κλικ στο Αρχική σελίδα για να το ανοίξετε.

3. Ανοίξτε τον πίνακα βιβλιοθήκης – εάν δεν είναι ανοιχτός στη δεξιά πλευρά της διεπαφής, επιλέξτε Παράθυρο > Βιβλιοθήκη – και στριφογυρίστε το [MR] Βίντεο φόντου πλήρους οθόνης ντοσιέ.

4. Σύρετε το widget του φακέλου στη σελίδα.

5. Θα παρατηρήσετε το Επιλογές να σας ζητήσω να εισαγάγετε τα ονόματα των εκδόσεων mp4 και webm των βίντεο. Εισαγάγετε τα ονόματα ακριβώς όπως είναι γραμμένα στο φάκελο όπου τα τοποθετήσατε. Ένα μικρό κόλπο για να βεβαιωθείτε ότι δεν κάνετε λάθος είναι να αντιγράψετε το όνομα του βίντεο mp4 και να το επικολλήσετε στο MP4 και WEBM περιοχές του Μενού επιλογών.

   Ένα άλλο κόλπο: Το μόνο που κάνει αυτό το widget είναι να γράψει τον κώδικα HTML 5 για εσάς. Μπορείτε να το πείτε γιατί βλέπετε <> στο widget. Σε αυτήν την περίπτωση, μπορείτε να τοποθετήσετε το γραφικό στοιχείο από την ιστοσελίδα στον πίνακα ελέγχου και θα εξακολουθεί να λειτουργεί. Με αυτόν τον τρόπο, δεν επηρεάζει κανένα περιεχόμενο που θα τοποθετήσετε στη σελίδα.

Πώς να προσθέσετε βίντεο και να δοκιμάσετε μια σελίδα στο Adobe Muse CC

Αν και έχετε προσθέσει τον κώδικα που θα αναπαράγει τα βίντεο, η Muse δεν ξέρει πού βρίσκονται αυτά τα βίντεο.

1. Για να το διορθώσετε, επιλέξτε Αρχείο > Προσθήκη αρχείων για μεταφόρτωση.

2. Οταν ο Μεταφόρτωση παραθύρου διαλόγου ανοίγει, μεταβείτε στο φάκελο που περιέχει τα βίντεό σας, επιλέξτε τα και κάντε κλικ στο Ανοιξε.

3. Για να βεβαιωθείτε ότι έχουν μεταφορτωθεί, ανοίξτε το Πίνακας στοιχείων και θα πρέπει να δείτε τα δύο βίντεό σας. Απλώς αφήστε τα στον πίνακα. Δεν χρειάζεται να τοποθετηθούν στη σελίδα.

4. Για να δοκιμάσετε το έργο, επιλέξτε Αρχείο > Προεπισκόπηση σελίδας στο πρόγραμμα περιήγησης ή, επειδή είναι μία σελίδα, Αρχείο > Προεπισκόπηση ιστότοπου στο πρόγραμμα περιήγησης. Θα ανοίξει το προεπιλεγμένο πρόγραμμα περιήγησής σας και θα αναπαραχθεί το βίντεο.

5. Σε αυτό το σημείο, μπορείτε να αντιμετωπίζετε το αρχείο Muse ως κανονική ιστοσελίδα και να προσθέτετε περιεχόμενο στην Αρχική σελίδα και το βίντεο θα αναπαράγεται από κάτω.

Πώς να προσθέσετε ένα πλαίσιο αφίσας βίντεο στο Adobe Muse CC

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

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

2. Κάντε κλικ στο Σύνδεσμος εικόνας και μεταβείτε στην εικόνα που θα χρησιμοποιηθεί.

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

4. Ένα άλλο μικρό κόλπο είναι να έχετε ένα συμπαγές χρώμα γεμίσματος σε περίπτωση που το πλαίσιο της αφίσας χρειάζεται λίγο χρόνο για να εμφανιστεί. Για να το κάνετε αυτό, κάντε κλικ στο Χρώμα τσιπ για να ανοίξετε το Muse Color Picker. Επίλεξε το σταγονόμετρο εργαλείο και κάντε κλικ σε ένα κυρίαρχο χρώμα στην εικόνα. Όταν τελειώσετε, κάντε κλικ στη σελίδα για να κλείσετε το παράθυρο διαλόγου Συμπλήρωση προγράμματος περιήγησης.

5. Σε αυτό το σημείο, μπορείτε να αποθηκεύσετε το έργο ή να το δημοσιεύσετε. Το τελευταίο μέρος αυτής της σειράς σας δείχνει πώς να γράψετε τον κώδικα HTML5 που μεταφέρει ένα βίντεο στο φόντο μιας ιστοσελίδας.