30年以上のインターネットサイトデザインを振り返る

公開: 2022-03-30

ワールドワイドウェブデザインは、最初のウェブサイトがリリースされた1991年の事実により、非常に長い道のりを歩んできました。 完全にテキストコンテンツ中心のこのWebページは、電子革命に発展するものの始まりを示しました。

「建設中」のGIFの思い出と目がくらむような実績の色は、インターネットがどれだけ発生したかを感謝していますが、本質的に敬意を払う必要のある歴史的なWebサイトスタイルの決定がいくつかあります。

この1のようなインターネットサイトは、どちらも時間の経過とともに失われていません。 Webサイトの立ち上げを考慮して、任意の間隔でWebサイトがどのように見えるかを確認したい場合は、そのドメインタイトルをWayback Machineに入力し、曜日を選択します。 この記事では、テキストコンテンツのみのインターフェイスから、最近見られるスムーズで現在のデザインまで、Webサイトスタイルがどのように発展してきたかを調べてみましょう。

無料ダウンロード:華麗なウェブデザインの77の例

1990年代初頭:古代

90年代初頭は、インターネットサイトのレイアウトタイムラインの始まりです。 この時点では、ペースの速いWebリンクとしてこれらのものはありませんでした。 それはダイヤルアップモデムでした、またはそれは何もありませんでした。 したがって、ウェブサイトは、恒星よりもかなり遅いリンク速度で開発する必要がありました。 それらは主にテキストのパーティションのように見えました—「レイアウト形式」として現在私たちが当然と考えているものは存在しませんでした。

history of web design: an examle of an early html website

その後、HTMLのバリエーションにより、はるかに高度なデザインが可能になりましたが、現在と比較すると、主にヘッダー、段落、およびインバウンドリンクのタグで構成されており、非常に主要なものでした。 タイポグラフィ、画像、ナビゲーションなどの目に見えるコンポーネントとスタイリングは、それほど遠くない予見可能な未来のアイテムでした。

現代のインターネットウェブサイトのポイント:

これらの初期のWebサイトの機能は純粋に情報提供でしたが、現在利用しているいくつかの設計コンポーネントを見ることができます。 これらの古いネットページは非常に軽量であり、段階的なインターネット接続用に最適化されており、私たち全員が時折経験を続けています。 これらのデザインとスタイルの要素は、人の作業経験を考慮に入れており、今日のサイトでは、速度が速くても、通常は何もしません。

確かに、今日のワールドワイドウェブはメディアをロードしたインターネットウェブサイトに取り組むことができます…しかし、今でもいくつかの境界があります。 大きなメディアファイル、重みのあるグラフィックスタイル、異常なアニメーションはすべて、読み込み速度が通常、必要な速度ではない場合に、バウンス率を大きくする原因となる可能性があります。 複雑なスタイルとデザインを考慮するときは、人の頭を抱えて、KISS(非常にシンプルなスーパーヒーローを維持し続ける)を忘れないでください。

1990年代半ば:中世

ネット構造の中心的な時代は、ウェブサイト上のウェブサイトビルダーとスペーサーGIFに悩まされていました。 (しかし、実際の疫病よりも大きい、理想的ですか?)90年代半ばまでに、Webサイトのスタイルは、構成と外観の両方の条件でそれらの両方を開発しました。 デザイナーは、テーブルベースのほとんどのレイアウトを使用して素材を管理し始め、柔軟性と創造的な想像力を高めました。 それにもかかわらず、Webサイトはかなり重要なテキストコンテンツでしたが、テキストを列、行、およびその他のナビゲーション機能に分割して、読みやすさを大幅に向上させることができます。

グラフィックレイアウト機能もすぐに人気が高まりました。 サイトのヒットカウンター、アニメーションテキスト、ダンスGIFは、この期間をネットスタイルでマークするグラフィック機能のほんの一握りです。

history of web design: the early version of apple's website

今日のWebサイトのポイント:

現在、デスクに依存するデザインとスタイルがWebサイトにとって理想的な選択ではない理由はたくさんあります。大幅なマークアップ、読み込みの遅れ、視覚的な不一致は、ほんの一握りの落とし穴です。

