00:00
ちょいさきトーク、あなたよりちょっと先歩いてきた人のWebと仕事の話。 この番組では、フリーランスでWeb制作をしている私、けいが、上司じゃないけど、ちょっと気軽に話ができる、隣の席の先輩のような立場でWebと仕事について語ります。
さて2月に入りまして、名古屋ではすごい寒い日と暖かい日が、もうなんか変わり箱ぐらいにやってくるみたいな感じになってまして、ちょっと体調はですね、だいぶ怪しくなってきています。
ちょっと喉もですね、乾燥もありますし、なんか意外がするので、なんかこれ怪しいなと、今すごい不安を感じているところです。
大人になりますと、子供の時みたいに体調が悪い時に熱がバーンとなかなか出ないっていうのがありますよね。
なんかちょっと重い感じするけど、熱測ってみたらそんな大したことないみたいなのがあるので、どのぐらい悪くなったらもう医者さんに行くのかっていう判断がなかなか難しいところかなというふうに思っています。
もうちょっと経ちますと花粉症がありますので、それかなっていうのもあるんですけど、どうなんですかね、今年も早い人は花粉きてるよっていう人もどうもいるみたいなんですけど。
私は去年とか考えても、まだこの時期は大丈夫だったかなとは思うんですけど、まあ風邪とかインフルエンザじゃないといいなと思うんですけれども、体調にも気をつけながらやっていきたいなというふうに思っています。
なかなか大人になりますと、もう今日は1日寝る、もう家のこともやらないみたいなそんなことができないので、なんとかごまかしごまかしやっていかないといけないのがなかなかつらいなと弱音を吐きたくなることがあります。
とはいえ、予定通り収録は頑張ってしていきたいなと思います。
さて今週はですね、ウェブと画像というテーマでお話をしています。
昨日は写真をウェブサイトに掲載するときに、結構気をつけた方がいいセオリーみたいなのがあって、そういうの会社でちゃんと教えてもらってますかと、私は新人で入った会社でそういうのを教えてもらったのが今すごいありがたかったかなという話をしました。
教えてもらってないなということはこれを機会にですね、自分でちょっと調べてみるということをされてみてもいいのかなと思います。
今日はですね、画像の形式の話をしたいと思います。
今次世代型の画像形式ということで、いろいろですね、昔なかったような形式、軽量化のフォーマットとかいろいろ出てます。
代表的なのだとWebPですね、WebPと言ったりしますけど、とかあるんですけど、そういう話ではなくて、本当に基本の昔からあるフォーマット、ここの特徴をちゃんと理解していますかというのを改めて当会にしてみたいなと思います。
というのもですね、最近何でもかんでもPingで提出をするっていう方がですね、なんか増えているんじゃないかというような印象がありまして、ちょっと具体的にそういう出来事がいくつかあったんですけど。
例えばですね、デザイナーさんからバナーとかの納品があったときに、切り出したものを納品していただくときにですね、Pingでいただくということがあります。
03:08
Pingであればこちらでいかようにも調整して、再圧縮とかかけたりできるので、Pingであればよっぽど大丈夫なんですけど、ちゃんと認識してPingを選んでいるのかというのがですね、気になる場面というのがあったりします。
私とかですね、もう少し上の世代のインターネット老人会にしてみますと、Pingでいわゆる透過Pingですね、後ろが透けているPing画像、あれがインターネットエクスプローラー6でうまく透過されないっていう時代を経験してきた人もいると思うんですけど、なかなかそれをもう知っている世代もだいぶ減ってきたかなと。
知らない世代が増えてきたなという気はします。今となっては、もう透過しようがしまいがあまりブラウザの互換性とか気にせずPing、全然問題なく使えるようになってはいるんですけれども、大きなPingのデメリットとしてやっぱり重いんですよね。
JPEGの形式にすれば3分の1とか4分の1ぐらいのファイル容量で済むものが全部Pingではめ込まれているということがあったりしまして、画像形式をどうやってみんな選んでいるのかというのがすごい気になったという出来事が最近ありました。
もう一個別の事例でですね、これお客さんからいただいた相談なんですけれども、ブログ記事のOGP画像、シェアした時に出るサムネイルですね、あれをアドプレスのアイキャッチとかに設定するとOGP画像に設定されるという仕組みになっているパターンが結構多いと思うんですけれども、
それをお客さん自身で設定をしてフェイスブックにシェアをしたと。ただですね、OGPの設定はうまく入っているんだけれども、フェイスブックの実際の画面に見た時に画像だけ出ないという現象が出てまして、どうしてこうなるのか教えてほしいというのを相談を受けました。
私もそういう現象はあまり見たことがないので、デバッカーとか使いながらよく調べたんですけれども、最終的にですね、画像のサイズ、容量が重すぎることが原因だったということが分かりました。
その画像がですね、Pingの画像でアイキャッチ作ってあったんですけれども、800キロバイトちょっとぐらいありましたね。それを私の方でJPEGに変換をして、そうすると200キロバイトないぐらいの容量になったので、それに差し替えて試してみたらデバッカーでもちゃんと出るようになったというようなことがありました。
これからこういう理由でサイズ容量が重かったので、こういういわゆるベタ塗りではなくて、実写画像のようなものはPingではなくてJPEGにしていただいた方がいいですよという話をしたときに、JPEGだと荒くなりますよねって言われたんですね。
それを聞いたときに、JPEGで圧縮率、いろいろ調整ができるので、一概に荒いとか荒くないとかっていうのがJPEGだから決まるわけではないですよっていう、そういう説明をしたんですよね。
06:05
実際その人間的に見た目があまり変わらずにPingをJPEGに変換するツールっていうのもありますので、そういうのを使えばパソコンとか機械だけで読み取れる情報をカットして、画像の容量を軽くすることができたりしますというようなことをお話しして、今後JPEGの形式でサイズの容量を減らしていただいて、人間の見た目で見てもそんなにガチガチに荒くならないぐらいの高画質を確認しながら保存していただくといいですよというような話をしました。
そうか、Pingは画質が良い、JPEGは悪いっていう、そういう認識を持たれているパターンがあるんだなというのに気づきました。
もちろん今回相談してくださったクライアントさんはWeb業界の方ではないので、詳しいことを知らなかったということは全然責められることではないと思うんですけど、そういうことをお伝えしたら、そうなんですねって言って今後運用に生かしていただけると思うので、知らなかったことが良くなかったというような話ではないと思うんですけど。
一方でWeb業界に身を置く方であれば、そういう画像形式のそれぞれの特徴っていうのはやっぱり抑えておくべきなんじゃないかなというのは改めて感じました。もしかしたら釈迦に説法かもしれないんですけど、おさらいをしておきますと。
JPEGが向いているのは人物写真とか風景写真とか、いわゆる実写の画像、フルカラーの画像、こういったものですね。JPEG形式の画像っていうのは非可逆圧縮って言いますね。可逆、逆にできる、非なので逆にできないっていうことですね。つまり一回圧縮しちゃうともう元には戻せないよ、一歩遂行ですよっていうのがJPEGのような非可逆圧縮の形式の特徴ですね。
PINGは可逆圧縮で戻すことができるよと、こういう特徴があります。ですので一旦PINGで保存をしておいて、中間生活物として置いておいて、実際にサイトに掲載するときにJPEGにするのかどうかっていうのを判断すると。
必要に応じて形式変換したりとか、あと軽量化のためのツールいろいろあるので、そういったツールにかけて一括で軽くしてから使うとか、そういった感じで使うことがセオリーかなと思います。
PINGが向いているのは先ほど言いましたけど、背景が透明になっている透過型の画像ですね。後ろが透けてないといけないもの。これに関してはフルカラーであってもPINGにせざるを得ないということはあると思うんですけど、要領が重くなりがちというのはあります。
最近の技術ですと、例えばSVGとかの図形でクリップするみたいなこともできるようになるので、必ずしも透過をPINGじゃないとできないかというと、今はそんなことはないんですけど、そういう細かいところの技術は一旦置いておきます。
そういったものとかアイコン、あとベタノリのシンプルな図形とかですね。そういったものはPINGにしていただいた方が軽くなるかと思います。
09:03
フォトショップとかであれば、どの形式だと何キロバイトぐらいになりますよというのがバッと出ますので、それで選んだりとか。
最近キャンバーとかで作るパターンも多いので、そうなるとPINGがデフォルトに確かなっていたと思うんですけど、それでも一回その軽量化のツールというのが結構いろんな無料のものがいっぱいありますので、それを一回かけてみるというのは、
わりとそのウェブ業界の方じゃなくてもすぐできる工夫かなと思うので、そういうのがクライアントさんの結構しっかり運用されているクライアントさんであれば、そういうのを教えてあげてもいいのかなというのを思ったりしました。
これまた昔話になって恐縮なんですけれども、昔はですね、画像容量が重いと怒られました。先輩とか上司とかから。
目安がですね、100キロバイト超えたら200キロバイトぐらいになってくると思うよみたいな話をされることがありました。
当時はね、スマホとかもないですし、レティーナディスプレイっていう高解像度の画面もない時代なので、インターネットもまだ光はもちろんありましたけど、ADSLとかISDNとかっていう電話回線を使ったインターネット接続もまだまだ現役な時代だったので、
軽くするというのは当たり前だよというのをだいぶ言われたことがありますね。じゃあ今この2026年振り返ってみて、回線が速くなったから画像の容量気にしなくてよくなったんでしょうかと考えてみると、そんなことないなというふうに思います。
ここは昔と変わってないですよね。サイトの表示速度が速いほうがSEOにいいですよみたいな、そんな話が出回ったこともありますし、これはいろいろ言い方次第ではあるんですけど、軽いほうがいいのは確かです。
あとですね、スマートフォンのインターネットの契約なんかも通信無制限っていう料金プランの人、かえって今少ないと思うんですよね。月末にギガを使い切って低速になっている人とかって結構いると思うんですけど、この2020年代後半になった今、現代のほうが個人の通信環境、シビアな面っていうのもあるのかなというふうに思います。なので軽いほうがいいよねというところですね。
ウェブに関わる方、これはウェブ制作の仕事をしている人はもちろん、ブロガーさんとかそういった方もやっぱり画像形式に関して最低限知っておくっていうのは本当に損はしないなと思いますので、ちょっと今まで改めて考えてみたことないなという方は一度画像形式の基本についてちょっと調べてみるといいのかなというふうに思います。
さて今日のまとめとしましては、何でもかんでもPingで使ってないですかと。JPEGの圧縮率、いろいろ調整ができますので、人間の目にあんまり差のない形でできるだけ軽くしてあげるというような配慮も必要なとき結構ありますよというのを今日のまとめにしたいなと思います。
さてこれをお聞きくださっているリスナーの方はですね、投下Pingが投下できなかった時代をご存知な方いらっしゃいますでしょうか。多分私の直接の知り合いの方はみんな知っている方ばかりだとは思うんですけども。
12:05
あとは最近出てきた画像形式その辺の情報を追っかけて使っている方はこういう感じで画像の軽量化やってますよとかそういうティップス的なところなんかも共有いただけると嬉しいなと思います。
今日も最後までお聞きくださりありがとうございます。おたよりや感想は概要欄のおたよりフォームかXでちょいさき遠くのハッシュタグでポストしてください。それではまた明日。
