ウェブサイトを運営していて「GIF 動画を WordPress に盛り込んだものの、アニメーションが動いていない」という状況に遭遇した方、それは WordPress で GIF がフルサイズで設定されていないからというのが原因かもしれません。
筆者も Web サイトのコンテンツを編集している際にGIF 動画が動いていないという現象があったのですが、GIF ファイルをフルサイズに設定し直すことで解決しました。今回はその解決策を覚書として記載しております。
前提：GIF ファイルそのものは正常である
WordPress 以外でGIF ファイルを見てきちんと動いているか確認すること
それで動いていなければ、WordPress 以前の問題である
WordWordPress上でGIFファイルをフルサイズに変更すればOK
結論：画像サイズを「フルサイズ」に変更して解決
画像ファイルをフルサイズに変更するのは、画像を選択して右の設定バーの「画像サイズ」のプルダウンメニューから行えます。
まずは、動かないGIF ファイルが入っている記事を開きます。
次に画像選択して、右側の設定を開き、画像サイズを変更するという流れです。
なぜフルサイズじゃないと動かないの？
GIFファイルが正常に動かない（アニメーションされない）理由は、ファイルが圧縮されてしまうからです。フルサイズであれば、そのままの GIFの機能が発生します。
しかし、それ以外のサイズというのは基本的に画像のサイズ・容量が縮小してしまいます。この過程でアニメーションのプロパティが破壊されてしまうようです。
調べたところによると、画像のトリミングをGIFファイルで行うと、アニメーションが破壊されてしまうらしいのですが、（すみません非検証です）これと同じ原理で、画像の容量を減らすという、修正をする過程でアニメーションが壊れるのかもしれません。
画像関連のプラグインも注意が必要
フルサイズであるのに、GIF 画像が動かない場合は、プラグインも影響している可能性があります。たとえば、画像のファイルを最適化するみたいなプラグイン。
これも自動で画像が圧縮される場合があります。こうなると上述した「GIF ファイルのアニメーションが壊れてしまう過程」がおきましまう可能性があります。プラグインが疑わしい場合はまずそのプラグインを無効化して、再度画像を見てみるのがよいでしょう。
それでもGIFを圧縮したい場合は？
WordPress上では画像サイズをフルサイズに選択しないと、GIF画像が動かない。しかし、そのまま GIF ファイルをアップロードするとなると、容量が重たすぎるのでなんとかしたいと悩んでいる方もいるでしょう。
このような場合は、そもそもGIFファイルを特定の外部ツールで圧縮してから、WordPress 上にアップロードするのが良いでしょう。
Google検索で「GIF 圧縮ツール」と打ち込むと以下のようなツールがでてきました。
https://www.iloveimg.com/ja/compress-image/compress-gif
筆者も無料でオンライン上でファイルを圧縮することができました。
ただ、思っていたよりは圧縮がされませんでした。22.3MB→21.6MBで、4％程度の圧縮率です。JPGやPNGだと、圧縮したりすると結構削れるのに…。GIFはあまり軽くならないのかもしれませんね（筆者主観です）また、圧縮するにも数分時間がかかるようです。
まとめ
今回は、なぜ WordPress 上で GIF ファイルのアニメーションが機能しないのか、について解説しました。結論としては、WordPress の機能によって画像が圧縮される過程で、アニメーションの機能が損なわれるから、となります。
このような状態を避けるには画像サイズを「フルサイズ」に選択する必要があります。フルサイズとはもともとの画像サイズを維持してそのままアップロードする、というもので、これであれは GIF ファイルの機能が損なわれません。
その他画像に関わるプラグインがある場合、それらが悪させて画像を圧縮してしまい同様にアニメーション機能が損なわれるケースもあるようなので注意した方が良いでしょう。
コメント