こんばんは、織田檸檬です。
最近apngというのを知って、それで画像を作ってるのですが、GIFの方が良くないかっていう気持ちが出てきています。
GIFの次世代規格としてのapng
こないだ友達と飲みに行ったとき、GIFはオワコンみたいな話になりました。たしかにまぁGIFって懐かしい香りがしますよね。(偏見)
僕はGIFに対してあまり思い入れが深いわけではなかったので、その言葉を素直に受け取り、ではGIFに取って代わる次世代規格って何があるんだろうと検索したところ、apngを知りました。
apngとはAnimation PNGの略みたいです。pngはお馴染みだなとはじめはちょっと期待しました。
しかし再生環境としてChromeが対応していないと知った時、イマイチだなと思ってしまいました。
イマドキChromeに対応してないなんて、3,4割のユーザーを切り捨ててますよね。
GIFの次世代規格としてはもうひとつ、webpというものがあるらしいのですが、そちらはChromeに対応してる代わりにSafariとFireFoxは対応してません。
うーん。
まぁGIFが完璧とは言えないので、よりよいものがあればいいなとは思っているのですが。いまのこの2つだと、乗り換えたい気持ちがあまりわきません。
ですが追求していくと何かいいことあるかもしれないなと思っているので、とりあえずいま僕はapngの方に着目してます。
なぜならapng(Chrome環境)の場合、再生されなくても1フレーム目は画像として読み込まれるからです。
というかwebp(Safari環境)の場合は表示されないらしいので、それくらいだったらapngかなぁという、あまりポジティブでない理由ですが。
追記
いつのまにかChromeでもapngの再生に対応してましたね(2017/6/5からでしたっけ)
これでwebpを選ぶ理由がさらになくなりましたね。
でもどっちも重いんだよなぁ
ただやはり正直な感想を言わせてもらうならば、apngもwebpも、どちらも微妙です。
なぜなら画質が良い分、重いからです。
重いと結局何に影響してくるかというと、PV数に影響するんですよね。
Google先生はページが重いとあまり検索の上位にひっかけてくれないみたいなので。
その点GIFは画質を犠牲にする分、軽いです。しかもどのブラウザでも対応してます。なのでぶっちゃけ、GIFにそんなに嫌悪感がないんですよね。(だからapngもwebpも知らなかったんですけれども)
ただもう現在では、みなさんバンディングしてる画像とか不快に思うようになってしまっているので、GIF安牌というわけでもないです。GIFで画質をあげようとしたら、結局重くなってしまいますしね。
画質を確保して容量を軽くしたい場合
まぁ結局、一枚絵でなく動かしたい。でも画質も良くて、容量も軽くしたいという場合、とれるアプローチは2つあると思います。
- 色を少なくかつアニメーション時間を短くする
- 動画にしてしまう
まず作るものに制限をつけることを考えます。
2色でグラデーションもなしにしてアニメーションさせれば軽いし画質もよいかと思います。
2色以上つかってグラデーション(モーションブラーも含む)があると途端に重くなりますから、逆に考えてみています。
白と黄緑の2色のみ。モーションブラーを使っていないのでグラデもなし。そうすると250KBまで落とせる。しかし描ける中身が限られてくる。
もう一つは、もう画像にしない、ということで動画にしてしまうことです。
問題のレイヤーを一つ上に持ってきて、そもそもアニメーション画像である必要性があるのか、というところから、動画化という案です。
個人的な感想を申し上げますと、mp4形式の動画がもっとも良い結果が得られます。画質も損なわず、しかも軽いです。なんなら音だってつけられます。
ただ致命的な問題として、それは画像ではなく動画、ということになる点です。
GIFやapngの良さというのは、画面を支配せず、自動的に絵を動かせる点にあると思います。
動画だと再生するためにタップしないといけないですし、タップすると画面が切り替わってタイムラインバーと再生/一時停止パネルが表示されてしまいます。
こういう風になってしまうと、ウェブページに置く意味があんまりないんですよね。
はてさてどうしたものか。
まとめ
というわけで僕は未だにGIFから抜け切れていません。
なるべく尺は短くするので、せめてどんなものを作っても1MBを切れるようになる規格が出てくれれば嬉しんですけども、それは無茶なんでしょうかね。
あと仮にapngかwebpどちらかを使うとして、apngはChromeに、webpはSafariやFireFoxに対応してくれないとはじまらないという。
もしかして今までの問題を解決してくれる規格が他にあるかもしれません。もしご存知の方がいらっしゃればコメントください教えてください。
以上です。
今日のGIFについて
今回はapngで作ってます。6MBと、ちょい重めですすいません。やはり2色でもグラデーションがあったら重くなっちゃいますね。(3DCGだからっていうのもあるかも)
もごもご動くだけの画像です。観たい方はSafariかFireFoxでどうぞ。