Doll

No.60
爆速サイトへの道②

【やったこと】
・ギャラリーに使用していたプラグインを変更
・ギャラリーページを静的HTMLで表示

【プラグイン変更】
VisualPortfolioからFooGallery(+foobox)に変更。

ギャラリー全体としての初回読み込みの重さはそこまでかわらないものの、
VisualPortfolioでは指定の画像枚数(8枚とか)を読み込み終わるまで待ちが生じるのに対し、
FooGalleryでは1枚ずつ読み込めた順に表示してくれるので、体感の待ち時間は激減した。
これで作品を見てもらえる確率が格段に上がったと思う。

デザイン変更の柔軟性、作品の並べ替え操作などもFooGalleryの方がやりやすいと思いました。
シンプルで大げさすぎない感じや、作品タイトルやキャプションを見るか消すか閲覧者側が自由に選べるのもよい。

VisualPortfolioにあったカテゴリフィルター機能とソート機能がオミットされたけど、フィルターに関しては基本一次創作サイトなのでなくてもあまり問題ないと思いました。古い順にみる人とかもまずいないでしょ。
(もし古い順に見たい方がいましたら、最新絵を拡大表示したあとに左矢印(←)クリックか、画像の上で左から右側にスワイプし続ければ古い順に見れます。)

あとVisualPortfolioの強みは投稿記事から画像だけ取り出してギャラリーを作れること(それもタグなどでめっちゃ細かく条件付けできる)だったけど、私には持て余す機能だったのでやはりFooGalleryのがシンプルで良い。

逆に少しくらい重くなっても構わなくて、作品のジャンルとかで細かくギャラリー分けしたい人とか、普段はブログに画像を載せててそれを半自動でギャラリー形式にまとめ直したいという人にはVisualPortfolioすごくお勧めです。


【静的HTML】
Simply Staticというプラグインで、WPで動的に生成したページをHTMLで吐き出せる。
(参考:WordPressで静的HTMLを生成する方法【便利な使い方から注意点も解説】 | DISPLAY-ディスプレイ

これを使うとWordpressをHPビルダーみたいな感覚で使えるのかも(ビルダー使ったことないから適当;)

前回試みた軽量化施策のおかげで、いまや重いのはギャラリーページのみなので、そちらのみ静的HTMLに置き換えた。
WPの固定ページを1枚作り、そこにSimply Staticで生成してDLしたHTMLファイルを呼び出して表示させている。
(参考:Wordpressでトップページを静的サイトに index.htmlを共存させる簡単なやりかた - ビジネスのIT化なら合同会社ジリキ

私の場合は参考どおりトップページをHTMLにするパターンだったのでそのままコピペでいけたけど、ファイル名とパスを変更すれば他のページでもいけそう。


静的ページ化したことで体感は早くなったと感じたものの、Google先生評価は変わらず。
体感が変わったならヨシとする。大事なのは評価よりも自分がどう思うかです。

冗談はさておいても、キャッシュ保持の関係なのか、静的HTML化すると2回目以降の閲覧では表示が非常に早くなるのでやった価値は十分ありました。


なおギャラリー以外のページはわりと頻繁に書き換えているし、既にGoogle先生評価もモバイルで98点とか叩き出せるようになったので動的生成のままとしました。

古いCSSが読み込まれてたりして表示がおかしくなってる人はお手数ですがキャッシュクリアしてみてくださいね。

20220929143414-admin.webp
△あれ、スコアちょっと落ちてる…


#カスタマイズ #Wordpress #高速化