In dieser Lektion wirst du lernen wie man ein HTML5-Video zu einer Seite in Adobe Dreamweaver hinzufügt. Nun, bevor wir anfangen Wir müssen eine Website für dieses Modul einrichten. Und so gehen wir zu unserem Site-Menü, zu einer neuen Site. Wir werden auf dieses Ordnersymbol hier drüben klicken. Jetzt habe ich bereits das Modul sechs Medienordner abgelegt aus dem Ordner mit den Unterrichtsdateien auf meinem Desktop damit es für mich einfacher zu bedienen ist. Also wirst du raus navigieren dorthin, wo Sie diesen Ordner haben. Und wir werden auf die Schaltfläche Ordner auswählen klicken. Ich nenne das Modul sechs Medien, und wir werden auf die Schaltfläche "Speichern" klicken. Nun, wenn Sie noch nie eine Website erstellt haben oder wenn Sie weitere Informationen wünschen darüber, warum wir Websites im Allgemeinen verwenden, Sie können zu Modul eins zurückkehren zum Verwalten von Sites in Dreamweaver und erfahren Sie etwas mehr über das Arbeiten mit Websites. Von unserem Dateibereich hier rechts, Wir werden die vorgestellte Wanderung eröffnen. Auf dieser Seite haben wir jetzt unsere vorgestellte Wanderung und es ist Danforth Falls und sie haben einen wirklich tollen Wasserfallbereich. Wir wollen also nicht nur ein Foto hier reinstellen aber wir wollen hier ein Video einfügen. Was wir also tun werden, ist, dass wir sicherstellen werden dass wir uns in der Entwurfsansicht befinden und hier rechts, Wir werden dort klicken, wo wir unsere Seite haben und um sicherzustellen, dass Sie an der richtigen Stelle sind, Schauen Sie hier unten auf unsere Statusleiste unten entlang. Und Sie können sehen, es wird ein seitlicher und rechter Artikel angezeigt. Und wenn du das siehst, Sie wissen, dass Sie am richtigen Ort sind. Mit HTML mussten wir in der Vergangenheit durch Hürden springen um ein Video auf die Seite zu stellen. Aber jetzt mit HTML5 ist es sehr einfach. Also gehen wir hinüber an der Einsatzplatte hier rechts. Wir werden HTML aus der Dropdown-Liste auswählen oben auf dem Panel. Und wir werden nach unten scrollen nach unten zu HTML5-Video. Und wir werden darauf klicken. Das ist nur der erste Schritt, der dort einen Platzhalter einfügt. Aber hier unten in unserem Eigenschaftsfenster, Hier haben wir alle Informationen, die wir brauchen damit dieses Video tatsächlich funktioniert. Also gehen wir zum Dateifenster, Klicken Sie wieder auf dieses Dateifenster. Und das erste, wahrscheinlich wichtigste Feature in diesem Eigenschaftsfenster ist die Quelle. Das ist also das Wichtigste, was wir tun müssen. Also gehen wir zu unserem Medienmenü drüben in unseren Dateien. Wir werden das öffnen weil wir diese 0.2-Datei verwenden werden, dieses kleine Bullseye-Symbol, direkt rechts neben der Quelle. Und wir werden darauf klicken und es rüberziehen zu unserem Wasserfall. Da wir hier einen Platzhalter haben, dieser Platzhalter ist ziemlich klein. Und wenn wir es so belassen, so groß wäre unser Video, was ziemlich klein ist. Also gehen wir runter in die Breite und wir werden eine Breite von 300 und eine Höhe von 500 eingeben. Und hier wird unser Video sein. Wenn Sie ein Video auf der Seite haben wenn wir es so belassen würden, wenn unsere Seite geladen wird, alle unsere Zuschauer sehen würden, wäre eine Black Box. Also direkt unter der Quelle, Wir haben die Möglichkeit, ein sogenanntes Poster zu verwenden. Und ein Poster ist nur ein Bild was Sie sehen könnten, sobald das Video abgespielt wird. Also gehen wir zurück zu unserem Dateifenster. Und dieses Mal werden wir unseren Bilderordner öffnen. Wir werden nach unten scrollen und zu unserem Poster Wir werden denselben Punkt zum Einreichen verwenden. Wir werden auf dieses Symbol klicken. Wir werden es zu Wasserfall.PNG ziehen. Das ist also ein Foto von diesem Wasserfall. Wir möchten einen Fallback-Text haben. Falls also jemand unser Video nicht sehen kann, Wir können ein Video der Wasserfälle eingeben an den Danforth Falls im Frühling nach einem Regen. Das Wasser tobt also. Unten links haben wir ein paar verschiedene Optionen. Das erste ist also, wir haben Kontrollen, also können wir wählen ob unsere Zuschauer pausieren können oder nicht oder dieses Video abspielen oder sogar noch einmal abspielen. Also lassen wir die Steuerung an. Sie haben auch die Möglichkeit, die automatische Wiedergabe zu wählen. Sobald die Seite geladen wird, wird das Video abgespielt. Nun, hier ist die Sache darüber. Wenn Sie möchten, dass diese Funktion tatsächlich in einem Browser funktioniert, einige der modernen Browser Ich mag diese Autoplay-Funktion nicht aber eine der Möglichkeiten, es zu umgehen ist, auf diese stumme Schaltfläche zu klicken. Nun, alles, was wir getan haben, ein Großteil der Vorschau die wir von Seiten gemacht haben, war durch unsere Live-Ansicht. Und wenn wir zu unserer Live-Ansicht gehen, wir können sehen, wie es ein wenig nachdenkt Dies ist jedoch nicht der beste Ort, um eine Vorschau Ihres Videos anzuzeigen. Also gehen wir zum Dateimenü, um zu speichern, und ich werde zu meinem Browser gehen und ich mache eine Kontrolle O, ich bin an einem PC. Wenn Sie auf einem Mac sind, werden Sie einen Befehl O ausführen, und das erlaubt uns, eine Datei zu öffnen. Und wir sollten hinaus navigieren wo immer wir haben, dass Modul sechs Medienordner. Und wir werden doppelklicken auf dieser vorgestellten Wanderung, um es zu öffnen. So können Sie das in unserem Video sehen hat begonnen und unser Video wird abgespielt. Aber eines der Dinge ist, dass es automatisch abgespielt wird Eine Art Mitnahme ist das Geräusch der Wasserfälle. Also müsste unser Betrachter wissen, vor allem, dass es Sound gibt. Und zweitens müssten sie es wissen dass sie diesen Ton wieder einschalten können und klicken Sie dann auf diesen Play-Button. Dann können Sie diesen Ton hören. Ich werde zu Dreamweaver zurückkehren. Also musst du entscheiden ob oder nicht Sie möchten, dass Ihr Video abgespielt wird, ob oder nicht Sie möchten, dass es gleich am Anfang automatisch abgespielt wird. Wenn ja, brauchen Sie Ton darauf oder ist es in Ordnung, dass es stummgeschaltet ist? Und werden Sie Ihren Benutzern die Kontrolle geben? über das Abspielen und Pausieren dieses Videos? In dieser Lektion haben Sie also gelernt, wie Sie ein HTML5-Video hinzufügen zu einer Seite in Adobe Dreamweaver.
