What Html and Video Format to use for website

  • 1
  • Question
  • Updated 7 months ago
OKI've made 800 camastia videos and now  I'm lost
Trying to embed my videos on my websites with these functions
  1. that autostarts
  2. works on both Phone and Windows computers
  3. has a menu that allows navigation
  4. Love facebooks hover and play function
  5. would LOVE pe-load

So MP4 is Out?
What do I use?

http://isaacandgrandpaevents.com/index.php?fuseaction=cPageGoTo.GoToDoc&DocumentID=1033573

Of course, I love these hover load videos on facebook and other websites 
https://www.youtube.com/watch?v=oHg5SJYRHA0

Have given up on hotspots if most users are using iPhones rendering it non-functional
wish I new the  html code to recognize iOS  and present compatible video
Photo of Bill Coughlin

Bill Coughlin

  • 160 Posts
  • 13 Reply Likes

Posted 7 months ago

  • 1
Photo of Bill Coughlin

Bill Coughlin

  • 160 Posts
  • 13 Reply Likes
this is nice hover to play but not on iPhone  https://codepen.io/gil--/full/bNxZWg/
Photo of Rick Stone

Rick Stone

  • 4509 Posts
  • 2013 Reply Likes
I didn't think devices operated like a computer where a mouse is involved. How do devices such as an iPhone screen detect a finger hovering?
Photo of Joe Morgan

Joe Morgan

  • 5706 Posts
  • 2968 Reply Likes
I-phones are a high tech marvel. A rip off if you ask me. People will pay $1,000 for a 5" x 3" screen and swipe in and squint their way through life.Pay a lot of money for bandwidth as well.
It's the biggest rip off around as far as I'm concerned.It has it's perks for business. But if your just in need of phone. You probably don't need an I-phone at $100 bucks a month or so.
Photo of Rick Stone

Rick Stone

  • 4509 Posts
  • 2013 Reply Likes
So, after reading that link you provided, I'm guessing that what you intended to demonstrate was the new sensitivity feature known as Peek and Pop?

Those terms are funny thinking back to the 1980's with my Commodore 64 and programming things where we used Peek (to look at values in a register) and Poke (to store values in a register). Well, assuming my distant memory of it is still intact. LOL

Cheers... Rick :)
Photo of Joe Morgan

Joe Morgan

  • 5706 Posts
  • 2968 Reply Likes
I didn't look that closely at the article. An I-phone is miniature lap top with a phone built into it. Or probably closer to a tablet actually. I've watched people swipe their afternoon away with their nose pressed to the screen.I think it's ridiculous. At the very least, get yourself a tablet.
Photo of Rick Stone

Rick Stone

  • 4509 Posts
  • 2013 Reply Likes
To each his or her own I suppose, but the automatic video play function caused quite a stir with many facebook users when it was introduced. I recall seeing so so many of my facebook friends screaming for help to turn it off. With many folks, it wasn't so much the fact it existed, but the fact that if you are using something like a smart phone, playing videos counts against the transfer bandwidth you are allotted with many phone plans.

Just yesterday a mystery was solved by happenstance. I watch a news program on my PC. And I was baffled because sometimes seemingly inexplicably, the video I was watching would seem to spontaneously end and the next video in the feed would begin. And I happened to notice that they had implemented this "hover and play" sort of thing and it was annoying as all get out because as I moved my mouse away from the video I wanted to watch, it hovered one of the videos in the list. And today I noticed that if the mouse pointer rested on one of those videos, after a pause I saw a countdown advising that the video would begin playing in 3... 2... 1... I was quite annoyed by that behavior!

Cheers... Rick :)
Photo of Bill Coughlin

Bill Coughlin

  • 160 Posts
  • 13 Reply Likes
Well Personally for the last 6 years or so I autostart my video ....player.html  (incased mp4 ) and put a pause after a few seconds, then I give the client a choice of an English Manderin or Cantonese narration.
Now using Hotspots ( flash?)seems blocked by iOS and even some androids??  
In the PAST I have had elaborate side menus for many many years.
 Now IM going BACKWARDS with Less navigation control for the video watcher which will click off in a heartbeat.
