2020.12.20 2023.05.03

【解説】「WebPうざい」と言われても使われる切実な事情【画像拡張子】

WebP,Google,画像,拡張子,ウェッピー

サイト運営者からは重宝される『WebP(ウェッピー)』ですが、閲覧する人からは邪険(じゃけん)に思われているなど、双方の認識に乖離(かいり)がある画像フォーマットです。

なぜ嫌われてしまうのか、重宝されている事情や理由を述べていきます。

同じような性質を持つ『JPEG 2000』や『JPEG XR』については、前者はSafariのみ、後者もEdgeやIEしか対応していない規格で需要が低いため、この記事では扱いません。

なお、当記事は2020年現在の現状・認識で記載されていますから、将来的にこの認識が変わる可能性があることは、あらかじめご了承ください。

  • 個人の見解です

    ほかの意見もご参照ください

WebPとはなにか?

背景

うぇっぴーって響きが
くせになる

『WebP』は2010年にGoogleが開発した、GIF・JPG・PNGなどに代わる新時代の画像規格です。

WebP|Wikipedia

WebPは「データが従来の拡張子と比べ、最大で半分になるぐらいに軽く、画像劣化も少ない」ところに大きなメリットがあります。

フキダシ1

同じくGoogleが開発した『WebM(ウェブエム)』という動画規格については、こちらも記事の趣旨からずれるので割愛(かつあい)します。

WebPがうざい・嫌われる理由

背景

嫌われるのは
相応の理由がある

しかしネット・SNS上ではWebPに否定的な内容が2010年代後半から言われるようになり、

フキダシ3

WebPはうざいし迷惑だからやめてほしい。

といったネガティブな内容が並ぶようになってしまいました。

WebPが嫌われる一番の原因は、「現状だと通常画像アプリケーションで開けない」ことでしょう。

つまり、PCやスマホにダウンロードしても標準アプリケーションではWebPの中身を見ることはできず、Chromeブラウザや専用アプリケーション、拡張機能が必要になってしまいます。

「Googleが作った」なだけあってWebP未対応なブラウザ環境もあり、iPhoneなどのiOS SafariのWebPは、2020年になってからようやく実装されたほど(WebPの登場は2010年)。 

WebPを従来の画像拡張子に変換するアプリケーションやオンラインサービスはあっても、閲覧者側からすれば、手間がかかってめんどくさいものです。

確かに自分も絵を描く資料集めで画像収集してWebP画像だと、「WebPかよ……変換しなきゃ」ってなる。

フキダシ2

その落胆ぶりをMacユーザーにわかりやすく言うならば、「ダウンロードしたらMacでは基本的に開けないexeファイルだった」に近いかと。

Safari 14、新たに 「WebP」 形式の画像をサポートへ JPEGと比べ画像サイズが約30%少ない画像形式|CORRIENTE.TOP

それでもWebPが使われる理由

背景

サイト制作では
ありがたい存在

それなのにも関わらずWebPが使われるのは重ねるように、「容量が軽くて劣化も少ない」からです。

サイト制作・運営では常識の話で、

  1. サイトの容量は軽くし、極力1〜2.5秒以内に表示されなければならない。
  2. なぜならSEO(検索最適化)が低下して検索評価に影響が出るし、5秒以上かかると離脱率も上がるから。
  3. しかし画像は重いデータの宝庫。高解像度の液晶が普及した現代で、容量削減の小さい画像では表示が荒くなる。
  4. GIFは画素数が足りないし、JPGは軽くすれば劣化し、PNGは重たすぎる。
  5. 画像が軽くて劣化も少ないのは、WebPしかない。

ゆえに今のサイト制作では、WebPを適用するのはほとんど当然であり、WebPが非対応のブラウザのみ、JPGやPNGなどに代替表示する記述が主流とされています。

この最適化作業を業界の専門用語で、『コアウェブバイタル(ウェブバイタル)』といいます。

細かく言うとLCPに分類されるけど、ウェブバイタルの記事ではないのでご割愛。

フキダシ2

特に当サイトのような画像メインサイトで、「重い画像でサイト点数が下がり、検索結果も下がって離脱率も上がる」は最悪のパターン。

SVG(ベクター画像)やサイト圧縮、レイジーロード(遅延読み込み)もしているものの、根本的対策はWebPを使用して、画像の容量を軽くすることです。

GoogleもWebP適用を推奨

Googleが提供する『PageSpeed Insights』という表示速度計測をするサイトでも、WebPの適用は推奨されていて、していないと「次世代のフォーマットを適用してください」と改善注意をされます。

PageSpeed Insights|Google

WebP,Google,画像,拡張子,ウェッピー
当サイトはWebP化していますが、ツイッターのフィード画像が引っかかったようです

ものすごく砕けた言いかたをすると、

フキダシ3

まだJPGとかPNGみたいな時代遅れのヤツ使ってるの? 今の時代はWebPなのにだっさーい! プークスクス!

という感じ。

語弊はあるだろうけど、だいたいそんな感じ。

フキダシ2

繰り返すように、WebPはJPGやPNGと同じ画質・大きさでも、最大で半分の容量に抑えられて劣化も少ないですからね。

最後に:閲覧者の気持ちもわかるけど切実な事情もある

背景

お互いのすれ違いが
切ない…

以上、WebPにおける現状と事情を解説しました。

  • 運営・制作者側】「WebPは容量が軽いし劣化も少ない! 便利!」
  • 閲覧者側】「保存したらWebPじゃねぇか……開くのめんどいしやめてほしい」

