1485 sujets

Web Mobile et responsive web design

Bonjour,

Je doute qu’il y ait de solution idéale pour présenter une vidéo sur mobile, mais il doit y avoir des bonnes et mauvaises manières de le faire.

Je travaille actuellement sur un projet dans lequel il faut intégrer des présentations vidéos disponible sur mobile; et évidemment disponible sur la majorité des systèmes d’exploitations.

Je testais aujourd’hui avec la balise video HTML5 sur Android 2.2 et les résultats étaient peu concluants :

- Avec le navigateur de base, un bloc vidéo apparait, mais rien ne joue comme s’il ne reconnaissait pas le format. (.htaccess en place)
- Avec firefox4 mobile, pas de problème, mais pas de possibilité de passer en plein écran.
- Avec Opera mini, on tombe sur le fallback Flash (d’ailleurs, pas de CSS3 avec opera mini?)

J’ai lu sur internet que les produis Apple permettaient de mettre la balise HTML5 en fullscreen, est-ce exact ?

Y-a-t’il moyen de permettre le fullscreen sur Android ?

Que préférez-vous pour afficher vos vidéos sur Mobile ? (il y a un lecteur flash performant pour mobile?)

Il y a pas mal de question, je m’excuse ! Mais merci
Modifié par Vaxilart (10 May 2011 - 23:47)
Avec ce billet ça fonctionne?

Ne pas oublier d'envoyer les bons htpp headers et de mettre la version mp4 en premier (bug sur certains iOS ipad).

Sur iOS version iPhone, les vidéos s'ouvrent en plein écran, sur iOS version iPad la vidéo joue par défaut dans la page mais un bouton permet de passer en plein écran.
Modifié par Patidou (11 May 2011 - 11:32)
Salut Patidou,

J'ai bien vérifié tes remarques, et tout cela semble en ordre.

Depuis, j'ai pas mal cherché sur le web, et niveau mobile ça bloque encore (car sur un ordinateur de bureau, tout marche sur tous les navigateurs).

J'ai utilisé video-js (http://videojs.com/) pour incorporer le video avec un fallback flash.

Mais il n'y a rien à faire:
- Iphone ne fonctionne pas (je ne suis pas sûr de la version de l'appareil testé)
- Android fonctionne à moitié (2.2 Galaxy S ne fonctionne pas, mais sur l'Android d'un collègue de bureau; avec une version plus ancienne, on est tombé sur le fallback flash sans problème)
- Blackberry ne fonctionne pas (Blackberry Curve)

Est-ce que ça pourrait être un problème de conversion ? (j'utilise Miro converter)

Puisque comme ça, ça ne doit pas être facile de voir là où ça blesse, j'ai mis tout ça en ligne:

Originale: http://steannedesplaines.info/m/maison-chaumont.php

Mais j'ai aussi fais des pages de test avec des codex différent (et surtout pour isoler le vidéo):

Test 1: http://steannedesplaines.info/m/test1.php

Test 2: http://steannedesplaines.info/m/test2.php

- .mp4 codé spécifiquement iPhone sur Miro converter



(Si certains pouvaient me donner un retour sur le résultat sur leur appareil, ce serait apprécié !)

Merci!
Bonjour !

J'ai pas mal lu sur les codex, et semblerait que si un vidéo dépasse une certaine taille, il ne sera pas lu sur iPhone.

En tout cas, en me basant sur les specs des téléphones j'ai refait l'encodage de mes vidéos de test avec la taille requise et en vérifiant l'encodage audio (ainsi que la qualité, etc).

Est-ce qu'un âme charitable pourrait me dire si la page suivant fonctionne sous iPhone ?

http://steannedesplaines.info/m/test4.php

Sous Androïd ça marche très bien, et je compte tester sur un blackberry curve 8530 au courant de la semaine.