With my current Chrome on top of the line windows 10 computer, I CAN NOT NAVIGATE our menu on the bottom. I am stuck with waiting for it to load and if I go back to the beginning the whole cycle starts over again check out my nav menu on the bottom  Please wait 4 seconds to load .... NOTE even if you click ahead on Chrome or Firefox the movie will not advance

https://coughlinteam.com/images/coughlinteam/movies/WWLLH/2661LarkspurCourt.Abbotsford/2661LarkspurC...

it is my amazon Hosting cash holding this up   IF I host on  Vemio my menu works but of course I lose all hotspots
http://vancouverrealestateinvestments.com/index.php?fuseaction=cPageGoTo.GoToDoc&DocumentID=1006...
(Edited)
Photo of kayakman

kayakman, Champion

  • 6210 Posts
  • 1808 Reply Likes
have you tried hosting on screencast.com; or on your own website?
Photo of Bill Coughlin

Bill Coughlin

  • 160 Posts
  • 13 Reply Likes
I run my own servers, do u think it makes a difference?
(Edited)
Photo of kayakman

kayakman, Champion

  • 6210 Posts
  • 1808 Reply Likes
Could be, depending on the type of server and its configuration

My web site is hosted on a shared Windows server [I use a hosting service, Exabytes]; I once tried hosting on a Linux server [they are usually much cheaper], but my MP4 w/smart player videos did not work well off the Linux system

3rd party hosting is very inexpensive these days; I also host on Azure Windows cloud service; great system, but fairly pricey re disk storage compared to traditional hosting
Photo of Dubie

Dubie

  • 969 Posts
  • 749 Reply Likes
@ Bill

You can take this post for what its worth but times have changed and you need to make some changes
how your pages are made and how you offer your content to people because of the way the web is changing.


1. Autostart video

This is changing in the way that even a video that auto starts will not play the audio.
That upsets people.

As of this month (April 2018) Chrome (starting on mobile) will disable audio on autoplay videos
and many of the social sites already do this.

So that said a visitor to your pages is going to have to click on the video to hear the audio anyways.
Is it better for your video to start playing with no sound and your visitor missing the beginning of the video and then having to click it to hear the video and start it from the beginning again (reload it) ?

More clicks equals leaving. Less is More.


2. Works on both Phone and Windows computers

Your videos made in Camtasia should work on most phones as they do render with the format needed



Camtasia rendered video metadata




In Camtasia I recommend your produce your videos using the "Custom Production Setting" route.
The mp4 preset production options won't always give you the best results.




Your link here
http://isaacandgrandpaevents.com/index.php?fuseaction=cPageGoTo.GoToDoc&DocumentID=1033573

Is really old school code (HTML 4 Transitional) which is all but dead except for desktop.
Your pages need to be rebuilt using HTML5 Responsive Coding to also work on mobile

To see what I mean in either Chrome or Firefox with your page loaded go to the Developer tools and use the Responsive Mode. You'll see only a partial bit of your page. Most of it is cut off.

Or you can also view your page in one of the browsers in window mode (not full screen) and then grab one of the corners and resize the browser smaller to what a phone screen would be. Again most of your page will be cut off.

A responsive design will re-scale the page to keep everything in view.

Using either the developer tools or resizing the browser method look at this example of a page I coded.

Note: The videos may load slow as the page is hosted on a cheap server but the page will
re-scale without delay.
http://demotestsite.info/templates/iframebbq/

Side note: This page also displays fine on iphones I have tested it.

3. Has a menu that allows navigation

Personally I would just code these on to the page and not as hotspots and have as few as possible.
Again Less is More.
If your page has to many choices people get confused and just leave.

Even better have a drop down menu with links to your other pages which will make for a less cluttered and confusing page and easier for people to navigate.

4. Love facebook's hover and play function

This not possible to do with Camtasia production. This is accomplished with javascript or json coding added to the page.

5. Would LOVE pe-load

If you are going to have any interactive content in your  videos (hotspots) than you will have to use iframes and to preload iframe videos requires javascript or json code to do it.

If you are not using any interactive video content (hotspots) than you can just add the "preload" code to a html5 video tag code as you only will be using a mp4 file and not have to use iframes.

