この記事のポイント

  • 会社サイトは、事業や実績の変化に合わせて育てていくもの
  • 見た目だけでなく、更新しやすさと情報の探しやすさも大切
  • 小さく作ってPreviewで確認しながら改善すると、安心して公開できる

はじめに

会社のWebサイトは、一度作って終わりではありません。

事業内容が増えたり、実績を紹介したくなったり、新しいサービスを始めたり。時間が経つにつれて、載せたい情報は少しずつ変わっていきます。

その一方で、サイトの構造が古いままだと、情報を追加するたびに手間がかかります。ページごとにヘッダーやリンクを修正したり、スマートフォンでの見え方を個別に確認したりする必要も出てきます。

今回は、Kou System Supportのサイトをリニューアルする中で考えたことや、実際に行った改善について紹介します。

なぜサイトをリニューアルしたのか

今回の目的は、単にデザインを新しくすることではありませんでした。

「何をしている会社なのか」がすぐに伝わること。

「どんな仕事をしてきたのか」を実績として確認できること。

そして、これから増えていく情報を無理なく追加できること。

この3つを意識して、サイト全体の構成を見直しました。

サイトは会社の看板のようなものです。看板が分かりやすければ、初めて訪れた人にも事業内容が伝わります。反対に、情報が見つけにくいと、せっかく興味を持ってくれた人が離れてしまうかもしれません。

見た目より先に、情報の整理から

リニューアルというと、色や写真、レイアウトの変更を思い浮かべがちです。

もちろん見た目も大切ですが、その前に「どの情報を、どこに置くか」を整理する必要があります。

今回のサイトでは、トップページから次の情報へ移動しやすいようにしました。

  • 事業内容
  • 実績
  • コラム
  • ニュース
  • 事業者概要
  • お問い合わせ

ページを増やすこと自体が目的ではありません。訪問者が迷わずに知りたい情報へ進めることが重要です。

Astroへ移行した理由

今回のリニューアルでは、サイトをAstro構成へ移行しました。

Astroを選んだ理由は、静的サイトとして高速に表示しやすく、ページの共通部分をまとめて管理できるからです。

「静的」というのは、簡単に言うと、訪問者がページを開くたびにサーバーでページを組み立てるのではなく、あらかじめ作っておいたHTMLをそのまま配信する方式です。構成がシンプルなので、表示が速く、安定しやすいというメリットがあります。

例えば、ヘッダーやフッターを各ページに個別に書くのではなく、共通コンポーネントとして管理できます。サイト名やナビゲーションを変更するときも、1か所の修正で全ページへ反映できます。

記事ページも、同じレイアウトを使い回せます。文字サイズの調整、パンくずリスト、目次、FAQ、問い合わせ導線など、記事に必要な要素をテンプレート化しておくと、次の記事を作るときの負担を減らせます。

EmDashをCMSとして使うことにした

コラムの管理には、EmDashというCMSを使うことにしました。CMSは、管理画面から記事を作成・編集・公開できる仕組みです。記事の本文だけでなく、タイトルや概要、公開状態もまとめて管理できます。

EmDashはモダンな構成のCMSで、Cloudflareとの相性がよい点も魅力です。記事データをCMSで管理しながら、サイト本体は高速に配信できます。

Cloudflareのネットワークを活用して配信できるため、ページ表示が速く、運用もシンプルにしやすい構成です。いわゆる爆速を目指せるところも、今回のサイトに採用した理由の一つです。

最近手掛けさせていただいているフルスクラッチのECサイトとも相性がよく、サイトの表示や機能と、記事・コンテンツの管理を分けて運用できます。今後、業務や開発に関するコラムを増やしていくうえで、無理なく続けられる仕組みだと考えました。

また、最近流行りのＡＩやＡＩエージェントで管理しやすいというのも、EmDashを使い始めた理由の一つです。

共通ヘッダーとパンくずリストを整える

ページが増えるほど、共通ナビゲーションの重要性は高まります。

今回のサイトでは、ヘッダーに主要ページへのリンクをまとめました。さらに、ヘッダーの下にはパンくずリストを表示しています。

パンくずというのは、サイト上部に見える「トップ > コラム > 記事タイトル」のような表示です。今どのページを見ているのか、どこから来たのかが分かりやすくなり、記事を読み終わったあとに一覧へ戻るときにも便利です。

