アイアンオー

top

BLOG

画像ファイル形式
2019年12月09日

Web担当の織田です。
最近多くのホームページが活用している「SVGファイル」と言うものを聞いたことがありますでしょうか。SVGファイル(スケーラブル・ベクター・グラフィックス、Scalable Vector Graphics)はJPEGやPNGなどの画像との違いは、ビットマップデータなのに対し、SVGは二次元ベクターデータであることです。簡単に言えばこんな感じです。↓


ちょっと大げさにしてありますが、SVGファイルは大きく扱っても荒れることがありません。
さらにこれ、文字列のコードで作成されるフォーマットなのでcssと組み合わせてアニメーション変化もつけれます。簡単にパスアニメーションなども作成できます。
タイミングよく、ちょっとしたアニメーションを付けたいサイトを作成することがあり、『SVGを使って簡単にパスアニメーションなども作成できます。』という記事をgoogle先生に聞きながらやってみてようやく一つ完成。
一度できればもうこっちのもの。
他にもcssと組み合わせてローディングアニメも作成してみました。
どうせなら目指すは、http://louie.co.nz/25th_hour/くらいまで作成できるようにしたいのですが…

このようにWebサイトの作成方法はどんどん新しく便利なものが増えていきます。アニメーションとは言いませんが、『今っぽい』もやはり閲覧者には重要なのではないでしょうか。Webサイト新設・リニューアルなどをお考えの方がおられましたらぜひご相談ください。

Writing:Oda-Y