ブログでGIF画像を使えるようになると、より表現の幅が広がります。
今回は、実際にGIF画像を作る一連の流れと、GIF画像を使う際の注意点をご紹介します。
かきばナ特に注意点は、サイトの評価に関わってくるからしっかり覚えてね！
ブログで動くGIF画像を使いたい！準備方法と注意点
GIF画像は、簡素な画質で短い動画をループさせるのに適しています。
10秒を超える長さや、高画質で見せたい場合には、MP4動画として埋め込みましょう。
ブログでGIF画像を使うまでの流れ
- 動画を用意する
- GIFアニメーションに変換
- WordPressに埋め込む
かきばナそれぞれ詳しく見ていこー！
①動画を用意する
パソコンやゲームの画面録画や、カメラで撮った動画を用意します。
見せたい部分だけを切り抜いたり、いらない部分をカットするために、動画を編集しましょう。
長くても10秒くらいに抑えるのが好ましいです。
おすすめのPC動画編集ツール
aviutl（無料）
②GIFアニメーションに変換
用意した動画ファイル（通常はMP4など）をGIFアニメーション形式に変換します。
おすすめのオンラインツールは「ezgif.com」です。
かきばナ動画をアップロードしてGIFに変換できるサイトだよ！
変換する際、フレームレート・解像度・色数などを調整して、ファイルサイズをできるだけ小さくすることがポイントです。
③WordPressに埋め込む
作成したGIFアニメーションファイル（.gif）を、WordPressのメディアライブラリにアップロード。
記事編集画面で、通常の画像を挿入するのと同じように、アップロードしたGIF画像を挿入します。
GIF画像を使う際の注意点
表現の幅が広がり、使えると便利なGIF画像ですが、いくつかの注意点があるのでしっかり確認しましょう。
ファイルサイズを小さくする
GIFアニメーションは、長時間になったり、色数が多かったり、解像度が高いとファイルサイズが非常に大きくなりがちです。
ファイルサイズが大きいと、ページの表示速度が大きく低下し、読者の離脱やSEO評価の低下に繋がります。
1つのGIFアニメーションは数秒～長くても10数秒程度に収めましょう。
音声がない
GIFアニメーションには音声を含めることができません。
音声での説明が必要な場合は、動画（MP4など）を検討しましょう。
アクセシビリティ（利便性）
スクリーンリーダーはGIFアニメーションの内容を読み上げられません。
必ずalt属性（代替テキスト）で、そのGIFアニメーションが何を表現しているのかを簡潔に説明します。
さいごに
GIF画像は、読者を一目で引き付ける魅力をもっています。
ただし、それは適度な使用であればこそ。
サイトが重くならないよう、しっかり使いどころを検討してくださいね！