2020年の段階では、この双方の溝が深いんですね。

フキダシ1

WebPはGoogleが推(お)しているだけに、将来的に使用が当たり前になります。従来の拡張子のように簡単に開ける仕組みになれば、WebPを冷ややかに見られるのもなくなるでしょう。

当サイトもWebPですけれど、作品投稿サイトや支援サイトでは従来どおりJPGで公開しています。気になる絵がある場合はそちらも覗いてみてください。

寄付のお願い

フキダシ3 ありがとう
ございます
  • 当サイトはみなさまのご支援により、広告なしの実現やサイト維持をおこなっています。

    記事や作品が気に入りましたら、支援サイトのご支援や寄付をよろしくお願いいたします。

記事・作品をシェア

https://umakose.com/notes/201220-1/

クリック・タップでコピーできます

1.シェアについて

赤竹ただきち(以下、当管理者)がウマコセドットコム(以下、当サイト)の内容をシェアする場合、個人サイト・ブログ・サービス・SNSを問わず、URLなどを記載して出典元を明記ください。

明記していただければ、社会通念上の範囲内でご自由にシェアが可能です。

2.記事の引用(転載)

記事内の文章を引用される場合、URL元を明記した上で引用要素(blockquote)内に記載してください(なおサイト内のコピペは悪用・言い逃げ対策のため不可にしています。ご了承ください)。

掲示板やSNSの場合は、文頭に「>」などをつけ、オリジナルコンテンツ(コピーコンテンツ)ではないことを明確にしてください。

要約のための一部改変は、記事の意図を大幅に変えなければ可能とします。

3.キャラクターの使用

当サイトに掲載されているオリジナルキャラクターの使用は、創作性が高い非営利の個人に限り、イラスト・マンガなどに使用できます。非営利・個人の定義はこちらをご参照ください。

制作費・人件費の範囲内であれば、有償配布や支援サイトの掲載も可能としますが、AIで作成した作品で有償行為をするのはご遠慮ください。

4.禁止行為

以下の行為が見られた場合は、個別のご連絡や法的処置などといった対応をとらせていただく場合があります。

A.二次利用・加工・改変

本サイトの画像・イラスト・文章・ブログレイアウトなどの悪意ある二次利用・加工・改変行為や、信用毀損・反社会的など、社会通念上問題のある目的での利用。

B.不適切な拡散

特定のキーワードや文面に反応するなど、不適切な拡散行為の禁止(誤った解釈のみならず、〈自他問わず〉いわれなき風評被害や誹謗中傷につながる恐れがあるため)。

C.誹謗中傷

当サイト・他者・企業などを誹謗中傷する目的での引用。また煽り・マウント行為といった、意見・提起・指摘ではなく、人格・風評を著しくおとしめようとする行動も含む。

5.著作権

当サイトは著作権の侵害を目的とするものではありません。

画面のスクリーンショットや二次創作物の知的所有権はそれぞれの権利者・団体に帰属しており、各利用規約を確認した上で掲載しています。

有料二次創作は権利元の創作ガイドラインを厳守するように努めていますが、問題があれば当サイトのお問い合わせよりご報告ください。

6.トラブル

当サイト記事のシェアなどが要因で発生したトラブルなどについては、一切の責任を負いかねます。あくまでも参考・一意見として扱ってください。

当管理者まで直接ご意見・ご指摘を希望される場合は当サイトのお問い合わせからご連絡願います。

制定日:2017/2/24
改定日:2023/5/7

シェア・引用の前に「規約事項」をご一読ください(内容に同意したものとみなします)。

特定の単語・見出しだけで拡散、他者を誹謗中傷・マウント・バッシング目的のシェアは固くお断りいたします。

シェア内容が悪質だと判断した際、個別にご連絡を差し上げる場合があります(実際に幾度か対応させていただいております)。

社会通念上のモラルとマナーを守っていれば、こちらからご連絡をすることはございません。シェア・引用をしていただき、誠にありがとうございます。

プロフィール

    • フキダシ2
    • 赤竹ただきちTadakichi Akatake
  • 定期的に「ポーズマニアックスってトレスOK?」みたいな意見を見かけるけれど、「公式FAQに全部書いてあるじゃない」と言いたくなる……

    単に自分で調べる能力が低いのか、SNSの気軽な雰囲気で、調べる前に書いてしまうのか……こういう意見を見ると前者のほうに見てしまうのは、心が狭いのだろうかと自問自答。

    ちなみに公式見解ではトレスOKだよ(ただしポーズモデル素材を二次利用するのはNG)。

イラストレーター・コーダー+WEBデザイナー・ライターの京都生まれなウサギ好き。絵は多様な作風を描け、外国人でも絵でわかるマンガや、ウサギと口内描写にはこだわりを持つ。

コーディングとWebデザインは両方可能。案件によっては「デザインとコーディングの同時進行」の荒業もおこない、SEOを意識したマークアップも得意。

「自省・リテラシー向上・正しい批判」をライフワークとし、当サイト記事も「中学生でもわかりやすい、気づき・理解・学びを得る」を全体テーマとして執筆。

これは微力ながら閲覧者に考える・学ぶ助力のほか、自身も学ぶ目的も含み、「下手でも自分の弱さを認め、自省し学ぶことを忘れない人」は、年齢・性別問わず好きなタイプ。

自省についての解説を読む

リテラシーについての解説を読む

正しい批判についての解説を読む