常時SSL化したところ表示スピードがガクッと落ちた。
これは常時SSLによるものというより、
TOPページのサムネールに関して自ら決めたルールを守らず、
CSSによるリサイズで放置していたから、という方が大きかったかも。
さすがに、GTMetrixでD評価50％台というのが情けなく、できる対処をすることにした。
まずテーマを最新のバージョン3.8.5に更新。
試行錯誤の末、TOPに設置していたselection3をはずすことにした。以前はひっかからなかったのに、この部分の画像リサイズにGTMetrixでダメ出しが出るようになったことと、カテゴリｰ別リストと記事がかぶるのがうるさく感じるため。セレクトする記事が依然と変わってきたということもある。
自動的にTOPページから消えてしまうけれど、それでも出しておきたい、というものもあるかもしれないが、それは次の課題としよう。
で、画像アップやサムネール関連のルールを見直し再確認することにした。
マイサムネールルール
①新規記事/TOP表示中
1. 基本画像サイズ：640×480 でFlickrにアップ（もしくは678×509）
2. アイキャッチはFlickrから上記サイズのコードを取得して記事トップに挿入
その際不要なスクリプトタグなどは削除、サイズは500×375にHTMLで指定
3. サムネール用に基本サイズの画像をWPメディアにアップし、
［アイキャッチ画像を設定］で選択
★FOCUSの画像 基本サイズ：678×509 Flckrとメディアにアップ
②TOP表示から消えたら
1. WPメディアの［アイキャッチ画像］を記事から削除
2. Featured Image From URL にFlickrの320×240画像URLを記載（以前は150×150にしていたが、GTMetrixからダメ出しが出るので変更してみることにする）
3. 不要になったWPメディアの画像をライブラリから削除
●テーマでは以下のサムネール画像が生成される
add_image_size(‘mh-magazine-slider’, 1030, 438, true);
add_image_size(‘mh-magazine-content’, 678, 381, true);
add_image_size(‘mh-magazine-large’, 678, 509, true);
add_image_size(‘mh-magazine-medium’, 326, 245, true);
add_image_size(‘mh-magazine-small’, 80, 60, true);
メディアライブラリにアップするのを678×509以下にすれば、生成される画像は、それ以下のサイズ三枚と、プラグイン WP Related Posts で取得される150×150の計4枚となるはず。だけれど、FTPで確認すると、640×480のオリジナル以外に、640×438、640×381、326×245、150×150、80×60と、6枚が生成されていた。
横640に対して、縦480以下の438と381が二枚生成されてしまう。mh-magazine-sliderは使用していないので、子テーマのfunctions.phpでサイズ0の指定にしてみた（trueはいらないのかな）。
/***** Image Sizes *****/
function mh_magazine_image_sizes() {
add_image_size('mh-magazine-slider', 0, 0, true);
add_image_size('mh-magazine-content', 678, 381, true);
add_image_size('mh-magazine-large', 678, 509, true);
add_image_size('mh-magazine-medium', 326, 245, true);
add_image_size('mh-magazine-small', 80, 60, true);
}
以上で少しはシンプルになっただろうか。
基本を640×480にしたのは、Flickrで自動生成されるMediumを利用するためだけれど、だいたいPhotoshopで調整するので、その際全て678×509に統一してしまっても良いのかもしれない。
ところでオリジナルが678×509の場合も、mh-magazine-largeとして同サイズのサムネイルが出来てしまうのだろうか？
⇒出来ないことが判明。これで総数5枚になる。
テーマのサムネイルの扱い方がイマイチつかめていないけれど、なんとかTOPカテゴリー別リストの画像のばらつきは解消された。原因はメディアにアップする画像サイズがバラバラだったことと、以前のカスタマイズにより生成されたサムネイルがサイズ統一されていなかったこと。
GTMetrix速度チェックとリンク切れ
GTMetrixで速度チェックしながら作業していたら、Avoid bad requests スコアがバッド。リンク切れリンクを避けよ、ということらしい。今まで出たことがないのに。
検索したらリンク切れをチェックしてくれるプラグインがあるというので、Broken Link Checker というのを入れてみた。同じ名前で二つある。迷ったが、更新はないが多数に利用されている古いほうを入れてみた。
案の定19個リンク切れがあったので、リンクを解除。これで一旦PageSpeed スコアがAになったのだが、直近のチェックではまたAvoid bad requestsがF赤 となる。どうもよくわからない。画像ファイル名の末尾に、pagespeed.ic.563XdIGA4I.webp （下線部分が異なる英数文字）とついている。いったいこれはなんだろう？
wpXサーバーで mod_pagespeed をONにしているのと関係あるのだろうか。調べたらGoogleの画像拡張子とあるけれど、勝手に生成されるのだろうか。でも勝手に生成されるのなら、何故リンク切れとなるのだろう？ そもそもその元画像が無い、ということだろうか？
見ると、サーバー直下に置いているimagesから取得している画像が表示されていない。確かにその場所にあるのに。って、今まで問題なく表示されてたのに。
とりあえずwpXでmod_pagespeed をOFFにする。画像は表示されるようになった。ここの画像もメディアにあげたほうが良いのだろうか。（ため息）。
この状態でGTMetrixのスコアはA(93％）となったので様子見とする。
ところで、リンク切れチェック、あらたに199個が「発見」された。19個？少ないじゃん、と思ったのだが、そんなはずはなかった。ポチポチとリンク解除する。
しかし、ひとつ片付くと次の問題が浮上するってなにさ（ため息）。
コメント