いずれにせよ、この進歩はワールドワイドウェブスタイルの進化に不可欠でした。それは、非線形のウェブサイトページフレームワークへの移行から始まりました。 個別の要素をワールドワイドウェブWebページの個別のセクションに配置できるようになり、設計者は、既存のデータを消費者に提供するための最も効果的な方法を検討した経験があります。

ナビゲーションと書かれたコンテンツについて考えるとき、ウェブページの構造は依然として重要です。 これは主に、ユーザーがWebサイトをどのように体験して対話するかを決定します。 これらの要因は、ウェブ構造の中心時代を通じて最前線にあったわけではないかもしれませんが、現在は確かに最前線にあります。

1990年代後半:ルネッサンス

ルネッサンス。 再生。 ワールドワイドウェブスタイルは、合理的な再想像のシェアを経験しましたが、Flashの導入で最初の1つが発生しました。 1996年に導入されたFlashは、単純なHTMLでは達成できないスタイルの展望の世界を切り開きました。 それは仮想グラフィックスとインタラクションの融合でした。

以前の期間とまったく同じデザインとスタイルのコンポーネントの多くが引き続き提示されていましたが、アニメーション、タイル張りの履歴ビジュアル、ネオンカラー、3Dボタン、スプラッシュWebページ、およびその他のマルチメディアで強化されました。

Flashは、顧客中心のスタイルとデザインの始まりを示しました。建設とナビゲーションが重要な基準となり、デザイナーは純粋な品物を超える外観と使いやすさに焦点を合わせ始めました。

history of web design: a website with flash elements

現在のインターネットサイトのポイント:

Flashはゲームチェンジャーでしたが、永久に定着するわけではありませんでした。 Flashは現在ほとんど適用されておらず、これまでで最大のWeb最適化の罪の1つと見なされています。 今日では、同等の結果を得るために、これらの種類のCSSおよびJavaScriptアニメーションなどの代替ソリューションを決定するか、Webサイトをホストしているビデオクリップインターネットからフィルムを埋め込むことが一般的です。

2000年代初頭:啓蒙主義

2000年代初頭は、ユーザビリティと適応性がワールドワイドウェブ構造の最前線に真に登場した時期でした。

主な需要はCSSでした。これは、開発者がHTMLとは別の情報で目に見えるルールを維持し、書かれたコンテンツとファッションを上手に分離できるようにするコーディング言語です。 これにより、これらのネットデザイナーと書かれたコンテンツ開発者の両方に芸術的な自由度が高まりました。コンテンツはデザインから完全に開発できるようになり、その逆も可能になりました。 CSSは、サイトの保守が容易で(コードと複雑さが少ない)、柔軟性がはるかに高く(divタグが互いに独立している)、ロードが高速である(サイズの小さいファイル)。

色彩心理学についてのより良い知識はまた、空白の使用の増加とネオンのような派手な色相の低下につながりました。 リンクはテキストコンテンツだけでなくアイコンに追加されたままになり始め、解像度とピクセル化ははるかに重要な問題になり、素材の戦略的な配置も注目を集めました。

history of web design: an early website for the company polaroid

現在のインターネットサイトのポイント:

男性と女性は通常、必要な情報と事実を検索するためにWebサイトをスキャンするため、このタスクを簡単にするサイトはどれも大きなテストマークを取得します。 精通したWebデザイナーは、ほとんどのエンドユーザーがWebサイトのあらゆる小さなものを閲覧するべきではないことを知っており、オーディエンスが情報をどのように考慮しているかを理解しています。

したがって、直感的に事実を伝え、視覚的に強調されたインバウンドリンク、および単純なナビゲーションは、現代のWebサイトが順守する必要のある最も優れた手順のほんの一部です。 一般的に、思考の使いやすさを備えたスタイルとデザイン!

2000年代半ばから後半:産業革命

ネットのデザインとスタイルの産業革命は、ネット2の始まりから始まります。この時点で、問題は真に現代のワールドワイドウェブに向かって動き始めました。 マルチメディアアプリの進歩、インタラクティブな書き込みコンテンツの台頭、およびソーシャルメディアの出現は、この間隔の2つの決定的な特徴です。

