画像容量削減とYahoo!ブログの「転載記事」

画像容量削減とYahoo!ブログの「転載記事」

webのあれこれ
2019/05/07 2
vanillaice (Akira)
vanillaice (Akira)
初心者向け Education SEO Yahoo! 引っ越し

「画像容量削減」と「転載」に何の関連があるねん。という感じで。本来は別の記事にすべきでしょうが、まとめちゃう(笑)

ファイルサイズ削減は常識

またまた FC2リクエスト から抜粋。

ファイルサイズを10MBまでに

アップロードできるファイルサイズを10MBまでにできないでしょうか。5MBまでではきついように思います。これが実現したら有料会員加入を検討します。

ファイルサイズ というのは縦横のpxサイズのことではなく 容量 のことです。最近のデジカメやスマホデバイスで撮影された写真は解像度が高いので、5MB規制(無料会員は2MB)では厳しい、ってことですよね。

個人的に これには賛成できない。何故なら1枚あたり5MBでも容量が大きすぎます。それを10MBだなんて暴挙としか思えない。1枚掲載して10MBですよ?

webページの妥当な総容量は1ページあたり3MB程度と言われています。

画像だけで 3倍以上 です。一昔前だと「メールでデカい写真送ってくるな。パケ死 するだろうが。」なんてよく耳にしませんでしたか。データ転送量と画像容量は結びついているわけですからね。

というわけでFC2ブロガー、ぼっちんさんの啓蒙記事。

YahooブログからFC2ブログへの引っ越しされた皆さんの多くのブログが重たい傾向

弊記事はあえて「見出し」は付けませんので、一気に読んで戴きたく思います ^^ 最近、YahooブログからFC2ブログへの引っ越しされた皆さんからの、弊ブログへのアクセスがとても多いんですよね ^^ 筆者は、そんな皆さんのブログを直ぐにGoogleのツールである PageSpeed Insights(PSI) で「スマートフォン表示速度がどんな具合になっているのか」を覗かせて戴くんです。 そして気がついたことは「ブログの表示が重たい...

何をか言わんや。まさにその通り。FC2ブロガーさんは SEOユーザービリティ・ユーザーエクスペリエンス(UX) を気にかける人が結構多いんですね。そして最近のwebの潮流が ページ表示スピードの強化 であることもよくご存知の方が多いです。
* UX = ユーザーの使い勝手・快適性

ページの読み込み速度をモバイル検索のランキング要素に使用します

Google フレンドリーなサイト制作・運営に関するウェブマスター向け公式情報

簡単に言うと

ページの読み込みが極端に遅いサイトは検索順位を下げます。

という施策です。画像の容量が大きいと「極端に遅くなるのか」については YES

ページ速度に大きな影響を及ぼすのは主に以下の要因です。

  • 画像の容量
  • CSS
  • JS

Googleの公式ページを見ますと魅力的で検索クエリと関連性の高いコンテンツは、ページの読み込み速度が遅くても高い順位に掲載される場合もあります。とあるんですが、魅力的なコンテンツを書ける人は大抵の場合UXを重視している人です。

拡張子戦争

「戦争」は言い過ぎか。高解像画像を求める風潮が実際にあるわけで、最近ではスマホでもデジカメに引けをとらないぐらい美麗な写真が撮れるようになっています。そこで当然の流れとして 増えるばかりの容量をどうするか という問題が出てきます。

解決に向けての1つの取り組みが 新拡張子 の開発です。ところがこれも現時点で二派に分かれています。

  • Googleが牽引する「.WebP」(ウェッピー) --- オープンソース
  • AppleがiPhoneに導入した「.heic」(ヒーク) --- 非オープンソース

iPhoneではiOS11からheic拡張子が導入されています。iPhoneを買い替えたら同じストレージなのに何故か使用量が減った、という方もいらっしゃるかもしれません。 (heic ではなく heif と表現されることもありますが、画像の拡張子は .heic なのでここではheicに表現を統一します)

webPもheicも共通するのは jpgに比べて解像度が高く、容量が小さい 点です。まさにスマホ時代の次世代拡張子。ところがまたGoogleとAppleが二分(笑)

