コマンド「cwebp」とwebpのサイト掲載について

cwebpコマンドのインストール

　筆者の環境ではパッケージに含まれていたので、インストールも簡単でした。
　インストールの際は「webp」で良く「cwebp」ではないです。

  #cwebpのインストール
  $ sudo apt-get install webp
  
  #基本ヘルプ
  $ cwebp -h
  
  #詳細ヘルプ（オプションも）
  $ cwebp -H
  
  #マニュアル
  $ man cwebp

　基本的な使い方は「-h」、オプションも含めた詳細なヘルプは「-H」で表示できます。

cwebpの使い方【シェルスクリプト】

　cwebpの使い方は簡単で、画質と変換前後のファイル名を入力するだけです。
　pngファイルから変換できますが、jpegファイルからはできません。。

  #基本的な使い方
  $ cwebp -q 数字(0-100) 変換前.png -o 変換後.webp

　これだけでwebp画像が生成されます。もちろん、元のpng画像も残ります。
　「-q」の後の数字は数字が大きいほど品質が高いです。デフォルトは75です。

webpでどのぐらい軽くなるか？

　webpに変換することでファイルの重さがどうなるかについては、画像の内容にもよるようで、あまり変わらないこともありますが、基本的には軽くなります。
　品質を100で指定しても、png画像よりは大体軽くなる感じです。

　ただし、品質80でjpegに変換した画像と比較すると、jpegの方が軽い場合もありますので、やはり内容によりけりという感じになるのでしょうか。
　とはいえ、webp画像はレスポンシブデザインにも向いていますし、透過も使えるわけですから、webpに統一してしまった方が楽かな〜という気がしています。
　このサイトでは、品質80で指定してwebpを使うことが多いです。

webp画像をサイトに設置するには？

　webp画像のサイトへの設置の仕方について調べると、「<picture>」のタグを使ったものが多いですが、これは未対応ブラウザ用に代替画像も指定しておくためです。
　未対応ブラウザを気にしないなら、通常のimgタグを使えば良いと思われます。alt説明文や画像サイズの指定なども同じようにすればOKでしょう。

  #未対応ブラウザを気にしない場合
  <img src="画像URL.webp" alt="画像の説明">

　ちなみに、「<picture>」は複数画像を使い分けるためのタグだからなのでしょうか、webp画像一つだけを指定してhtmlソースを書いても、うまく表示できませんでした。

webpのデメリットと運用について

　webpのデメリットといえば、未対応ブラウザがまだ少しある以外にも、画像ソフトで対応していないものもあるという点でしょう。

　そのため、筆者の運用としては、基本的にping画像を手元においておきつつ、アップするなど必要なときに、cwebpでwebpに変換するという感じでやっています。
　単にwebpファイルを表示するだけなら、対応ソフトがなくても、ブラウザで表示してしまえば良いです。

　実際のところ、世間への浸透具合もこれからなのかな〜という感じです。
　そのうち、LinuxでもWindowsでも、今後webpの利用環境は整ってくるでしょうから、あわてず待つというというのも一つの選択肢かもしれません。