また、ヘッダーは折りたためるようにしました。開閉状態はブラウザに保存されるため、次にページを開いたときも前回の状態を維持できます。

コラムとニュースを分けた理由

サイトに情報を追加していくなら、コラムとニュースは分けておく方が分かりやすくなります。

ニュースは、サイトの更新やお知らせなど、短く伝えたい情報向けです。

一方、コラムは、業務改善やEC、システム開発など、ある程度まとまった内容を紹介する場所です。

「お知らせ」と「知識・考え方」を分けることで、訪問者が目的の情報を探しやすくなります。

リニューアルして変わったこと

今回のリニューアルで、サイトの情報を整理しやすくなりました。

ページ共通部分をまとめたことで、今後の修正もしやすくなっています。コラム用の構成も用意したので、業務や開発で得た知識を少しずつ記事として追加できます。

サイトは完成品ではなく、事業と一緒に育てていくものです。最初からすべてを完璧にしようとせず、必要な情報から追加し、実際の反応を見ながら改善していくことが大切だと感じました。

これから改善したいこと

今後は、記事の数を増やすだけでなく、検索性や読みやすさもさらに改善していきたいと考えています。

例えば、カテゴリーやタグの整理、記事検索、関連する記事へのリンクなどです。訪問者が必要な情報を見つけやすく、次の記事も読んでみたくなるようなサイトを目指します。

すべてを一度に完成させない

サイトをリニューアルするときは、最初からすべての機能を完成させようとしないことも大切です。

まずは事業内容、実績、お問い合わせなど、訪問者が必要とする基本情報を整えます。その後、コラム、ニュース、検索、タグ、CMSといった機能を少しずつ追加していきます。

実際に使ってみると、想定していなかった改善点が見つかります。スマートフォンでの余白、記事タイトルの折り返し、パンくずの位置、下書き記事の見せ方などは、画面を確認しながら調整した方が適切な答えに近づけます。

小さく作り、Previewで確認し、問題がなければ公開する。このサイクルを繰り返すことで、サイトを無理なく育てていけます。

リニューアル後の運用ルールを決める

サイトは公開したあとも、情報の追加や修正が続きます。そこで、作ることだけでなく、更新するときのルールも最初に決めておくことにしました。

基本は、Preview環境で開発し、表示やリンクを確認してから公開します。いきなり本番サイトを変更しないことで、誤字やレイアウト崩れを見つける時間を確保できます。

記事についても、まず下書きとして内容を整えます。タイトル、概要、カテゴリー、タグを設定し、本文を確認します。公開する準備ができたら、記事の状態を公開へ切り替えます。

この流れにしておくと、「書きかけの記事が公開されてしまう」「修正途中のページを見られてしまう」といった問題を防ぎやすくなります。

また、サイトのコード変更と記事の更新を分けて考えられる点も便利です。サイトの機能を修正するときはPreviewで動作確認を行い、記事の追加や文章の修正はCMSで行います。それぞれの変更内容に合わせて、確認すべきポイントを整理できます。

公開後に見るべきもの

サイトを公開したら、作業を終わりにするのではなく、実際の画面を確認します。

トップページから事業内容、実績、コラム、お問い合わせへ移動できるか。スマートフォンで文字が読みやすいか。記事のタイトルやパンくずが正しく表示されているか。こうした基本的な確認を続けます。

アクセス状況を見ながら、よく読まれている記事や、あまり見られていないページを把握することもできます。読まれている内容を深掘りしたり、関連する記事へのリンクを追加したりすることで、サイト全体を少しずつ改善できます。

最初から完璧な答えを作るのではなく、公開後の反応を見ながら直していく。これも、サイトを長く運用するうえで大切な考え方です。

まとめ

会社サイトのリニューアルで大切なのは、見た目を変えることだけではありません。

情報の整理、更新のしやすさ、スマートフォンでの読みやすさ、そして公開前に確認できる仕組み。これらを一つずつ整えることで、サイトは長く使いやすいものになります。

これからサイトを作る方や、今あるホームページをEC化・リニューアルしたい方は、まず「誰に、何を伝えたいサイトなのか」を整理するところから始めてみてはいかがでしょうか。

ECサイトを作るなら Kou System Support

今ある御社のホームページ。EC化するならお任せください。ご相談の中で最適なご提案をいたします。

まずはお問い合わせください