HTML
🎬 videoタグで動画が再生されない
ファイルパスまたはフォーマットの問題
😰 こんな症状
<video>タグを書いたのに動画が表示・再生されない。動画を埋め込むときに起きやすいよ。
🔍 原因
src属性のパスが間違っている、ブラウザが対応していない動画フォーマットを使っている、またはcontrols属性がないため再生ボタンが表示されていないよ。ブラウザによって対応フォーマットが異なるため、MP4（H.264）が最も互換性が高いよ。
❌ エラーが起きるコード
<video src="v.mp4"></video>
<!-- controls がない -->✅ 直し方
1. src属性のパスが正しいか確認する（開発者ツールのNetworkタブで404が出ていないか）。 2. MP4形式（H.264コーデック）を使う。 3. controls属性を追加して再生ボタンを表示する（<video src="movie.mp4" controls>）。 4. 複数フォーマットに対応するなら<source>タグを使う。
✅ 修正後のコード
<video src="v.mp4" controls></video>この解決法は役立ちましたか？
🔗 関連するエラー
- video/audio が自動再生されない — ブラウザの自動再生ポリシーでブロックされている
- 画像が表示されない — 画像パスが間違っている
- 拡張子が表示されない（.html が見えない） — OS の設定で拡張子が非表示
- faviconが表示されない — faviconのパスまたは形式が間違っている
- iframeが表示されない — 埋め込み先がiframeを拒否している
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- HTMLとは？初心者向けにわかりやすく解説 — タグの書き方・ページ構造の基本
- HTMLのパス（相対パス・絶対パス）の書き方 — パスの書き方を初心者向けに解説