ホームページ  >  記事  >  ウェブフロントエンド  >  Webサイト制作のためのWebページスキル_VML関連

Webサイト制作のためのWebページスキル_VML関連

WBOY
WBOYオリジナル
2016-05-16 12:09:021261ブラウズ

すべてのネチズンがインターネットをサーフィンするとき、ユニークなデザイン、斬新な創造性、魅力的なページを備えた多くの個人の Web ページを必ず目にすると思います。また、自分の個人的なホームページを作成するというアイデアがあるかもしれません。このアイデアを本当にお持ちの場合は、次のコンテンツを読み続けてください。以下に提供する Web デザイン スキルは間違いなくあなたの目を楽しませ、将来的には独自のホームページを簡単にデザインできるようになります。さて、ここまでは述べたので、早速本題に入り、著者が今日どのような Web ページ制作スキルをもたらしたかを見てみましょう:

1. 設計する前に計画を立てる

ホームページのデザインはそれほど難しくないかもしれません。ただし、この作業には、従来の販促資料の作成と同様、慎重な取り扱いと計画が必要です。つまり、まず伝えるべき主な情報を決定し、すべてのアイデアを慎重に検討して合理的な方法で整理し、ページのスタイルを設計し、代表的なユーザーで試し、修正を繰り返して完璧を目指す必要があります。 。

2. 選択するコンテンツは新鮮なものである必要があります

World Wide Web 上では常に新しいものが登場しており、毎日新しいトリックがあります。ホームページがまったく変わらないと、ユーザーはすぐに飽きてしまいます。したがって、Web コンテンツの選択は型にはまらないものにし、「新しい」という言葉を強調する必要があり、Web サイトのコンテンツをデザインする際には、他人のコンテンツをコピーするのではなく、自分自身の実情に基づいて独自の Web サイトを作成することが求められます。見てみると、インターネット上の個人のホームページの多くは、単なる「食料品店」であり、内容はすべて同じテーマで、すべてが「ソフトウェアのダウンロード」であり、すべてが「ネットワークナビゲーション」を備えており、「新鮮さ」の痕跡はありません。始まりから終わりまでの意味。したがって、Webページをデザインするときは、素材の選択に重点を置く必要があります。素材の選択はできるだけ「少なく」、しかし「細かく」、「新しさ」を強調し、毎日更新することにこだわりさえすれば、このようなホームページは皆様に歓迎されると思います。

3. 内容は比較的実践的です

Web ページは興味深く魅力的になるように設計されていますが、これがユーザーを引き付ける最大の理由ではありません。ユーザー維持率を最大化するには、まず便利なものにする必要があります。これを行うための非常に簡単な方法は、相互参加を提供することです。読者に定期的に送信されるニュースレターにサインアップするなどの操作をしてもらい、毎週の賞品の抽選や何かをダウンロードする機会など、何らかの方法で参加へのお返しをしてもらいます。

4. Web ページの名前は簡潔にする必要があります

Web サイトは 1 つの Web ページだけで構成することはできないため、多くのサブページが存在します。これらのページを効果的に接続するために、ユーザーは最終的にこれらのページに代表的で簡潔で覚えやすい Web ページ名を付けることができます。 。これにより、将来的に Web ページの管理がより簡単になるだけでなく、他の人が Web ページを検索エンジンに送信するときにインデックスを作成することも容易になります。 Web ページに名前を付ける場合は、ページ上のリンクに直接関係する、一般的に使用する、またはページの内容に一致する小文字の英字を使用するのが最善です。

5. ページが適切にナビゲートできることを確認してください

ホームページの最も重要な機能の 1 つは、Web サイトやその他の場所に保存されている情報にユーザーを誘導するナビゲーション ツールとしての機能です。したがって、ホームページをデザインするときは、ナビゲーションプロセスをできるだけ簡単にするように努める必要があります。明確さと速度の理由から、ホームページ上のハイパーリンクされたコンテンツは、企業、製品、サービスなど、いくつかの上位カテゴリに限定する必要があります。一般に、A4 ページ サイズの Web ページでは、6 ~ 8 個のスーパー リンクを使用することがより適切です。また、スーパー接続の層数が多すぎないように注意する必要があり、接続情報の層が 4 層を超えると退屈になってしまいます。したがって、幅と深さのバランスを取る必要があります。 Web サイト上の情報が多すぎる場合は、ページを長くしたり、より多くの接続レベルを使用したり、それぞれに異なる情報を含む複数のホームページを作成したりすることもできます。ホームページ上のキーワードや単語からユーザーが必要な情報を見つけられるようにすれば、間違いなくユーザーに人気になります。

6. レイアウトに表を上手に活用する

レポートのように Web サイトのコンテンツを 1 つずつ列挙するのではなく、表を使用して Web サイトのコンテンツの階層とスペースを強調し、Web サイトの重要なポイントが一目でわかるようにすることに注意してください。そして明確な構造。

