高品質なWebデザインとスキルその4（要素の整理）

デザイナーという職業は、創造性を生み出すプロセスが本当に興味深いので、多くの人にとって魅力的です。コンテンツを整理するプロセスがそれほど面白くないことはわかっていますが、コンテンツを整理する良い習慣を身につければ、思っているほど退屈ではないことがわかるでしょう。コンテンツを整理する方法は常に状況によって異なります。たとえば、これはどのような種類のサイトですか?ページ上の特定のコンテンツはどの程度重要ですか?

コンテンツをどこにどのように配置するかについては、非常に多くの組み合わせや組み合わせが可能です。ただし、従うべきヒントがまだいくつかあります。最も基本的なことは、デザインが達成する必要がある効果を最初に決定することです。たとえば、物を販売するウェブサイトを構築していますか?コンテンツ表示用ですか？それともユーザー登録ページを作っているのでしょうか？プロモーションページ？待ってください...

デザインによるビジネス: 37Signals
37 シグナルのこの人気 Web サイトをチェックしてください。彼らの商品がこれほどよく売れるのは単なる幸運ではありません。彼らのウェブサイトは、製品についてできるだけ簡単に知り、最終的な決定を下すのに役立ちます。目に入るものはすべて精巧にデザインされ、表現されています。

写真に示すように、彼らは製品を購入する4つの理由を提供します。注目を集めることが最初のステップです。黒のエリアを作り、製品についての簡単な紹介を置き、大胆なタイトルを使用しました。 そして、興味（Interest）を惹きつける美しいイラストを使って商品のメリットを紹介します。次に、顧客レビューの引用や製品の賞状を掲載することで、ユーザーに購入したいと思ってもらいたいと考えています。この場合、彼らはいくつかの「お客様の声」ビデオを通じてそれを行いました。最後に達成すべきことは、購入アクション (アクション) を促進することです。37Signals の Web サイトには、ページ全体に多数のアクション ポイント (ユーザーを次のステップに誘導するリンク) が含まれています。ページが非常に長いため、より多くのアクション ポイントが存在します。ページの下部に多くのアクションポイントが配置されています。

コンテンツ向けにデザイン (ブログ): よく薬を使います
ブログ ページをデザインする場合、状況はまったく異なります。ユーザーに製品を信頼してもらうために苦労する必要はありません。あなたの「製品」はすでにユーザーの目の前、つまりブログのコンテンツに表示されています。あなたがしなければならないのは、ユーザーが簡単に記事を読み、コンテンツを探索し、あなたやあなたのブログとつながることができるようにすることだけです。

コンテンツは、読者の前に表示されるブログの最初の部分 (の 1 つ) である必要があります。以下の例では、ピンク色の太字のタイトルが注目を集め、記事の内容に直接誘導されています。左側には適切なサイズのプレビュー画像があり、右側には記事の概要が 2 ～ 3 段落と「続きを読む」リンクがあります。もちろん、標準的な日付と著者情報もあります。これは私が考える「コンテンツデザイン」の好例です。興味のあるものには何でも注意を向けることができます。この例では、美しい RSS 購読ボタンが主役になっています。この焦点により、読者がコンテンツとのつながりを感じられるようになるのは言うまでもなく、サイトがより多くの購読者を獲得するのにも役立ちます。読者にコンテンツの探索を促すには、最新記事または最も人気のある記事へのリンクのリストをサイドバーに追加したり、ドロップダウン メニューを作成したり、プッシュしたい他のコンテンツの効率的なリストを整理したりするだけで簡単です。やり方は簡単ですが、特にブロガーにとっては十分に効果的です。ブログはプライベートな領域であり、さまざまなチャネルを通じて読者に連絡先情報を伝える (Connect) と、読者があなたのことを理解するのに役立ち、また予期せぬ利益をもたらす可能性があります。

コンテンツを整理するためのヒント
もちろん、ルールを破って珍しい方法を使用する必要がある場合もありますが、これらの簡単なヒントに従って、適切なコンテンツ構造と読み上げ順序を確保することができます。

なぜデザインをするのか?
前述したように、デザインの目的を決めます。
グリッドを使用する
グリッドを使用すると、ページを最大限に活用できます。
要素の配置をテストする
訪問者の視点からコンテンツの使いやすさを評価します。
不要な要素をすべて削除する
不要なものは排除するか、少なくとも目立つ場所には置かない
注意のバランス
他のものが輝けるようにいくつかのことを簡素化する必要がある

以上です 高品質Webデザインとスキルの内容4 (要素の構成) については、PHP 中国語 Web サイト (www.php.cn) に注目してください。