パソコン環境で今後汎く利用されそうなのはやはりwebPではないかと思います。ただこの「新拡張子」というのはOSやアプリケーションやサイト単位で対応が進まなければ使うことができません。FC2ブログも今の所いずれの両拡張子も利用できません。サポートされるまでかなり時間がかかるのではないかと思います。

F2ブログで公式にサポートされてはいませんが、果敢にも「自分でなんとかしちゃう人」も居ます。FC2ブロガーの mochiさん とか(笑)

アップルがiOS 11搭載iPhone/iPadなどで採用している新画像形式HEIFをFC2ブログで表示させてみました。

また新しいスキルを獲得したんですね。 HEIFってナニ? おいしい? アップルがiOSとmacOSで採用しはじめているHEIFというファイル形式については、WebPと並び将来Web世界を席巻するであろう次世代画像形式として最近その動向に関心を持っています。 ちなみにHEIFは”ヒーフ”、WebPは”ウェッピー”と発音するそうです。...

FC2ブログ・FC2ブロガーのすごいのはこういうところなんですね。開拓心旺盛・博学なユーザーがいるからこそ発展したサービスなんだなぁ、とつくづく感じます。

というわけで、「拡張子で解決」というのは今の所現実的ではありません。画像容量については各ユーザーが配慮すべきでしょう。10MBアップロードの許可などしてしまえば低リテラシーの方はそのまま掲載してしまいます。
* 低リテラシー = 応用力が無い, 知識が乏しい, 情報の取捨選択ができない, 情報を正しく理解できない など

念の為ですが「縦横サイズを小さくして容量を削る」というのはダメですよ。そのやり方では今度は別の問題が生じます。

スマートフォンで画像がぼやける際の対処と画像容量削減

スマホだと画像がぼや〜っと不鮮明になってしまう場合の原因と対策ですー (´・ω・`) そしてもうひとつ、画像がスキっと表示されずに上からベロベロ〜って感じでゆっくり表示されてしまう場合の原因についても(後者は「ついで」的にですが)...

2018年時点でサムネイル画像・OGP画像は横1200px以上が最適解

OGP画像 というのがありますよね。 各記事の「代表的画像」と表現しても良いかもしれません。 各種SNSシェアなどでもこのOGP画像がサムネイルとして表示されます。 FC2ブログ的に言い換えると トップページや関連記事リスト、新着記事リストなどで表示されるサムネイル画像 = OGP画像 その画像のサイズは一体どのぐらいが適切なのか。 2018年4月現時点で最低でも 横1200px が回答ということで良いと思います。...

Yahoo!ブログの「転載」

で、ここからやっつけの「転載」について。

転載の是非自体はここでは触れませんが、大まかにだけ書いておきます。

  • 転載とは、他者が著作を有する文章の全文を複製すること
  • 「ニュース」記事は原則、転載が許可されている
  • 転載は著作者との合意に基づかなければならない

Yahoo!ブログでは著作主が転載ボタンを表示させている時点で即ち「許可している」ことになりますので合法です。ただしここはFC2ブログですから「パクり」と誤解されても自己責任。

FC2の引っ越しツールを利用して記事を複製した方は、転載記事も漏れなくコピーされているはずです。ここから本題なんですが、転載される記事の多くは 何かの説明をしている 場合が多いんですよね。そして説明記事のこれまた多くの場合 画像拡張子が .png である という点に注意。

説明に役立つ スクリーンショット(以下 スクショ と称す) というのがあります。目視できている画面内容をそのまま画像として落とし込むことを指します。

説明記事というのは例えば「FC2ブログの個人設定の仕方」だとか「GIMPの操作の仕方」だとか、作業内容を画として表現するのがてっとり早く伝わりやすい。そういう事情でスクショには テキスト(文字) が含まれることが必然的に多くなります。

.jpgでスクショを保存するとテキストがぼやけてしまいます。それ故、世の中いろいろなキャプチャソフトやブラウザアドオンがありますが、殆どの場合デフォルトが「pngとして保存」になっています。そしてpngはjpgと比較すると容量が大きくなる傾向にあります。

厳しいことをまた言いますけれども、Yahoo!ブロガーさんで画像容量を適切に削減している人はあまり居ない んですね。スクショも縦横サイズだけ調整して容量には無頓着でそのまま載せている方が多いようです。そしてそれが説明記事ともなればいくつものスクショが掲載されていることでしょう。

100KB程度あるいはそれ以下で済むところが、スクショであるが故500KBとか。それがベタベタと貼ってあるわけですよね。そして何故かYahoo!ブロガーさんは「全文表示タイプ」のテンプレートがお好きなようで、トップページに大量の画像がズラズラり。そら重たいに決まっとる。

jpg変換をすれば容量はかなり抑えられます。あるいはpngを保持するならば適切な方法で削減を行えば平均で20〜80%もの軽量化が可能です。でも本人にその意識・知識が無ければ何も考えずにそのままベタベタ貼ってしまいますよね。

もちろん「転載記事が原因」ではないですよ。転載記事にはその傾向がある、というだけですし、日記を書いているブロガーがスクショを掲載する場面というのは少ないと思いますのでサンプルケースとして転載記事のことを書いているだけです。情報は正しく読み取ってください(笑)

pngはjpgより容量が大きいよ、スクショは大抵の場合pngですよ、という事実を知ってもらうために「転載記事」を例にしています。ですから「私は転載記事が無いから大丈夫」などと思わないでくださいね。自分で掲載した画像については自己責任で削減をする、それが当たり前です。

画像を圧縮して軽くするおすすめサイト「Tiny PNG」

最近の写真ってとっても高解像度ですよね。 iPhoneなどのスマホで写真撮る ↓ ガンガン撮る ↓ ブログにUP~♪ ↓ クッソ重たい!なんやしこれ! ← イマココ スマホの写真というのはサイズ(縦横の大きさのこと)自体が大きいんです (´・ω・`) ガラケー全盛期の写真と比べるとパソコンに送ってビックリするぐらい。 そしてどこも(DoCoMoじゃないよ) こぞって『高解像度』祭り そら重たいわーそらそうやわー。 ...

