ウェブサイトの計画

最初のアイデアからrunableなウェブサイトを形にする

runableなウェブサイトは、明確な目的、対象となるユーザー、そして訪問者に取ってほしい1つの行動から始まります。このガイドを使って、その方針を役立つ制作概要にまとめ、次に使うツールが生成したものを評価しましょう。

続行する前にリンク先を確認する
Runableのランディングページのビジュアル

役立つサイトのコンセプトを支える3つの決定

制作概要から始める方法では、デザインを整える前に各ページの役割を定めます。ビジュアルから始める方法なら方向性をすばやく見つけられますが、コンテンツについては同じ判断が必要です。

1

出発点

制作概要から始める計画

対象となるユーザーと、その主な目的を書き出す。

ビジュアルから始める計画

ビジュアルの参考例を集め、目指す雰囲気を明確にする。

2

ページの目的

制作概要から始める計画

各ページに主な役割を1つずつ設定する。

ビジュアルから始める計画

魅力的なレイアウトでも、ページの役割が明確に伝わるか確認する。

3

コンテンツ

制作概要から始める計画

必要不可欠な情報と行動を促す文言の下書きを作る。

ビジュアル優先の計画

サンプル文言を、具体的で確認済みの情報に差し替える。

4

ナビゲーション

要件優先の計画

訪問者が探したい情報を基準にページをまとめる。

ビジュアル優先の計画

提案したメニューがそのニーズに合っているか検証する。

5

画像

要件優先の計画

メッセージを伝えるために必要な画像を列挙する。

ビジュアル優先の計画

選んだ画像が題材を正確に表しているか確認する。

6

最終確認

要件優先の計画

当初の目標に照らして構成を見直す。

ビジュアル優先の計画

実際のコンテンツとアクセシビリティ上のニーズに照らして、ビジュアルのコンセプトを見直す。

メッセージ、構成、ビジュアルを一体として機能させる

完成したコンセプトが使える状態か判断する前に、この3つを個別に評価すると判断しやすくなります。

Runableの機能を示すイメージ メッセージ

1

訪問者の疑問から始める

誰が訪問し、何を知る必要があり、次に何をすべきかを明確にします。サービス業なら、問い合わせを促す前に対応エリアを示すことが考えられます。冒頭のセクションを洗練させても、提供内容が不明確なままでは補えません。

  • 対象者と提供内容を明確にする。
  • ページで促す主要な行動を1つ選ぶ。
Runableの機能を示すイメージシーン 構成

2

各ページに明確な役割を持たせる

runableのウェブサイト構想は、各ページの目的が明確だと評価しやすくなります。概要ページでサービスを紹介し、詳細ページで実務的な疑問に答え、お問い合わせページで次のステップを示せます。訪問者の判断に役立たず、情報を繰り返すだけのページは削除しましょう。

  • ナビゲーションには分かりやすい名称を使う。
  • 重要な情報を訪問者が探す場所に置く。
Runableの機能を示すイメージ構成 ビジュアルの確認

3

ビジュアルは証拠ではなく、たたき台として扱う

画像やレイアウトは方向性を伝える助けになりますが、事業に関する事実を裏付けたり、あらゆる端末でサイトが機能することを保証したりするものではありません。デザインを採用する前に、コントラスト、文字の読みやすさ、掲載された商品や場所が実際のものと一致しているかを確認しましょう。

  • 誤解を招く仮の画像を差し替える。
  • 狭い画面幅と広い画面幅でレイアウトを確認する。

サイトの構想を段階的に検討する

  1. 1

    要点を絞った概要を作る

    対象者、提供するもの、訪問者に取ってほしい主な行動を明記します。その行動を支えるために必要なページと事実だけを追加し、確かでない主張は概要に含めないようにしましょう。

  2. 2

    方向性を探る

    概要を基に方向性を探り、できあがった構想を当初の目標と比較します。レイアウトが不足する情報を補ってくれたと思い込まず、何が足りないかを記録しましょう。

  3. 3

    公開前に確認する

    文章、リンク、連絡先を確認します。ナビゲーション、読みやすさ、モバイル画面でのレイアウトをテストし、ホスティングや公開に必要な手続きは別途手配しましょう。

構想を頼りにする前に限界を知る

このページは計画のためのガイドであり、リンク先で完成したサイトを構築・公開できることを保証するものではありません。

  • 公開手順は確認されていない

    現時点で得られる情報からは、この方法でドメインやホスティング、公開済みのウェブサイトが提供されるとは確認できません。

    対処法リンク先で現在利用できる機能を確認し、必要に応じて公開の手続きを別途行ってください。

  • 事実確認は自動では行われない

    提案されたページには、一般的な表現や情報の抜け、あなたの事業に当てはまらない内容が含まれる場合があります。

    対処法使用する前に、事実に関する記述、住所、画像、連絡手段をすべて確認してください。

  • 実機でのテストに代わるものではありません

    ビジュアルの方向性だけでは、キーボードで操作できるか、十分なコントラストで読めるか、画面サイズに応じて適切に表示されるかは確認できません。

    対処法完成したサイトを、対象となるデバイスでテストし、アクセシビリティも確認してください。

サイトの構想を次のステップへ

より明確な概要をもとに、サイトのアイデアを検討する

ここで明確にした対象ユーザー、提供内容、主な行動目標を用意してください。リンク先で何ができるかを確認し、得られた結果は公開できる完成品ではなく、出発点として見直してください。

サイトのアイデアを検討する
  • 具体的な対象ユーザーと目標を最初に示す
  • 下書きを使う前に詳細を確認する
  • リンク先で利用できる公開方法を確認する

Runableのウェブサイトに関する質問

誰に向けたサイトか、何を提供するか、訪問者に取ってほしい主な行動を書き出してください。正確な事業情報と、使用許可を得た画像があれば集めてください。提案されたコンセプトを判断するための具体的な基準になります。

いいえ。このページでは計画のためのガイダンスと別のサイトへのリンクを提供していますが、サイトのホスティングや公開は行いません。公開までの作業を進める前に、リンク先で現在利用できる機能を確認してください。

まず訪問者の目的から考えましょう。提供内容が分かり、必要な情報を見つけ、次に取るべき行動を確認できるでしょうか。そのうえで、ナビゲーション、情報の正確さ、読みやすさ、狭い画面での表示や操作を確認してください。魅力的な画像も、こうした基本を支えてこそ役立ちます。

そのまま使えるとは限りません。文章、画像、リンク、連絡先情報が実際の要件に合っているか確認してください。最終版の実装、テスト、公開には、開発者やサイト編集者による作業が必要な場合もあります。

作成を始める
作成を始める