Menu
whm logo
  • News
  • Websites
  • Business
  • Servers
  • Services
    • CPanel Hosting
    • EZ Website Builder
    • VPS Hosting
    • Dedicated Servers
    • Reseller Hosting
    • Domain Registrstion
whm logo
December 1, 2015December 1, 2015

Streaming video in the new age

Share it here
twitter facebook pinterest linkedin

Streaming video just got a lot easier with HTML5. Many scripts still do FFMPEG which we have installed and ready to go. The advancements with HTML5  now allow us to simply just add a special code to our website and video will stream. This is done by modern browsers having the decoder built in.

This is faster and easier to install than steaming video has ever been.

As you might have noticed on our front page, we have a small video streaming behind the main text. This is done with HTML5.

The code is quite simple:

We have auto play, loop, and mute activated in the code.

Here it is in action:

There is even more options, first I want to explain why there is three video files.

MP4 – is the most common video to stream, if you only do one I suggest this one.
WebM – is slowing growing on MP4 and is used on mobile browsers.
OGG – is for Apple Mac’s and Iphones.

It’s highly recommended to use all three formats at this time.

Keeping it fast

Even with this great new technology it will still load slow if your videos are not compressed well. We found a great site to run your videos through to get a good compression and each format. You can see the site here: Video Conversion

I suggest converting your video to WebM first, then converting that to MP4 and OGG to make all three.

Now that your videos are ready, you can play with your html5 streaming video code options. Here is the options available:

  • autoplay – autoplay – Specifies that the video will start playing as soon as it is ready
  • controls – controls – Specifies that video controls should be displayed (such as a play/pause button etc).
  • height – pixels – Sets the height of the video player
  • loop – loop – Specifies that the video will start over again, every time it is finished
  • muted – muted – Specifies that the audio output of the video should be muted
  • poster – URL – Specifies an image to be shown while the video is downloading, or until the user hits the play button
  • preload – auto – metadata none Specifies if and how the author thinks the video should be loaded when the page loads
  • src – URL – Specifies the URL of the video file
  • width – pixels – Sets the width of the video player

Continue Reading

← HTML5 is complete
Will website owners be punished for being hacked? →

Leave a Reply Cancel reply

You must be logged in to post a comment.

Connect with us
twitter facebook instagram youtube pinterest linkedin

Click to view coupon lup

Recent Posts

  • How to make an awesome about us page

    How to make an awesome about us page

    December 5, 2022
  • Is AI taking over SEO?

    Is AI taking over SEO?

    November 10, 2022
  • Transferring domains can be easy

    Transferring domains can be easy

    October 26, 2022
  • 6 highly effective ways to market a small business online

    6 highly effective ways to market a small business online

    September 28, 2022
  • A successful marketer

    A successful marketer

    August 22, 2022
  1. albertdavid123 on MySQL 5.5 is officially dying this weekApril 3, 2019

    Good bye 5.5. And thanks for we explaining the password change steps.

  2. Web Host Pro on Proper computer postureDecember 1, 2015

    Thanks!

  3. frank on 85% of people use the internet to find local businessesAugust 8, 2015

    I always do!

  4. Danny Walton on Free word invoice templateJuly 4, 2014

    Nice download

  5. Ken on Using Google Public DNSFebruary 22, 2014

    Great article!

All Rights Reserved Web Host Pro 2022