blog
ブログ

リニューアルでやったこと

インヴォルブはウェブサイトをリニューアルいたしました。リニューアルをする上でしたことを書いてみようと思います。

やりたかったこと

2016年に初めての公式サイトを立ち上げてから5年が経ちました。ウェブサイトデザインのトレンドもどんどんと変わっていきながらもウェブサイトを刷新する前にご依頼いただきましたお仕事を頑張っておりました。しかしウェブサイト制作をおこなう者としてこのままでいいのか?と焦りながらも経過した時間は少し長すぎたのかもしれません。Webページを表示させるための技術もどんどん進化し、検索エンジンに対してのアプローチも現在と違い、使える技術もかなり進化したこの世の中で今できることをしようと思い作り変えようとおもいました。

デザイン

旧デザインでは当時のトレンドも踏まえてカラフルなデザインだったものを、シンプルかつ認識性の高いデザインに作り替えました。もともと対応していたマルチデバイス表示の際にも、今回のシンプルを心がけたデザインへの変更によってより美しく表示されるようになったと思います。

更新の障壁を下げる

記事を更新し続けるのはかなり根気とアイデアの必要なことだと思います。1記事を更新するのに必要だった工程を見直してみると更新が疎かになった理由が見えてきました。
一番時間がかかっていたのは何を書くのかという案を練ることです。当時の検索エンジンへのアプローチとして更新コンテンツをカテゴライズし、同じカテゴリにあたる話題が積み上がっていくようにする方向に舵を切った点にあったと思います。
「ウェブマーケティングブログ」と「ウェブクリエイトブログ」という括りはどうしても関連することを軸に発案して書き進めていかなければいけませんでした。日々発信していくためにもその括りを取っ払ってブログへと統合しあえて更新コンテンツをカテゴライズしないようにしました。

メインビジュアルを動画へ

トップページにある動画はPCだと17MBあります。これは通信環境によっては非常に読み込みに時間がかかる容量だと思います。もちろん画像をスライドさせて表示させるような見せ方のほうがデータの読み込みとしても軽く実装できます。
しかしインヴォルブでできることを表現したいというリニューアルスタート時の思いがあり、読み込みに時間がかかるとしても許容できる範囲内でメインビジュアルに動画を埋め込みました。

テキスト量を大幅に減らしました

旧サイトではサイト内の文章量やページ数を多く用意しており、ボリュームのあるサイトにしておりましたが、読み進めていくお客様にとってわかりにくいことを考慮してページの割り振りとしてもシンプルなサイトにしました。

測定ツールでサイトスコアを高める

動作が発生する部分をなるべく限ることで読み込むJavaScriptを減らしました。オープンソースのコンテンツ管理システムを使用しているのでセキュリティ部分を見直しました。HTTPセキュリティヘッダを追加してセキュリティ部分を見直しました。スマートフォンのユーザーが操作しやすいようにクリックの領域が小さい部分を大きくしました。

これからやるかどうかなもの

リニューアルスタート時にある程度考えていた内容を実装することができたのでアップしました。しかしこれは第1段階としてこれから次にやりたいと思っていることを考えていたので書き出してみます。

JQueryを使わない

リニューアルを優先するためにJQueryを使用しているため、読み込むときにかかっている不要なデータが存在する。それらを削減するためにJavaScriptで開発したいと思っております。

CMS静的ジェネレーターの活用

サイトをJamstackで開発しなおし高速表示を実現する。GatsbyJSとWordPress、もしくはGatsbyJSとContentfulを検討しております。しかしながらパフォーマンスでどのくらい違うのかはほとんど現在と差がない可能性もある気がしています。

サービスページの追記

サービスページを極力シンプルにした結果、ほんの数行しか紹介を書いていないためわかりにくいので、ここは個別にページが必要だと思いました。

まとめ

今後はそれらの制作過程などをゆるりと更新していこうと思います。