7. 合理的な視覚効果の設計

視覚的に興味を引くためにページを画像で埋めないでください。可能な限り色付きのドットを使用します。ドットは小さく、リスト項目に色の鮮やかさを加えます (色付きのリストでも使用できます)。色付きの仕切りも、帯域幅を妨げることなくグラフィックの雰囲気を高めます。さらに、Web ページを設計した後は、必ずさまざまな種類のブラウザとさまざまな解像度でホーム ページをテストしてください。たとえば、多くのブラウザでは 640 × 480 の解像度が使用されますが、一部の Web ページは 640 × 480 の高解像度で適切に表示されます。 800×600。非常に魅力的ですが、640×480 モードでは影が薄くなる可能性があります。さまざまな解像度やさまざまな種類のブラウザーで正常に表示できる Web ページを設計するために少し努力してください。

8. 写植するときは細部に注意してください

テキストを中央揃えにしたり、太字や斜体を使用したりしないでください。視覚的に乱雑であることに加えて、多くのブラウザでは斜体が適切に表示されず、文字の傾きによって生じる空白の変化が補正されません。短い段落、箇条書きリスト、適切なブロック引用符、セクションを分割するための水平線、主要なリンクをガイドするためのイメージ マップを使用して、ページを魅力的で読みやすくします。さらに、著者は、重要なコンテンツのレイアウトを Web ページの最後に配置しないように全員に注意を促しています。読者の視線がホームページに集中する可能性があるため、または、読者によっては、そこまで見下ろす忍耐力がない可能性があるためです。

9. GIF および JPG 形式の画像を上手に活用する

ユーザーはインターネット上を移動するため、ホームページにユーザーの注意を引き付け、維持する方法を見つける必要があります。 World Wide Web の最大のリソースの 1 つはマルチメディア機能なので、私たちは何としてでもそれを活用する必要があります。ホームページをユニークで忘れられないものにするためには、目を引く画像、斬新な写真、美しいフォントをホームページに配置するのが最善です。画像の内容は、一定の実用的な効果を持つ必要があり、見栄や誇張があってはなりません。現在、インターネット上のほとんどの画像は GIF および Jpeg インタラクティブ形式を使用しています。これは、インタラクティブ形式の画像は階層的に表示されるためです。最初は非常に低い解像度で表示され、その後徐々に解像度が上がり、最終的には通常の表示に達します。このアプローチでは、サイズが大きくなる場合があります。画像の読み込みが速くなっているように見えますが、実際はそうではありませんが、これは有益な錯覚です。これにより、読者は読み込み中に画像がどのように見えるかを確認しやすくなり、気に入らない場合や見たくない場合に転送を中断したり、他の場所を探す機会が得られます。

10.画像にテキストの説明を追加します

各グラフィックにテキスト説明を追加して、特にナビゲーション ボタンや大きな画像の場合、表示される前に関連するコンテンツを確認できるようにします。これにより、ネットワーク速度が遅すぎて画像をダウンロードできない場合や、ユーザーがテキスト型ブラウザを使用している場合でも、Web ページのコンテンツを読むことができます。将来、ユーザーは常に親近感を持って Web ページにアクセスできるようになります。あなたは気配りができ、思いやりがあり、常に他人のことを考えているので、あなたの優しさは必ず報われると信じています。

11. より多くの画像サムネイルを使用する

たとえば、1,600 万色で 800 × 600 ピクセルのスキャン画像があり、これは約 50K のスペースを占めます。 PhotoShop などの画像編集ツールを使用して、元の画像をたとえば高さ 100 ピクセルにリサンプリングします (高さと幅は、ブラウザが画像を適切なサイズで即座に表示できるようにするために重要です。おそらく独自の要件を満たすためです)。完璧なサイズを見つけるには調整する必要がありますが、まず高さを 4 ~ 6 で割ると、PhotoShop が新しい画像の幅を自動的に計算します。新しい画像を保存します。そのサイズは 8K 以下になるはずです。次に、次の HTML コードをソース ファイルに追加します。これにより、ブラウザが Lowsrc コマンドを解釈して実行するときに、ブラウザは実際の画像が読み込まれる前に低解像度の画像を読み込む必要があるため、訪問者は何が起こるかを知ることができます。 . どんな絵が出てくるのか。

12. アニメーションを多用しすぎることはお勧めできません

誰もが Web ページの装飾に GIF アニメーションを使用することを好みます。それは確かに非常に魅力的ですが、選択するときは、必ず GIF アニメーションを使用する必要がありますか? 答えが「いいえ」の場合は、容量が大きいため、静止画を選択してください。小さいですが、それ以上です。同じサイズのロゴの場合、GIF アニメーションの容量は 5K ですが、静的なロゴは 3K しかありません。わずか 2K の差ですが、これが大きくなるとダウンロード速度に影響しますので、必要のないものがある場合は小さい方を選択してください。

