経営・戦略

2026.03.27 02:26

あなたのウェブサイトは成長に対応できるか? 柔軟性を備えた設計の手引き

stock.adobe.com

stock.adobe.com

タリー・スミスは、目的志向のブランド、マーケティング、デジタルエージェンシーであるSmith & Connorsの共同創業者で、CEO兼チーフ・クリエイティブ・オフィサーを務める。

advertisement

私はいつも耳にする。デジタルの陳腐化への恐れだ。「え、新しいウェブサイト? 公開する前から時代遅れになるよ!」

違いを生むのは、コードを1行も書く前に下す意思決定である。プロジェクトに柔軟性(ひいては持続性)を最初から組み込むにはどうすればよいのか、話していこう。

テンプレートから真のモジュール化へ

ここ数年だけを見ても、ウェブ技術は劇的に変化してきた。幸い、新しいパラダイムが登場している。いまやウェブサイトは、レゴブロックのように機能するコンポーネントベースのシステムから構築できる。

advertisement

このアプローチは、ストラテジスト、デザイナー、開発者がコンテンツ戦略をどう捉えるかを変える。私たちはいま、より構造的に考えるようになった。組織は時間とともに変化し、ウェブサイトもそれに合わせて変化できるべきだ。テンプレートで考えるのではなく、コンテンツタイプ(例えば、リスト、グリッド、キャプションの有無を含む画像など)と、それらをどう組み合わせれば、伝えたいストーリーを語り、売りたい製品を売り、人々を行動へと導くために必要なコンポーネントにできるかを考える。

コンテンツブロック

構造要素、すなわちどのレゴブロックが必要で、それらがどう組み合わさって機能を果たし、機能性を提供するのかを検討したら、次はビジュアルについて考え始める。コンポーネントは、動きがあり多様な形でどう連携すれば、ブランドとストーリーに命を吹き込めるのか。高度に専門的な体験のために機能する組み合わせがあるなら、いくつかの組み合わせに制約を設ける必要はあるのか。どんなブロックの組み合わせを積み上げてもシームレスに見えるよう、システムをどう設計すべきか。

テーマ設定

次に、コンポーネントの可変性、すなわち機能面やビジュアル面でより深い柔軟性を可能にするために、カスタマイズされた選択肢をどう組み込むかを検討する。究極的に優れたデジタルシステムは、ユーザーにとって刺激的でダイナミックなビジュアル体験を提供すると同時に、マーケティングチームが多様なコンテンツとユーザー体験を提供できるよう、緻密に調整された機能性を備える。私たちはこれを「テーマ設定(theming)」と呼んでいる。

例を挙げよう。ユーザーにダウンロードを促したり、ストーリーの深部へクリックさせたりする、コール・トゥ・アクション(CTA)コンポーネントである。構造的には、CTAには見出し、何かを方向づけたり説明したりする短いコピー、任意の画像、そして「続きを読む」のようなテキストが入ったボタンが含まれる。だが、同じCTAコンポーネントを毎回、すべてのページで使っていると、やがて反復的に見え、ユーザーにとっての関連性を失っていく。より関連性の高いコンテンツへ導いたり、問い合わせにつなげたりするという点で、ユーザー体験の中でも重要な瞬間であるため、背景に異なるブランドカラーの配色やイラスト調のパターンを組み込むことも検討すべき理想的なコンポーネントだ。CTAに変化を持たせることで、体験に新鮮さが生まれ、エンゲージメントも向上する。

最近、私のエージェンシーは、複数の地理的地域を持つ慈善財団のウェブサイトを構築した。ブランドの一体感を保ちながら、場所に根差したストーリーテリングを強化するため、主要なコンポーネントに地域別のイメージを用いた。

ストラテジスト、デザイナー、開発者としての私たちの仕事は、クライアントチームに、ミッションを前進させる魅力的なストーリーを構築するための創造的な余地を与える、柔軟なパーツキットをシステムとして考え抜き、つくることにある。

動的コンテンツとタクソノミー

長期運用を前提に構築する際のもう1つの検討事項は、戦略に組み込むメタデータ構造とタクソノミーである。タクソノミー(コンテンツのタグ付けとカテゴリ分けの方法)は、特定の提供物を超えて持続する機能であるべきだ。製品やサービス、プログラム、重点領域は変わり得るが、それらにタグ付けするための構造は、その進化を苦痛なく行えるようにしておく必要がある。

目標は、自社や組織の中で何が持続するかを考えることだ。これはビジネスモデルに行き着く。個々の項目ではなく、カテゴリと特性を中心にサイトを構築することが決定的に重要である。階層や関係性、そして変わっていくものを検討してほしい。

統合は背骨である

サードパーティの統合は重要だ。顧客関係管理(CRM)プラットフォームやメールプラットフォームのようなツールを、時間の経過とともにサイトの作り直しなしで入れ替えられるアプローチを選ぶべきである。

ビジュアルデザインへのシステム的アプローチ

モバイルファーストで設計すると、一覧性、階層構造、コンテンツの深部へ進む明確な導線を優先せざるを得ない。テキストは一覧しやすいように適切に構造化されているか。コンテンツの長さはどの程度で、どれくらいの早さで深掘りするためのリンクを提示しているか。画像はどのように表示され、単一のビューポートで何が見えるのか。

モバイルファーストで設計し執筆することは、ストーリーの本質について考えることを促し、従来の検索やAI検索で上位に表示されやすい状態へとサイトを位置付ける。コンポーネントベースのサイトは、ページ上でブロックが縦に積み重なるのが本質であるため、モバイルファーストで構築するうえで優れたアプローチだ。最小の画面幅に縮めたとき、システムはどのように機能するのか。デスクトップ用ページのモックアップと並行して、常にコンポーネントライブラリをテストしてほしい。

真の拡張性

コンポーネントベースのデジタルシステムを計画し、設計し、開発することは、今日の重要なベストプラクティスである。拡張可能な、厳選された戦略的システムに投資することで、新しいウェブサイトへの投資価値は長期的に大きく高まる。いまの時代、骨格がしっかりしていて、拡張や追加構築ができ、さらに何年も持ちこたえるウェブサイトを設計・構築することは可能だ。色や、全面的なビジュアルデザインさえ変えることがあっても、根底にあるロジックや基盤は依然として有効であり得る。新たなコンテンツニーズやアイデアが生まれたときには、新しいコンポーネントや機能を容易に追加できる。サイト全体を壊すことなく、インタラクティブな体験を導入することもできる。

第一歩は、何かを設計する前に、将来のニーズを深く考え抜くことだ。柔軟性とは、情報設計からコンポーネント設計に至るまで、あらゆる意思決定を形づくる哲学である。これを正しく行うのに、必ずしも最大の予算は必要ない。契約書に署名する前に、適切な問いを投げかけることが必要なだけだ。

forbes.com 原文

タグ:

advertisement

ForbesBrandVoice

人気記事