Contents
ローディングアニメーションとは？
ローディングアニメーション、ローダーは、Webサイトにアクセスしたときなどの「読み込み中」の画像です。
ローディングアニメーションが表示されない場合、フリーズしてしまったとか、反応がないと思い、ページ離脱につながりかねないので、ユーザーを待たせる場合はローディングアニメーションを表示してあげるとよいでしょう。
ローディングアニメーションの種類
GIFアニメーションがこれまでの主流で、使ったことのある方もいると思います。
GIFの欠点である、背景透過の場合に周りにギザギザが表示されてしまうのを不便に感じたことはありませんか？
それを解消すべく近年、APNG（エーピング）やSVGによるアニメーションも出現していますので、好みによって使い分けてください。
超定番、どんなサイトでもしっくりくるローディングアニメーション
細長いのがぐるぐる回る
一度は見たことがあるであろうローダーです。
すーっとした感じの
こちらも出現率の高いローダーです。
ドットが回る
すっきりとした感じのドットのローダーです。
しずくが回る
回るシリーズでもかわいい印象です。
線が回る
すっきりとした印象の汎用性の高いローダー。
おしゃれなローディングアニメーション
反時計回りにゆっくりと
ローダーといえばなぜか時計回りが多いのですが、反時計回りに４つの線が回るローダーです。
半円が回る
半円のアウトラインがぐるーっと回るローダーです。
丸がはずんで回る
動きを感じるおしゃれなローダーです。
ボールがくっついたり離れたり
こちらも動きを感じるローダー。
個性派ローディングアニメーション
パックマンがパクパク
あのパックマンっぽい動きで、見ている方も飽きません。
ストップウォッチ
ストップウォッチの針がぐるぐる回るローダーです。
星がキラキラ
星が回る、かわいいローダーです。
歯車が回る
技術系のサイトにもよさそうな歯車。
Wi-Fi飛んでます
データ受信中的な印象でページ切り替わりにも。
スピードメーター
スピードメーターが左右に揺れるローダーです。
リサイクル
リサイクルアイコンが回っているような。
カメラのシャッター
カメラのシャッターを切ったときのような絵のローダーです。
カラフルなローディングアニメーション
風車がぐるぐる
Google Photoのアイコンっぽいローディングアニメーションです。
レインボーぐるぐる
レインボーカラーのぐるぐる回るローダーです。
パタパタ
パタパタ折り曲がりながら色が変わる、回らないローダーです。
ダウンロード
ダウンロードはいずれも下記のURLより可能です。
https://icons8.com/preloaders/
