FC2ブログテンプレートを最新バージョンに更新

使用させていただいているテンプレートが更新されましたので、対応しました。

と言ってもテンプレート自体は同じもので、カスタマイズも以前と同じ様にしたので、見た目的にはほとんど変わっていないかと思います。

更新履歴


[2018年]
01月28日:スマホ用メニュー内にカテゴリ追加
01月28日:まとめ
01月22日:初回投稿


テンプレート更新


今利用しているテンプレート適用時の記事はこちら。


製作者様のブログを見ると今回の更新箇所は以下。

・画像遅延読み込みを導入しました(デフォルトではグリッドページのみ適用)
・リセットCSSを最小限にし、一部CSS内容を圧縮しました
・フォントのサイズ指定にremを導入しました
・構造化マークアップのシンタックスをJSON-LDに変更しました


Hymn - FC2ブログテンプレート - テンプレート


個人的な注目点はCSSを最小限・圧縮という事で、読み込みスピードが早くなっているであろうってことで、昨日から変更しました。

GoogleのPageSpeed Insightsで数字がどう変化したのかをチェックしてみます。

旧バージョン カスタマイズ

・モバイル

screenshot_17.png

・パソコン

screenshot_18_201801222302303ac.png

新バージョン デフォルト

・モバイル

screenshot_19.png

・パソコン

screenshot_20_201801222303417cf.png

新バージョン カスタマイズ

・モバイル

screenshot_21.png

・パソコン

screenshot_03_20180122230541a33.png

という事で、PageSpeed Insightsの数値は良くなっているので以前より少し快適に見れるようになったかなと。

Lazyloadが導入されたテンプレート(*トップページのみ対応)で、画像を表示しないのは少し悩んだ部分。書いている人や内容に魅力があれば多少遅くても見てもらえるのだろうが、そうではないことは長年やって分かっているので、そこは表示スピードを優先させました。

今回テンプレートを変更の理由がもう一つ、旧バージョンをカスタマイズしていて、[Search Console]→[検索トラフィック]→[モバイル ユーザビリティ]で問題のあるページが急増。

screenshot_04_20180122232542a29.png

前々から出ていた部分ではあるのですが、その大半が携帯テンプレートでした。しかしパソコン版のURLでこの数値が急増していたのでどうしたもんかと思っていた所に今回の更新。

数字が跳ね上がった時期を見るに、私が弄ったタイミングで発生しているので、今回の変更で暫く様子見。

Search Consoleって問題記事と内容は教えてくれるが、肝心の箇所が分からないからちょっと困りもの。そして変更の結果が出るまでに時間も要する。

しかしこの作られたテンプレートや、制作者様のブログは勉強になりますね。業界ではrem表示が当たり前になっているのだろうか。素人且つ、px表示でずっとやってきた身としては、この今まで見てきたのと違うってのは中々戸惑う部分。カラーコードの#○○○○○○→rgb(○○◯,○○◯,○○◯)にしても同じく。

この制作者様のテンプレートを利用している方はFC2ブログに多いと思います。各テンプレートが随時更新されていってますのでチェックを。

制作者様には感謝しかない。

スマホ用メニュー内にカテゴリ追加


*更新:2018.01.28

SSL化のタイミングで別テンプレートも含め、現在の制作者様のテンプレートを使用している中で一番変更したかった
、スマホ表示の場合のメニュー内にカテゴリを表示させることがやっとできました。

このテンプレートはレスポンシブデザイン。これがパソコンならカテゴリや新着記事等は右側に表示され目に付きやすいのですが、スマホになるとそのコンテンツ(プラグイン)がページ最後尾に表示される。

これを目に付きやすくするために、スマホでみた時に出てくる最上部の三本マークを開いた中にカテゴリを表示。カテゴリをタップすると詳細が表示されるようになってます。

dhvhts.png

これが中々できずどうしたものかと色々調べていたら、同制作者様の以下のテンプレートで、この表示がデフォルトで搭載されていることを発見。


上記のテンプレートのHTMLとCSSから該当部分をコピペ。一部幅が違っていたのでpadding部分だけ変更。

これで前よりはスマホで見た場合にカテゴリにアクセスはしやすくなりました。あとはアクセスアップになればといいのですが。

同じ箇所でメールフォームを入れたい方は、製作者様のブログで記事が書かれています。これについては入れてもいいかと思いつつ、コメント自体少ないブログなので、取りあえず保留。


まとめ


*更新:2018.01.28

カテゴリ表示追加と、細かな位置調整もほぼ好み通りにできたので、これで書くことに専念できます。

前回投稿で取り上げた、問題のあるページも新テンプレート採用後減りました。素人があまり弄くらないほうがいい典型な例ですね・・・。

screenshot_08.png

そしてアクセス数もSSL化以前に回復(*UU)。それについては以下の記事で書きます。

スポンサードリンク


Category:ブログ
Tags:FC2ブログカスタマイズFC2ブログ

amazon タブレット

Audible