自社HPのリニューアル

自社HPのリニューアル_OGP

概要

当初は、Webデザイナー候補者の制作を監修する立場でしたが、経営判断により優先度が上がり、自社をアピールする場として、なるべく早く終わらせたいということで、私が引き継ぐことになりました。

制作が終わっていた画面は、トップ・サービスのソフトウェア・採用情報の3画面で、それらのデザインを踏襲しつつ、全画面を制作しました。
トップ・サービスのソフトウェアに関しては、崩れが多く残っていたため改修、採用情報は次年度に改めて作り直すため未改修となります。

URL

https://www.advn.co.jp/

コピーしました
画面数
22画面(日本語・英語の2か国語対応で11画面x2)
開発環境
フロントエンド
言語: HTML5, CSS3, JavaScript
ビルドツール
Astro
インフラ
オンプレミスLinuxサーバー(nginx)
パッケージマネージャ
npm
バージョン管理
GitHub
デプロイ方法
SSH接続による手動デプロイ
エディタ
Visual Studio Code
参画期間
2025年1月~2025年2月(約2カ月)

AIを利用した文章構成

自社のサービスとして、ソフトウェア開発・インフラ構築・クラウド導入支援・WEBデザイン・オフショア開発(リニューアル後に新たに提供開始)の5つを提供しています。
これらの画面は元々は存在せず、新たに用意しました。

文章については上長からの指示は特になく、またサービスの特徴も明確ではありませんでした。前任者や私も業界知識が深くなかったため、同業他社の情報を参考にしつつ、AIを活用して文章を構成していきました。

AIを活用することで知識が浅い分野でも情報を広く収集し、売り文句やサービスの特徴を整理することができ、大幅な作業時間の短縮につながりました。

検索順位の改善

リニューアル前は「千代田区・システム開発」というワードで、2桁台の順位でした。
段階的リリースにより、リニューアル完了時点で8位まで改善、2025年9月時点では3位を維持しています。
1位・2位はシステム開発会社の比較サイトのため、競合サイトを考慮すると、良い順位まで上がってこれたと評価しています。

コンポーネント導入による保守性の向上

引継ぎ時はViteを利用した静的サイトを構築していましたが、Vite単体ではコンポーネントを利用できないため、共通レイアウトやパーツの再利用が難しい状況でした。
そこで、コンポーネントベースで開発でき、且つ静的サイト生成に強いAstroへ移行しました。
これにより、パーツの再利用が可能となり保守性が向上しました。

所感

HPのリニューアルで初めてAIを活用しました。
私は文章を考えるのが苦手だったため、デザインと同じくらい時間が掛かるものと想定していました。
ところが、AIに対して、草案と調整の方向性を指定するだけで、瞬時に提案が得られ、思った以上に効率化することができました。
また、デザイン面では相談相手が居なかったため、レイアウトや構成のブラッシュアップにAIを活用、より適切な形に仕上げることができました。
今回の経験を経て、AIは単なる作業補助ではなく、情報設計やUI方針の決定にも活かせることを実感しました。