PFP様（オウンドメディアサイト）｜Web制作実績 レスポンシブ対応｜制作実績

今回新規作成の主要な目的として、「潜在顧客との接点を拡大したい」というご要望をいただきました。そのため、情報収集段階のユーザーが自分の悩みに合ったコラムへスムーズにたどり着けるよう、「シャッター職人コラム」をキーワード検索できる機能をトップページに実装しました。

例えば、「ガレージシャッターが使いづらい」と感じているユーザーが「ガレージシャッター」と検索すると、「ガレージシャッターを電動化したい！電動化する方法や費用をご紹介」「シャッターが途中で止まる原因とは？症状別の対処法も徹底解説！」といった関連記事が一覧で表示されます。悩みに応じた具体的な解決策や必要な情報を最短導線で確認できる設計とすることで、お問い合わせにつながるきっかけを創出しています。

また、関連記事一覧ページでは、右サイドバーに「人気記事」トップ4をサムネイル付きで掲載しています。あわせて「カテゴリー」「年別アーカイブ」「タグ」を配置し、複数の気になるコラムへ自然にアクセスできる導線を設計することで、ホームページ内の回遊を促進するとともに、ユーザーの関心を段階的に高める工夫を施しています。

「シャッターに興味があり、リサーチしている方」や「不具合に悩んでいる方」などの個人ユーザーをメインターゲットとしているため、スマートフォンとPCの使用比率を7：3に想定し、モバイルファーストで設計しております。

「自分で修理したい方」などの目的別専用ページでは、スクロール時に画面左上へアコーディオンメニュー形式のMENUを固定表示する工夫を施しています。掲載情報が充実しているからこそ、項目ごとに整理することで、画面幅の小さいスマートフォンでも必要な情報へすぐにアクセスできる導線設計に仕上げました。

さらに、メインビジュアル直下に「#窓シャッター」「#修理」「#シャッター豆知識」などのハッシュタグをアイコン付きの横スライド形式で配置しました。各タグをタップすると、該当テーマのコラム一覧ページへ遷移します。横スクロール可能なUIを採用することで、限られた画面幅でも多くのカテゴリーを分かりやすく提示し、気になるテーマの内容を直感的な操作で確認できる仕掛けとしています。

デザイン面では、「シャッターでお悩みの方に、ホームページを通じて安心して知識を深めていただきたい」というお客様の想いを表現するため、「新着記事」や「人気記事」などの背景に、柔らかく温もりを感じさせるノイズ調のデザインを取り入れました。

また、メインビジュアルをはじめ、ページ全体にはシャッター修理に真剣に向き合う男性のお写真や、実際に取り扱ってきた多様な種類のシャッターのお写真を配置しています。そうすることで、企業としての誠実さや専門性を視覚的に伝え、掲載されている情報への信頼感を高める工夫を施しました。

システム面では、お客様ご自身で自由にコラムを更新できる「シャッター職人コラム」を、オリジナルのCMSとして自社開発しました。こちらのCMSでは、「シャッター修理」「重量シャッター」「シャッター後付」など発信する記事のテーマに合わせて自由にカテゴリー分けできるため、多くの情報をジャンルごとに整理しながらホームページを運用できるシステム設計となっております。

また、トップページの「スタッフお勧め記事」コンテンツには、注目させたいコラムをボタン一つで登録・表示できる機能を実装しました。そうすることで、重要な情報を常に目立つ位置で発信でき、より多くのユーザーへ確実に届けることが可能になります。

実際のご相談内容や現場で多いお悩みをもとに、検索されやすいキーワードを意識したコラム記事を継続的に発信できるオウンドメディア設計としています。記事ごとにカテゴリーやタグを整理できるCMSを自社開発し、テーマごとの情報を分かりやすく蓄積できる仕組みを整えました。

さらに、関連記事の内部リンクやタグ遷移を強化することで、ホームページ内回遊を促進し、検索エンジンからも評価されやすい構造を構築しています。