さらに、これらの改善により、主にWebサイトの構造が…うまく行われるようになりました。 美的変化は、改善された色合いの分布、アイコンの使用の増加、およびタイポグラフィへのより良い注意をバンドルしました。

それにもかかわらず、最も重要なことは、スタイルとデザインがコンテンツマテリアルになり、書かれたコンテンツが研究モーターの最適化に転向したことです。 その人がレイアウトの中心にしっかりといることで、マーケティングソリューションは(少なくとも明示的に)サイトの二次的なパフォーマンスに成長しました。

history of web design: a mid-2000s website for the company lulu lemon

今日のインターネットサイトのポイント:

話したように、ウェブサイト2の進化は、考慮すべき事柄としてウェブ最適化の進歩を観察しました。 これらの方法は何年にもわたって調整されてきましたが、Web最適化のフレーズでWebサイトについて熟考することは、ほとんどの繁栄しているエンタープライズWebサイトにとって依然として主要な優先事項です。

Seoは書面によるコンテンツを必要とし、この期間中に書面によるコンテンツは主にWebサイトのスタイルとデザインに重点を置くようになりました。 キーワードの最適化、インバウンドとアウトバウンドのリンク、オーサリング、タグ付け、シンジケーションのノウハウは、RSSが純粋なレイアウト要素になったためです。 URLスパムと検索用語の妨害はこれらの方法をすぐに利用しましたが、これらの手順は長期間効果的ではなく、(私は願っていますが)ほとんど失敗しました。

2010年から今まで:ファッショナブルな時代

インターネットサイトから始めるための出版から約2年後の今日、ネットレイアウトは、すべての非常に優れた広告およびマーケティングアプローチのかけがえのない要素として単独でしっかりと確立されています。 最新の分析によると、今日の消費者の50%は、Webサイトのスタイルがビジネスのモデルにとって重要であると考えています。

現代の美学の条件では、ミニマリズムの急増を目の当たりにしました:まばらな記事、フラットなグラフィック(非常に長い、3Dボタン!)、よりシンプルなカラーパレット、そして大きくて大胆なビジュアル。 さらに、UXは中途半端な段階にあり、無限スクロールや単独のWebページのデザインやスタイルなどのレイアウトオプションに道を譲ります。

あなたは私たちのインターネットサイトが最新のレイアウトでこれらすべての特徴を取り入れていることに気づいたかもしれません:

history of web design: a modern website for the company hubspot

Webスタイルとデザインの進化においてより重要なステップは、セルラーインターネットです。 2007年のiPhoneの開始を考慮して、インターネットサイトがモバイルワールドワイドウェブの人々の増加に対応するためにどのように構成されているかについて再分析が行われました。 これは、「モバイルファースト」戦略を選択するさまざまなモバイルフレームワークを特徴とし、電話は通常、通常のデスクトップの処理速度や関係能力を欠いているという事実を考慮して、セルペースの最適化をさらに大きく目指しています。

このデジタル革命により、レスポンシブレイアウトも向上しました。このレイアウトでは、ページのアスペクトがブラウジングウィンドウの幅に機械的に変更され、インターネットサイトがどのマシンやディスプレイでも非常によく見えるようになります。 現在、レスポンシブデザインは、満足のいくモバイルユーザーとの出会いを確実にするために必要であり、世界中のサイトサイト訪問者の50%以上が携帯電話デバイスから来ると指定されています。

インターネットサイトはその後どこに行くのでしょうか?

これらの発展のうちの1つだけを個々の孤独に教育した特定の要素が1つある場合、それは書かれた内容です。 以下のすべての単一構造成分は、最も生産的かつ効果的な方法で人に最も適切な材料を運ぶように適合されています。 アクセシビリティ、適応性、およびユーザビリティの概念は、ワールドワイドウェブレイアウトのこの期間を実際に定義します。

現在インターネットデザインでできることは確かにかなり追加されていますが、私たちが生まれた場所に再び登場することを検討するのは楽しいことです。 その結果、ウェブサイトのデザインがどのように進んだかを知りたくて、今後20年間でどこに行くのかを感じるのは本当にワクワクします。

編集者の注意:この記事は2013年7月に最初に投稿されたものであり、現在では包括的です。

素晴らしいホームページ、ブログ、ランディングページのデザインの例