回顧 30 多年的互聯網網站設計

由於 1991 年第一個網站發布，萬維網設計取得了長足的進步。 該網頁完全以文本內容為中心，標誌著一場電子革命的開始。

儘管對“正在建設”的 GIF 和令人眼花繚亂的跟踪記錄顏色的回憶讓我感謝互聯網發生了多少，但有一些歷史性的網站風格決定基本上需要尊重。

像這樣的互聯網站點 1 並沒有錯過時間，兩者都是。 如果您想在考慮到網站發布的任何時間間隔查看網站的外觀，請將其域名輸入 Wayback Machine 並選擇一天。 在這篇文章中，讓我們來看看網站風格是如何發展的，從純文本內容的界面到我們現在看到的流暢的現代設計。

1990 年代初期：古代

90 年代初標誌著我們網站佈局時間線的開始。 在這一點上，沒有這些東西作為高速網絡鏈接。 它是撥號調製解調器，或者什麼都不是。 因此，網站需要開發的鏈接速度遠低於一流的鏈接速度。 它們主要表現為文本分區——我們現在認為理所當然的“佈局格式”並不存在。

儘管後來的 HTML 變體允許更高級的設計，但與目前相比，它們是非常主要的，主要由標題、段落和入站鏈接的標籤組成。 諸如排版、圖像和導航之類的可見組件和样式是不那麼遙遠的可預見未來的項目。

現代互聯網網站的要點：

雖然這些早期網站的功能純粹是信息性的，但我們可以看到一些現在正在使用的設計組件。 這些舊網頁非常輕巧，並針對漸進式互聯網連接進行了優化，我們所有人都會不時地繼續工作。 這些設計和風格因素考慮了人的工作經驗，今天的網站通常不會做任何事情，即使速度更快。

當然，今天的萬維網可以處理加載媒體的互聯網網站……但即使現在它也有一些界限。 當加載速度通常不像我們想要的那麼快時，大型媒體文件、沉重的圖形樣式和異常的動畫都可能導致更高的跳出率。 考慮到復雜的風格和設計時，請把你的人放在頭上，並記住 KISS（繼續保持它非常簡單，超級英雄）。

1990 年代中期：中世紀

網絡結構的中心時代受到現場網站建設者和間隔 GIF 的困擾。 （雖然比真正的瘟疫大，理想嗎？）到 90 年代中期，網站風格在構圖和視覺外觀方面都得到了發展。 設計師開始使用基於表格的佈局來管理材料，從而提高靈活性和創造性想像力。 儘管如此，網站的文本內容還是相當重要的，但現在可以將文本分為列、行和其他導航功能，以提高可讀性。

圖形佈局功能也立即流行起來。 網站點擊計數器、動畫文本和跳舞的 GIF 只是以網絡風格標記這一時期的圖形功能中的一小部分。

今日網站要點：

現在，有很多解釋為什麼依賴於桌面的設計和样式不是您網站的理想選擇——大量的標記、緩慢的加載時間和視覺不一致只是其中的一小部分陷阱。

無論如何，這一進步對於萬維網風格的演變至關重要：它是從轉向非線性網站頁面框架開始的。 不同的元素現在可以定位在萬維網網頁的不同部分中，並且設計師經驗豐富，可以考慮以最有效的方式將現有數據提供給消費者。

在考慮導航和書面內容時，網頁結構仍然至關重要。 它在很大程度上決定了用戶如何體驗以及如何與您的網站進行交互。 儘管這些因素在整個網絡結構的中心時代可能並不處於最前沿，但它們目前肯定處於最前沿。

1990 年代後期：文藝復興

再生。 重生。 萬維網風格經歷了合理的重新構想，但第一次出現了 Flash 的引入。 Flash 於 1996 年推出，開闢了使用簡單 HTML 無法實現的風格前景的世界。 這是虛擬圖形和交互的結合。

雖然許多與之前時期完全相同的設計和样式組件繼續呈現，但它們通過動畫、平舖的歷史視覺效果、霓虹色、3D 按鈕、啟動網頁和其他多媒體進行了增強。

Flash 標誌著以客戶為中心的風格和設計的開始——結構和導航成為重要的標準，設計師開始在外觀和可用性上超越純粹的物品。

當今互聯網網站的要點：

Flash 改變了遊戲規則，但它不會永遠堅持下去。 Flash 現在幾乎沒有被應用，被認為是有史以來最大的 Web 優化罪之一。 今天，決定使用 CSS 和 JavaScript 動畫等替代解決方案以獲得相同的結果，或從視頻剪輯 Internet 託管網站嵌入影片已成為常態。

2000 年代初期：啟蒙運動

