Hi,

 

I'm currently working on a Wordpress site (using the Divi theme).

 

I'm putting video in a slider on the homepage in Mpeg4 and Webm format.

 

It's working fine on the latest browsers but not on mobile devices in Safari and IE.

Does anyone have any suggestions about what is the most reliable cross browser / mobile device formats please?

If you're familiar with the Divi theme it only allows Mpeg4 and Webm formats!!

I'd appreciate any advice on this.

 

Thanks

First thing that springs to mind; most video players are Flash, you'll probably need HTML5 Video fallback for iOS.

I'll google the fallback for iOS

. . . unless you can point me in the right direction?

Thanks for the reply

if this is the theme in question, the slider does not use Flash but HTML5 videos (and youtube videos in iframes). MP4 in html video tags is now supported by all major browser vendors including IOS/Safari along with most other handheld devices. So MP4 is definitely the best supported format.

However it is quite common that that sliders have an option to disable videos on small devices. Check the documentation to see if this is the default behavior. Usually background videos does nothing but annoy mobile users with limited bandwidth so you might consider to leave things as they are and have the slider display an image for mobiles.

Another reason could be that Safari and IE are trying to load the WebM video which would cause an error in both browsers. You could try to experiment with the order of the formats or simply leave the WebM video out.

 

EDIT: Also make sure that your server is set up to handle the video formats. Add these lines to your .htaccess

AddType video/mp4 mp4 m4v
AddType video/webm webm

Edited November 12, 201510 yr by Nillervision

If you ever want to see browser support for anything then check out http://caniuse.com Their database is always upto date - it's what Autoprefixer uses to add in prefixes and that's used by most major websites / Apps.

Edited November 12, 201510 yr by rbrtsmith

Thank you for your comments everyone. All very useful.

Nillervision, it is the Divi theme I'm using which I'm quite impressed with although I can code from scratch. It's a real time saver.

I think you're right about the video being disabled for smaller devices and I'm going to insert an image as you suggest and see if that solves the problem.

Thanks again everyone. Really appreciated.