まとめ

いつにも増してごった煮な内容になりました。結局言いたいのはこういうこと。

画像の容量は削減しなはれや。

 2

There are no comments yet.
mochi
果敢というか無謀・・・?(汗)

こんにちは。Akiraさん。
記事紹介あざーっす!

ページ全体の画像容量としてはブログカード使用も気をつけた方がいいかもです。
最近気づいたんですが、とある記事でアニメ公式サイトへの引用ブログカードをベタベタ貼り付けていたら、それだけで結構なデータ量(6MB程)になってしまっていたんですよね。原因はリンク先の大きな容量のOGP画像。
アニメという属性もあってか?ほとんどが画質重視のpng画像でして、中には1MB以上あるテロみたいな容量のOGP画像も…(泣)
Lazyloadingでファーストビュー速度に影響しないこともあって今まで全然気にしていなかったんですけど、データ通信料のことを考え現在ブログカード多用している過去記事の見直しをしています。(笑)

2019/05/07 (Tue) 23:54
vanillaice (Akira)
Akira
To mochiさん

mochiさん、こんばんは ('0')/

それなんですよ。それ。
「自分のは対策できても他者のものはどうにもならない」

実は転載記事の件を書くにあたり、そこを指摘しようと思ったんです。だけどよく考えたらデータの引っ越しした時点で相手サーバーの直リンクじゃなくなってるじゃん、と気づきまして(笑)
なので「転載記事内の画像も自分のアルバムに有るからなんとでもできるでしょ」と書きたい気持ちはあれど、それってどうなのですか?と思いとどまった次第(笑)

ってゆーかさ。転載記事は削除した方が良いですよね (´・ω・`)
だって移転した時点で「合意による転載」かどうか不明になるわけだし。

-----
アニメの画像って解像度高いんですね。こだわりを感じます(笑)
表示される範囲が狭いのに1MB超えは無いなー ( ̄∀ ̄;)

2019/05/08 (Wed) 00:32

テンプレートに関するご質問・不具合のご報告の際はご自身のブログアドレス記載必須です。
ご質問の前に 必ずお読みください
テンプレートに関するご質問時のお願い

必ず該当テンプレートの専用記事にお願いします。無関係な記事・別のテンプレート専用記事でのコメントはお控えください。
テンプレートカテゴリ
テンプレート一覧

webのあれこれ