videoタグについて スマホで動画が再生されない

質問

動画の埋め込みについて教えてください。
新しく動画をつくったので差し替えたのですがスマホで再生されないので教えてください。

＜埋め込みタグ＞
<video src="●●●.mp4" playsinline loop autoplay muted></video>

ループ再生させたい

古い◆◆◆.mp4 はスマホで再生されていました。
ファイル名だけ新しい●●●に変更しました。
playsinline loop autoplay muted　は◆◆◆.mp4も●●●.mp4も同じ設定です。

PCではちゃんと再生せれるので、ファイル名間違いではないと思います。edge,Google Chrome,Firefoxで再生を確認しました。

＜ファイルサイズ＞
◆◆◆.mp4　8.61MB　総ビットレート542kbps
●●●.mp4　2.27MB 総ビットレート2111kbps

スマホだと画面が真っ白になります。
何が原因でしょうか。ご教授願います。

回答No.1

AsarKingChang · ベストアンサー

MP4は、箱にすぎず中のコーデック（圧縮方式）は様々です。
なので、携帯用のMP4での変換を行って
再度試してみるのはいかがでしょうか？
Adobeなどだと携帯に最適化する系の機能はあるのですが
今回、質問者さんが、何の動画編集ソフトを使っているのか
わからないので、それ以上、言いにくいためです。

ひとまずいえるのは、原因はこれになります。

MP4は入れ物にすぎず、
中の形式は、映像用と音声用でも、違い、
自由に選べるフォーマットであるということ。
携帯電話は、それらすべてを再生できるわけではないという
特性です。

お礼

返信遅くなりまして申し訳ありません。
いろいろ試していたら時間かかりました。やはり動画側の問題ですよね！スマホ用に動画を変換したら表示されました！！
感動です。
ありがとうございました。

回答No.2

4017B

スマホ(iPhone)の「低電力モード」がONになっている状態だと、HTMLタグ等でどの様な設定をしても無視されて手動再生しか出来ない様になります。

また画面の動画部分が空白の真っ白になる場合、読み込まれている動画のエンコ方式自体に問題がある場合が濃厚です。具体的には「プログレッシブ/インターレース」の違いによってiPhone版Safariの挙動が大きく異なるみたいです。

- 参考リンク https://deep-space.blue/web/822

P.S.
現在のweb事情を鑑みればスマホ対応は常識必須ではありますが、その一方で相変わらずHTML5で導入されたマルチメディア対応用のタグ関連には不具合が延々と出て続けています。

確かに <video> で挿入した方が全てを自分のwebサーバ上で完結出来るため使い勝手は良さそうに思えますが…しかし結局、IT知識皆無の不特定多数の閲覧者に対して過不足無く安定してコンテンツを提供出来ないのであれば意味がありません。

本当に動画をアクセス時に自動再生させる必要はあるのか、単にYoutube動画で代替出来ないか～等々をもう一度再考し、webサイト全体の構成やコンテンツ形式などを見直してみる事も考えてみてください。

お礼

返信遅くなりまして申し訳ありません。
いろいろ試していたら時間かかりました。やはり動画側の問題ですよね！とても参考になりありがたいご意見頂戴できてよかったです。問題解決しました！！