線や塗りなど描画が美しいSVGアニメーションの作り方線や塗りなど描画が美しいSVGアニメーションの作り方ロゴやアイコンなどをWebサイトで拡大・縮小しても劣化させたくない場合に使用されるSVG画像。SVGには、gifのように画像をアニメーションさせることができ、gifに比べて滑らかな動きを表現できます。今回はXML形式とCSS3でアニメーションをつけて、ロゴやアイコン、図形などをリッチに見せる方法をサンプル解説とともにご紹介します。 SVGについての詳しい説明や作り方に関しては、こちらの記事をごらんください。 TIPS Vol.34 SVGの作り方 TIPS vol.64 SVGのデータ作成で気をつけるポイント SVGはベクター形式の画像。 jpgやpngなどの形式の画像と違いパスデータで構成されており、そのパスの情報をXML形式で持っているためコード上での編集が可能です。 そのため、XML形式のアニメーションタグを使ってアニメーションをつ
