オーディエンスとそのニーズを定義する
あなたのウェブサイトの目的と目的を定義することは、あなたの最初のステップであるべきです. ウェブサイトで達成したいことに集中してください。 対象となる視聴者のプロファイルを作成し、彼らのニーズと好みを理解しようとし、常に彼らを念頭に置いてサイトを設計してください。 競合他社の Web サイトを見て、何が機能し、何が機能しないかを把握してください。
簡単なナビゲーション
対象とする視聴者がコンテンツを簡単にナビゲートできるようにするために、Web サイトのメイン セクションへのリンクが各 Web ページから簡単に見えるようにしてください。 サイトのできるだけ多くのページを表示するように人々を招待したいので、各ページを簡単に見つけられるようにします。
サイトの構造を視覚化するのに役立つ良い方法は、紙に Web サイト全体のフローチャートを作成することです。 ユーザーが必要な情報を簡単に見つけられるように、サイト内の情報をどのように構成するかを考えてみてください。
あまりにも多くの情報で人々を行き詰まらせないように、最初のページの情報は概要にとどめるようにしてください。 次に、(明確で使いやすい) リンクをクリックして、関心のあるトピックに関する詳細情報を表示できます。
レイアウト
ほとんどの Web ページには、ヘッダーとフッター、ページの上部にある水平ナビゲーション バー、および/またはページの左側にある垂直ナビゲーション バー、およびメイン コンテンツの中央セクションで構成される共通の構造があります。
この構造は、シンプルでわかりやすいレイアウト原則に基づいています。 コンテンツが多い場合は、閲覧者が 1 つのページで多くの情報を消化しなくて済むように、コンテンツをいくつかの異なるページに分割します。
テキストは簡潔かつ要点を保ち、文法が正しいことを確認してください。 専門外に見えないように、何度も確認してください。 テキストは、印刷されたメディアよりも画面上で読むのが難しいため、簡潔でわかりやすい方法でメッセージを伝えることが重要です。
テキスト ブロックは常に比較的小さくしておく必要があります。 長い段落は読みにくく、聴衆がすぐに興味を失う可能性があります。
多くても 2 つまたは 3 つの異なるフォントに固執し、それらがほとんどのコンピューターで一般的に見られるものであることを確認してください。 コンピューターのモニターではサンセリフ体の方が読みやすいので、本文はサンセリフ体のままにし、テキストは全員が読める大きさにしてください。 箇条書き、リスト、関連する写真は、テキストを分割するのに役立ちます。
htmlの基礎を学ぶ
WYSIWYG ソフトウェアの Front Page や Dreamweaver を使用している場合でも、html の基本を学ぶことで、Web ページがどのように構築されているかを理解し、ソフトウェアを使用して遭遇する問題に対処することができます。 表から離れて、レイヤー (div) とカスケード スタイル シート (CSS) を使用してページを作成してください。
テーブルは「プレゼンテーション」データをコンテンツに混ぜ合わせます。これにより、ユーザーはアクセスするページごとにこのプレゼンテーション データをダウンロードする必要があるため、ページのファイル サイズが不必要に大きくなります。 しかし、構造的マークアップを使用して Web ページを作成することにより、ページの実際のコンテンツを表示方法から切り離すことができます。
また、表ベースのページは、障害のあるユーザーや、モバイルや PDA を使用して Web にアクセスする閲覧者にとって、アクセスしにくいものです。 サイトのレイアウトを変更するには、スタイル シートを変更するだけです。 ページ自体を編集する必要はまったくありません。
色の使用
Web サイトの配色を選択するためのバランスの取れたカラー パレットを作成すると、プロフェッショナルな外観の Web サイトを作成するのに役立ちます。 鮮やかな衝突色がアマチュアを叫びます。
ロゴのある会社のウェブサイトを作成する場合は、ここから始めてください。 ロゴをホスト サーバーにアップロードし、次のようなカラー パレット Web サイトに移動します。 http://www.colorhunter.com メイン バナー、ボタン、テキスト ロールオーバーなどの色を選択できるパレットを作成します。また、物事をシンプルで整然とした状態に保ちます。空のスペースは色を際立たせ、テキストを読みやすくします。
写真と画像の最適化
グラフィックだけを使用しないでください。 その存在には理由があることを確認してください。つまり、ユーザーの理解と経験を向上させます。 不要なグラフィックスでいっぱいのサイトは素人っぽく見え、スクリーン リーダーなどのアクセシビリティ ツールの障害になる可能性があります。
使用する写真や画像が鮮明で、ファイル サイズを小さくし、ページの読み込み時間を長くするために最適化されていることを確認してください。 素人っぽいウェブサイトの確かな兆候の 1 つは、読み込みに永遠にかかる巨大な画像を含むページです。 そして、あなたの視聴者はおそらくサイトを見る前にクリックして離れてしまうでしょう。
鮮明でプロ並みのグラフィックスを作成する GIF は、実際には小さなピクセルの正方形で構成されたグリッドです。 すべてのピクセルに関するデータが保存され (ロスレス)、最大 256 色まで保存できます。 ピクセルが透明になることもあります。
GIF には複数のフレームが含まれる場合があるため、アニメーション化できます。 グラフや小さなグラフィックス、テキストを含む画像、描画など、色の少ない画像を保存するのに適した形式です。
JPEG は、写真、色合いの多い図面、グラデーションを含む画像など、何百万もの色を含む画像に適したファイル形式です。
設計のヒント:
a.) デザインを使用して機能性を強調します。 例えば; ボタンにグラデーションを使用すると、より「ボタンらしく」見えるようになります。別の色のマウスをテキストの上に置くと、リンクに注意が向けられます。
b.) 特定の機能を果たさない限り、アニメーションやサウンドには注意してください。 ページ上で点滅したり飛んだりするものがあると、サイトの内容を読むことに集中するのが難しくなります。 また、接続速度が遅い訪問者は、意図に反してアニメーションやサウンド ファイルを強制的にロードすることで時間を無駄にしたことに腹を立てる可能性があります。 最近の調査によると、点滅する広告に襲われた訪問者はすぐにサイトを離れる可能性が高く、サイトをブックマークしたり、戻ったり、リンクしたり、推奨したりする可能性ははるかに低くなります.
c.) Web ページの背景として画像を使用しないでください。 画像の背景は「アマチュア」と叫びます。なぜなら、それらを使用するのはほとんどがアマチュアのサイトだからです。 読み込みに時間がかかり、背景画像の上のテキストは通常、読みにくくなります。
e.) 視聴者向けにすべての要素を含む Web ページをデザインします。 たとえば、ラベンダーやブルーなどの色を使用して、マッサージ / セラピーの Web サイトの落ち着いたムードを作成します。 より伝統的な金融ウェブサイトには、より暗く、より抑制された、より強い色を使用してください。
d.) ビジネスにまだロゴがない場合は、サイトのロゴを作成し、すべてのページの上部に表示し、そこからホームページへのリンクを追加します。 これにより、サイトがよりプロフェッショナルに見え、ブランディングの感覚が生まれ、人々があなたのサイトを思い出し、あなたのものであると認識できるようになります.
「ライブ」に行く
ホスティング
ホスティングに関しては、最も安いことが常に最善とは限りません。 小さめの「初心者」向け。 （「画像の最適化」のガイドラインに従っていない限り、帯域幅はあまり必要ありません）。初心者として必要かもしれません。
使用を検討しているホスティング会社のウェブサイトで現地の連絡先電話番号を探し、その電話番号の最後に実際の人がいるかどうかを確認するために電話をかけることを常にお勧めします.
この番号から技術的なサポートを受けられるかどうか尋ねてください。 テクニカル サポートについては、電子メールでのみ連絡を取ることができます。 彼らがあなたに別の番号を与えた場合は、1分あたりの料金を尋ね、電話をかけて、サーバーへの接続、ファイルのアップロード、または並べ替えで問題が発生した場合に、初心者としてあなたを助けてくれる人が最後にいることを確認してください.メールアカウントを削除します。
また、メール アカウントが費用に含まれていることを確認する必要があります。また、ウェブサイトに検索機能や問い合わせフォームなどの動的な要素がある場合は、この機能を許可するために必要な PHP や ASP などをサーバーがサポートしていることを確認してください。作業、およびそれが見積もられたホスティング価格に含まれている場合。
FTP
Filezilla や Smart ftp などのさまざまなソースから無料の ftp ソフトウェアをダウンロードして、新しい Web サイトを新しいホスティング スペースにアップロードするか、Cute ftp の無料トライアルを試すことができます。
検索エンジンの最適化
プロの Web デザイナーは、設計と開発の開始時から Web サイトの最適化を念頭に置いていますが、初心者としては、一度に 1 歩ずつ実行する必要があります。 Web サイトの設計、構築、アップロードが完了したので、検索エンジンのランキングに合わせて Web サイトを最適化する方法をいくつか見てみましょう。