Ich wusste, dass Cloudinary sowohl mit Videos als auch mit Bildern arbeitet, aber neulich war ich neugierig, ob Cloudinary einen Video-Player-Embed anbietet, so wie es andere Video-Hosts tun (z. B. YouTube, Vimeo usw.). Wie ein <iframe>, der mit einem speziellen Player kommt.
Ich war neugierig, denn so sehr ich auch die Einfachheit schätze, einfach ein <video> auf einer Seite zu platzieren, es gibt eine kleine Hürde, die ich immer vergesse: Man muss ein poster-Attribut verwenden, wenn man etwas anderes als ein leeres weißes Rechteck auf mobilen Browsern haben möchte. Ein spezielles poster für jedes Video, das ich verwende, ausschneiden zu müssen, ist ein Schritt, für den ich ehrlich gesagt meistens zu faul bin.
Es stellt sich heraus, dass Cloudinary tatsächlich einen Player hat, und dieser ermöglicht viele schöne Anpassungen, einschließlich der automatischen Behandlung des Posters: Video Player Studio.
Wenn ich stattdessen diesen Player verwende, erhalte ich nicht nur ein kostenloses, konfigurierbares poster, sondern auch andere Vorteile, die man von Cloudinary erwarten würde, wie z. B. das Ausliefern des Videos im bestmöglichen Format und die Optimierung der Größe.
Aber es gibt noch eine weitere Sache, die hier eine ziemlich große Sache ist, besonders bei langen Videos: „Adaptive Bitrate Streaming“. Hinter den Kulissen muss wahrscheinlich eine Bibliothek heruntergeladen werden, aber die Bandbreiteneinsparungen zahlen sich wahrscheinlich fast sofort aus. Ich bin in all dem kein Experte, aber ich beziehe mich auf HLS und MPEG-DASH, die die großen Player zu sein scheinen, und dieser Cloudinary-Player bietet beides.
Zur Klarstellung: Dieser Beitrag wird nicht von Cloudinary gesponsert. Ich habe neulich nur über all das nachgedacht, weil wir hier auf CSS-Tricks häufig Videos einbetten und ich Cloudinary bereits für alle möglichen Dinge verwende.
Hier ist ein Beispiel:
Als ich dies dem Cloudinary-Team vorlegte, sagten sie zwei Dinge:
- Der Player ist auf VideoJS aufgebaut. Ehre, wem Ehre gebührt.
- Sie haben einen Blogbeitrag, der weit tiefer in die Anpassung des Players eintaucht, als ich es hier tue.