![見出し画像](https://assets.st-note.com/production/uploads/images/74864881/rectangle_large_type_2_6ec6dbf78cb1789d80eaef787bcc4b59.png?width=1200)
GIFアニメーションをつかってブログに表情をつけよう|vol.098
大分でIT会社を経営したいます
ロックスカンパニー久保田です
今日もよろしくお願いします
私の使っているこのブログ
note(ノート)といいます
通常ブログに動画を貼り付けたい場合
YouTube もしくはVimeoにアップした
動画のリンクを貼るしかありません
今日は文中にどうしても
動きをつけたい場合の
テクニックをご紹介します
静止画は問題なく貼ることができます
Jpeg.png.gifの3種類の静止画に対応しています
※静止画のフォーマットについては
過去ブログで説明していますので
こちらをお読みいただいて
本ブログをお読みいただくと
もっとわかりやすくなります
この焚き火の映像は「jpeg」でできています
![](https://assets.st-note.com/img/1648014222471-tePVZ7IE6c.png?width=1200)
当然写真ですので動きませんが
同じ静止画のフォーマットでも
動く静止画があります
![](https://assets.st-note.com/production/uploads/images/74860911/picture_pc_49e3962194afa488ce42dd192a7b9685.gif?width=1200)
これは「gif(ジフ)」という静止画を
パラパラ漫画のように数枚の静止画を
ひとつのファイルにした
「GIFアニメーション」
と言われるフォーマットです
GIFアニメーションは
静止画と扱いが同じなので
静止画条件の場所に
配置することができます
GIFアニメーションは
データ容量が重くなりますので
注意しなければなりません
ではどうやったら作れるのか?
サービスサイトを紹介しますので
チャレンジしてみてください
GIFアニメーションを作成できるサイト紹介
▶︎gifs
YouTubeやVimeoなどの
動画からGIFアニメーションを
無料で作成できます
文字やロゴも入れることができ
ブログやSNS(Twitter・Facebookなど)
に埋め込むことが可能です
▶︎LICEcap
デスクトップの
動画キャップチャを
録画してGIFアニメーションを
無料で作成できます
便利ですが録画サイズが大きいと
GIFファイルサイズも
膨大になるので
気をつけましょう
![](https://assets.st-note.com/production/uploads/images/74863226/picture_pc_bde1e26f05df569c7a7cc160c958298a.gif?width=1200)
こんな感じでGIFアニメーションができます
本ブログの場合
5MBぐらいであれば
問題なく表記してくれるみたいです
いろいろチャレンジして
ブログに表情をつけてみてください
それではまた
この記事が気に入ったらサポートをしてみませんか?