2000 年代初是可用性和適應性真正成為萬維網結構最前沿的時期。

主要需求是 CSS，一種允許開發人員將信息中的可見規則與 HTML 分開的編碼語言，熟練地將書面內容和時尚分開。 這給了那些網絡設計師和書面內容開發者更高的藝術自由——內容現在可以完全從設計中開發出來，反之亦然。 CSS 使網站更易於維護（更少的代碼和復雜性）、更靈活（div 標籤獨立於另一個）和更快的加載（更小的文件）。

更好地了解色彩心理學也導致更多地使用空白和較低的花哨色調，如霓虹燈。 鏈接開始持續添加到圖標中，而不僅僅是文本內容，分辨率和像素化成為更重要的問題，材料的戰略佈局也獲得了關注。

當今互聯網網站的要點：

男人和女人通常會瀏覽網站以搜索他們需要的信息和事實，因此任何使這項任務變得更簡單的網站都會獲得很大的測試標記。 精明的網頁設計師知道大多數最終用戶不應該瀏覽網站上的每一件小事，並了解受眾如何看待信息。

因此，直觀的事實、視覺上強調的入站鏈接和簡單的導航只是現代網站需要遵守的一些最佳程序。 一般風格和設計與可用性的想法！

2000 年代中後期：工業革命

網絡設計和風格的工業革命始於 Net 2 的開始。正是在這個時候，事情才真正開始走向現代萬維網。 多媒體應用程序的進步、交互式書面內容的興起以及社交媒體的出現是這一時期的兩個明確特徵。

此外，這些改進主要決定了網站結構的方式……很好，完成了。 美學改變捆綁了改善的陰影分佈，增加了圖標的使用，以及對排版的更好關注。

最重要的是，儘管如此，風格和設計逐漸成為內容，而書面內容則轉向研究動力優化。 隨著人現在牢牢地處於佈局的中心，營銷解決方案（至少明確地）成長為網站的次要表現——現在一切都是為了發現。

當今互聯網網站的要點：

如前所述，網站 2. 的演變將 Web 優化的進步視為需要考慮的事情。 儘管這些方法多年來一直在定制，但在 Web 優化方面考慮您的網站仍然是大多數蓬勃發展的企業網站的主要優先事項。

SEO需要書面內容，而書面內容在此期間大多成為網站風格和設計的重點。 關鍵字優化、入站和出站鏈接、創作、標記和聯合技術等 RSS 成為純粹的佈局元素。 雖然 url 垃圾郵件和搜索詞干擾迅速利用了這些方法，但這些程序在較長時間內無效，並且（我希望）大部分都失敗了。

2010 年至今：時尚時代

今天，在《從互聯網開始》發布大約兩年後，網絡佈局已經成為每一個非常好的廣告和營銷方法中不可替代的組成部分。 最新分析發現，當今 50% 的消費者認為網站風格對商業模式至關重要。

在當代美學條件下，我們見證了極簡主義的擴散：稀疏的文章、平面圖形（如此冗長，3D 按鈕！）、更簡單的調色板以及大而大膽的視覺效果。 此外，UX 已經處於中間階段，為這些佈局選項提供了途徑，如無限滾動和單獨的網頁設計和样式。

您可能已經註意到，我們的網站以其最新的佈局包含了所有這些特徵：

網絡風格和設計演變中更重要的一步是蜂窩互聯網。 考慮到 Iphone 於 2007 年問世，人們重新分析了互聯網站點的結構方式，以適應不斷增長的移動萬維網用戶。 考慮到手機通常缺乏典型台式機的處理速度或關係能力這一事實，它具有選擇“移動優先”策略的各種移動框架，並且更大的目標是優化手機速度。

這場數字革命還增加了響應式佈局，其中頁面方面機械地修改為瀏覽窗口的寬度，讓互聯網站點在任何機器或顯示器上都能很好地一瞥。 現在，需要響應式設計來確保令人滿意的移動用戶體驗，指定超過 50% 的全球網站訪問者將來自蜂窩設備。

互聯網網站隨後將走向何方？

如果有一個特定的元素教育了每個孤獨的人只是這些發展中的一個，那就是書面內容。 下面的每一種結構成分都經過調整，以便以最高效和最有效的方式將最合適的材料帶給人們。 可訪問性、適應性和可用性的概念真正定義了這個萬維網佈局時期。

儘管目前我們可以在互聯網設計方面做很多其他事情，但很高興再次考慮我們來自的地方。 想知道網站設計如何取得如此大的進步，在接下來的 20 年裡，無論它在哪裡，都會讓人感到非常激動。

編者請注意：這篇文章最初於 2013 年 7 月發布，並且一直是最新的。