Webデザイン

【gfyCat】10分の1以上圧縮!GifアニメをWebM形式に変換してWebサイトに貼り付ける!

こんにちは。FASTCODINGデザイナーの七転び八重子です。
今更ながらですが、ブログやWebサイトnに動画やgifアニメを扱う方って多いのではないでしょうか?
ユーチューブにアップして貼り付けしたりするの手っ取り早い気もしますが、画面キャプチャーのgifアニメなどは、結構重たかったりします。私もブログで、手順を説明するのにGifアニメを作るのですが、重たいのでコマ数を削ったりと工夫しています。

そこで、本当に今更ながらですが、2014年頃からサービスを展開している「gfyCat」を利用してみようと思います。今回は、使い方から実際にアップしたGifアニメを貼り付ける所まで説明してみたいと思います。

ちなみに、こんな感じになります↓


  

gfyCatの使い方

https://gfycat.com/

① 会員登録

会員登録しなくても、利用できます。何度も利用される、ファイルを管理したい場合は、会員登録しておくと便利ですね。一回しか使わない方は会員登録スキップしちゃってください。登録した名前は、ブログやWebサイトに貼り付ける時に微妙に表示されるので、表示されてもいい名前、サイト名やブログ名にしておくと良いと思います。

② 動画 or Gifアニメをアップロードする

会員登録が終わると動画アップロード画面に変わるので、ファイルからドラッグ&ドロップするか、YouTube、Facebook、Twitch、Vimeo、InstagramのURLからもいけます。公開範囲をパブリックにするか非公開にするか、音声を含めるか含めないか選べます。

アップロードと変換中

③ Webサイト(ブログ)に貼り付けてみる

変換が終わったら、シェアしたり、埋め込みできたりします。

埋め込みタグが表示されるのでコピーして貼り付けてみました↓


  

まとめ

gifアニメは、最初135MBありましたが、変換後は4.3MBまで軽くなりました。すごい。。
これは、色々なところで重宝しそうです。もっと早く利用していれば良かったです。