ブログリニューアルの実装についての雑感
この記事は Gaji-Labo Advent Calendar 2019 6日目の記事です。
Gaji-Labo 森田です。久しぶりにブログを書きます。
さて、11月末にこのブログをリニューアルしました。リニューアルがアドベントカレンダーに間に合ってよかったです！
リニューアルした経緯や想いなどは、ブログをリニューアルして、気持ち新たに新しい目標に向かいます に山岸が書いてくれました。
なので、今回はリニューアルの実装について行ったこと・思ったことを書きます。
ブログシステムは引き続きWordPress
ブログシステムは引き続き WordPress を使っています。
弊社コーポレートサイトは GatsbyJS + Netlify で作られているので、ブログもHeadless CMSなどを採用し Jamstack 構成でいくという案もあったのですが、原稿の書きやすさや、誰でも書ける環境を考慮した結果、やはりWordPressを利用させてもらうことになりました。引き続きお世話になりますっ。
ブロックエディタは慣れるととても書きやすいですし、この選択は正解だったと思っています。
業務では React や Vue.js のフロントエンド支援を主にしているので、久しぶりにWordPressを触りましたがやっぱり楽しいですね。WordPress 大好きです。
テーマ
リニューアル前は自社製の Rails ブログをデザインそのまま WordPress 化したものだったので、正直あまりマークアップやテーマ構成が良くなかったのですが、今回はシンプルな構成でテーマを構築できてとてもわかりやすくなりました。
プラグイン
今回プラグインを大幅に減らし必要最小限にしました。
後述のページスピードのためもありますが、プラグインはどうしてもバグ対応やアップデートがプラグイン開発者様に依存することになるので、なるべくテーマにプラグイン同等の機能を内蔵することで依存度を減らしました。
とはいえ JetPack など便利なプラグインは使わせてもらっています。
(
サーバーの変更
サーバーは 某VPS から エックスサーバー に変更しました。
VPS から共用サーバーに変えるということで使い勝手が下がるのではと思われるかもしれませんが、弊社ではむしろ逆で管理しやすくなりました。
VPS を使うとどうしてもサーバーの知識が必要になります。
サーバーエンジニアがいない弊社ではVPSを触れる人間が限られてしまうので属人性が上がってしまいます。
例えば、サブドメインの設定や公開鍵の登録、SSL証明書の有効期限切れなどが起こると特定の人間しか対応できなかったのですが、そのあたり管理画面で諸々設定できるので誰でも管理ができるようになりました。
また、エックスサーバーは共有サーバーとしてはかなり WordPress が速いサーバーなので手間をかけずにある程度の高速化が実現できました。
ページスピードの追求
先ほども書きましが、コーポレートサイトは GatsbyJS で作られているのでSPA(Single Page Application) でとても高速にページが表示されます。
これはユーザーエクスペリエンスとしてはとても重要と考えます。
弊ブログは WordPress なので、基本的にお世辞にも表示が速いとは言えません。
なので、なるべくその速度差を無くせるようにしました。
と言っても、行ったことはマークアップやCSS設計を適切にし、テーマはなるべく簡易な構造やコードにし、WordPress特有の不要なコードの読み込みを極力減らしオーバーヘッドを無くし、画像を最適化する。というシンプルなことを愚直にしただけです。
PageSpeed Insights
シンプルなデザインやエックスサーバーの恩恵もあり PageSpeed Insights のスコアはモバイル98点、パソコン100点にすることができました。（時間帯により多少増減するみたいです）
現状、キャッシュプラグインやコード・画像の圧縮系のプラグインは使っていないので、そのあたりも使用しモバイルも100点を目指します。
勿論、PageSpeed Insightsのスコアが全てではないので、さらに諸々パフォーマンスを向上できればと考えています。
個人的にはブログもGatsbyJSでSPA化したり、Shifterで静的化もしてみたいですね。
まとめ
リニューアルはこれで終わりではなくここからです。
雑感を書いていたら、あれやこれやとやれていないところが気になってきてしまったので、随時改修・アップデートをかけていきより良いブログにしていきます。
弊社、WordPressの実装も得意としておりますのでご相談くださいませ。
Gaji-Laboでは、JavaScriptフレームワーク経験が豊富なパートナーさんを募集しています
Gaji-Laboでは、開発チームの一員としてプロジェクトに一緒に取り組んでくれる業務委託のパートナーさんを募集しています。
現在は特にJavaScriptフレームワーク実践と業務経験が豊富なWebフロントエンドエンジニアを必要としています。React + TypeScript、Vue.js、Next.js、Nuxt.js など、あなたの得意なフレームワークを教えて下さい！
パートナー契約へのお問い合わせもお仕事へのお問い合わせも、どちらもいつでも大歓迎です。まずはオンラインでのリモート面談からはじめましょう。ぜひお気軽にお問い合わせください！
お問い合わせしてみる！