13. 点滅するテキストを多用しないでください

一部のデザイナーが点滅するテキストによって訪問者の注意を引きたいと考えるのは理解できますが、ページ上に点滅する単語は 3 つまでにする必要があります。多すぎるとユーザーにまぶしい印象を与え、実際にユーザーの閲覧時間に影響を及ぼします。 Web サイト上の他のコンテンツにアクセスするには、「極端に進むと物事は逆転しなければならない」という格言があります。

14. ページの長さは適度にする必要があります

ページが非常に長い場合は、短いページに比べて送信時間が明らかに長くなるため、注意が必要です。ページ送信が長すぎると、訪問者は待つ間忍耐力を失います。そして、これらの長いテキストを読むために、訪問者はスクロール バーを使用する必要があり、これもユーザーのインターネット サーフィンの時間を無駄にします。テキストベースのドキュメントが多数ある場合は、訪問者がオフラインで読めるように、貴重な時間を節約できるように、Adobe Acrobat 形式のファイルとして配置する必要があります。

15. Java プログラムの使用量は減らした方が良いです

大規模な形式の Java プログラムは使用しないでください。JavaScript を使用して効果を置き換えることができる場合は、Java を使用しないようにしてください。現時点では、Java の実行速度が耐えられないほど遅いため、視聴者は待ち時間が長くなりがちです。ページ全体が表示されるため、慎重にデザインしても効果はありません。

16. ページ全体のスタイルは一貫している必要があります

背景色、識別線、フォント、タイトル、脚注などを含む、Web ページ上のすべての画像とテキストは、サイト全体でスタイルが統一されている必要があります。こうすることで、読者は快適かつスムーズに見え、Web サイトに「非常にプロフェッショナル」な印象を残すことができます。

17. カウンターは使用しないほうがいいです

カウンタもプログラムによって設計されているため、カウンタを表示するプロセスは実際にはプログラムの実行プロセスであり、ユーザーの貴重なインターネット時間を消費します。さらに、ほとんどの視聴者はカウンタには意味がないと考えています。偽物なので、視聴者も広告を見たくありません。したがって、著者は、Web サイトに人目を引くクリック カウンターを配置することを軽々しく検討しないことをお勧めします。 Web サイトは、訪問者にサービスを提供するためにデザインするものであり、重要だと思うものを販売するためにデザインするものではありません。サイトの人気を示す場合は、アクセス ログを表示するリンクを提供することをお勧めします。

18. 各ページにはナビゲーション マークが必要です

すべてのページでは、最初から最後までナビゲーション記号、特に「ホームページに戻る」リンクを使用する必要があります。これはすべてのページで行うことができます。たとえば、各ページの上部 (または下部) に小さな一連のアイコンがあり、最初のアイコンはホームページに戻り、2 番目のアイコンは章に戻り、3 番目のアイコンはセクションに戻ります。画像ナビゲーションボタンの場合は、鮮やかな視覚効果だけを重視して東西南北を混乱させるのではなく、テキストのリンク色など、分かりやすいラベルを付ける必要があります。ナビゲーションには、従来の「未訪問」、「青」、「クリック済み」、「紫」または「栗色」を使用するのが最適です。つまり、読者に明確な指示を与えるために、テキスト リンクはページ上の他のテキストから区別される必要があります。

19. 相対スーパー接続を使用してみてください

画像またはテキストのハイパーリンクを作成するときは、できるだけ相対ハイパーリンクを使用してください。これは、Web ページの移植性が高いためです。たとえば、一連のソース ファイルを別の場所に移動する場合、相対パス名は引き続き有効です。接続のターゲットアドレスを再変更する必要がなく、また、相対スーパー接続を使用する場合の入力量が少なくなります。もちろん、同じページ上の接続項目には絶対アドレスを使用した後、相対アドレスを使用する必要があります。 、各接続を選択できます。ページをリロードしてください。直接関係のないファイルに接続する場合は、将来ソース ファイルを別のディレクトリに移動する場合に接続を変更する必要がないように、絶対パスを使用することをお勧めします。

20. スーパー接続が直感的かつ効果的であることを確認してください

ページ上のハイパーリンクにより、ユーザーは探しているものをすぐに見つけられるようにする必要があります。優れた Web サイトのほとんどには、各ページの同じ位置に同じナビゲーション バーがあり、閲覧者が各ページから Web サイトの任意の部分に直感的にアクセスできるようにしています。

また、特に「ここをクリックしてください」は避けるべきで、「ここをクリック」したい人は、正確に「ここ」で接続が正しいかどうかを慎重に検討してください。接続の名前を接続の URL と異なるものにしないでください。読者の時間を無駄にします。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。