You also mention:
Now using Hotspots ( flash?) seems blocked by iOS and even some androids??
 
Yep. Flash is dead. Best to forget about having pages using flash elements.

Sorry if I ruffled any feathers but I'm just a outsider looking in and stating some facts of web design today.
Nothing personal or judgemental intended.

A good web designer could make a couple of responsive page templates that you could just add you videos and other needed content to and in the end make it easier to go forward from this point in time with the way the web and site design is changing.

:)
(Edited)
Photo of Joe Morgan

Joe Morgan

  • 5706 Posts
  • 2968 Reply Likes
A lot of these so called videos are images with text.No video at all, just images with the ken burns effect of pan and zoom applied. Music added.Boring, slow speed information being fed to you disguised as a video.

This eats into bandwidth as well. If you have a limited  "X" GB a months subscription to your Smart phone, Internet provider,etc. Mute saves some bandwidth. I know that's part of it as well
Photo of Rick Stone

Rick Stone

  • 4509 Posts
  • 2013 Reply Likes
For a few years I did some minor video editing and uploading of videos to a YouTube channel for a minister I know. He would record his talks on Sunday and what I would do is massage the recorded video by adding an intro and an outro and making some minor edits. Then I would upload the final video to YouTube. After that, I would then post the YouTube link on the facebook page. Seemed to work fine for me. When I looked at the facebook page, the video simply played in the page even though it was actually stored over on YouTube.

Unfortunately, that didn't suit him. He emphatically advised that he really needed the videos uploaded directly to facebook in addition to uploading them to YouTube. When I questioned it, he said he "got more engagement" when uploading directly to facebook. 

I honestly think he just believed he got more "engagement" was because of the silly auto play stuff. Now I am no expert by any means whatsoever on facebook analytics and things like that, but my thought was that simply because as the video scrolled into view and began playing, it counted as "engagement" for the reports facebook offered. I figured he likely had a false sense of the genuine impact of his videos.

This guy has since begun recording, editing,producing, and uploading his videos on his own. (I bowed out after a few years.)

After watching his first few videos, I commented that he really needed to consider ensuring audio was heard on both left and right channels, because as a viewer, it was distracting to hear audio on the left channel only. I use headphones.

His response? Nahh, that's not a big deal at all! Nobody will notice that.

All righty then!

Cheers... Rick :)
Photo of Rick Stone

Rick Stone

  • 4509 Posts
  • 2013 Reply Likes
I'd be surprised to see that mute has any impact on bandwidth at all. 
Photo of Dubie

Dubie

  • 969 Posts
  • 749 Reply Likes
My statement for not using autoplay is nothing if ones considers the real reasons it's a bad thing.

Autoplay is usually wanted for views and stats with a revenue agenda at the core.

Unless a person follows a link with the expectation that a video is going to be played for instance a webinar etc. than autoplay personally to me is a bad thing.

Here are some good reasons one should really rethink why using autoplay is a bad thing.

http://www.punkchip.com/autoplay-is-bad-for-all-users/

http://www.punkchip.com/autoplay-is-still-bad-for-all-users/

To each their own. Your competitors will love you when users jump off your site because you annoyed them.

:)
(Edited)
Photo of Bill Coughlin

Bill Coughlin

  • 160 Posts
  • 13 Reply Likes
MG Dubie, you are AMAZING!!  I am indebted to you for your incredible post to my problems ..  Please let me supply you with Free Twinkies for the rest of your life LOL.

Yes I have built out my own version of a web os, yes 1.2 millions line of code and several Million dollars later, and now am lacking the 1/2 mill to update my code to HTML 5.. but I am working on it :)

I will tackle this list.. really really appreciate your input!
Photo of Bill Coughlin

Bill Coughlin

  • 160 Posts
  • 13 Reply Likes
Autoplay..   yes over the years I have played with and studied the watch rates and click off times on my videos and always saw HUGE benefits for autoplay readership with my focused target market.

recently I feel my 13 second intros are terribly LONG and a 2.5 second intro is perfect in my eyes and yes Silent. No Audio.

I personally just LOVE the hover to play a silent trailer and even if I have to do a few second GIF with a link to the Real video is much better than what I have now, a Black screen with a play button... no one will click that
(Edited)