アニメーションをサポートする形式はどれがウェブに適していますか？

アニメーションをサポートする形式はウェブに適しており、それぞれの長所と短所は何ですか。

必要なアニメーションのタイプによって異なります。

• .gif画像 -完全にサポートされていますが、フレームの使用は制限されています。.pngファイルはアニメーションをサポートしているはずですが、実際にはほとんど見られません。
• Flash、Silverlight、およびその他のプラグイン -Flashは最も一般的ですが、すべてのプラグインをブラウザーにインストールする必要があり、ユーザーのコンピューターにインストールする必要があるとは限りません。モバイルプラットフォームでは機能しない場合があります。
• CSS3-制限された変換またはアニメーション、制限されたブラウザーサポート。
• HTML5ビデオ -将来ですが、ブラウザのサポートは限られています。
• JavaScript-有効にする必要がありますが、ほぼユニバーサルなブラウザーサポートが必要です。限られた種類のアニメーション。Raphael.jsを参照してください。
• Canvasタグ -最新のブラウザーサポート。ただし、リッチアニメーションをサポートします。

これは、Virtuosi Mediaの優れた回答に追加されます。

Appleは最近、サイトでのアニメーションに静止JPEGおよびPNG画像を使用しています。JavaScriptを使用して画像を切り替えます。フレーム数が多くない場合、アルファ透明度のサポートが必要な場合、アニメーションをページ上に配置したい場合、およびブラウザの幅広のサポートが必要な場合は、優れた手法です。欠点は、ダウンロードのサイズと労力です。

インタラクティブにすることもできます。AppleのiPadページのSmart Coverセクションまでスクロールすると、実際の動作を見ることができます：http : //www.apple.com/ipad/features/

画像の下のレイヤーのアニメーション画像の上に透明度を含む画像をオーバーレイする場合。PNG24は、アンチエイリアスが背景画像と正しくブレンドされる唯一の画像形式であることがわかります。GIFとPNG8を使用すると、エッジがすべて分厚いことがわかります。見た目は良くありませんが、見逃しやすいです。