HTML5で画像ファイルを作る

画像には、静止画と動画があります。

静止画

キャンバスに絵を描くような「ビットマップ画像」と、数的処理で描く「ベクトル画像」があります。
ビットマップ画像には、ソフトで描画する方法と、デジタルカメラで撮影する方法、スキャナでアナログ画像をデジタル変換する方法、パソコンデータを「画面キャプチャ」する方法などがあります。

ベクトル画像は、パソコン上で作成します。フリーソフトの「Inkscape」や、商用ソフトの「Adobe Illustrator」が著名です。
プレゼンテーションソフトの「Microsoft PowerPoint」や、「Microsoft Excel」の描画などもベクトル画像です。
HTML5では直接ベクトル画像を描く「Canvas 2D」、「インラインSVG」という機能があります。

動画

平面(二次元動画:アニメーションやビデオ)と立体(三次元アニメーション)があり、アプリで作成する方法と、ビデオ撮影編集の方法があります。
二次元動画作成には、「gifアニメーション」、「flashアニメーション」、「SVGアニメーション」(SMILアニメーション機能利用)、「YouTube」、「Windows Media Video」などがあります。

三次元動画には、「WebGL」があります。