滿滿的年代感！回顧90年代的網(wǎng)站設(shè)計(jì)

很多人說(shuō)，時(shí)尚圈二十年一個(gè)輪回。那網(wǎng)頁(yè)設(shè)計(jì)，是否也有輪回？
據(jù)紐約時(shí)報(bào)報(bào)道，國(guó)外最近針對(duì) Web Design 也掀起了一陣 90 年代的復(fù)古風(fēng)：
加拿大搖滾樂(lè)隊(duì) Arcade Fire 的新專(zhuān)輯 “Everything Now” 的網(wǎng)站，打開(kāi)后會(huì)發(fā)現(xiàn)先是一段復(fù)古的加載動(dòng)畫(huà)，然后是充斥著 Windows 98 風(fēng)格的彈出式窗口的頁(yè)面，歌迷需要去關(guān)閉或點(diǎn)開(kāi)一些窗口才能聽(tīng)到樂(lè)隊(duì)的新歌。
時(shí)尚潮牌巴黎世家 Balenciaga  的新網(wǎng)站看起來(lái)和微軟的 Excel 表格一毛一樣。
碧昂斯的妹妹 Solange 的 D.I.Y.主頁(yè)走的是 iMac 的桌面風(fēng)格，配有 QuickTime 窗口和藍(lán)色文件夾。
一起來(lái)看看90年代的網(wǎng)站設(shè)計(jì)到底是怎么樣的：
1、1990 年代初期：古代
90 年代初標(biāo)志著我們網(wǎng)站設(shè)計(jì)時(shí)間表的開(kāi)始。在這一點(diǎn)上，沒(méi)有高速互聯(lián)網(wǎng)連接這樣的東西。它是撥號(hào)調(diào)制解調(diào)器，或者什么都不是。因此，需要為低于一流的連接速度構(gòu)建網(wǎng)站。它們大多看起來(lái)像文字墻——我們現(xiàn)在認(rèn)為理所當(dāng)然的“設(shè)計(jì)布局”并不存在。
雖然后來(lái)的 HTML 版本允許更復(fù)雜的設(shè)計(jì)，但與今天相比，它們?nèi)匀环浅；?，主要由?biāo)題、段落和鏈接的標(biāo)簽組成。諸如排版、圖像和導(dǎo)航之類(lèi)的視覺(jué)元素和樣式是不久的將來(lái)的事情。
2、1990 年代中期：中世紀(jì)
網(wǎng)頁(yè)設(shè)計(jì)的中世紀(jì)受到現(xiàn)場(chǎng)頁(yè)面構(gòu)建器和間隔 GIF 的困擾。到 90 年代中期，網(wǎng)頁(yè)設(shè)計(jì)在結(jié)構(gòu)和外觀方面都發(fā)生了變化。
設(shè)計(jì)師開(kāi)始使用基于表格的布局來(lái)組織內(nèi)容，從而獲得更大的靈活性和創(chuàng)造力。網(wǎng)站的文本仍然很繁重，但現(xiàn)在可以將文本分為列、行和其他導(dǎo)航元素以提高可讀性。
圖形設(shè)計(jì)元素也迅速流行起來(lái)。頁(yè)面點(diǎn)擊計(jì)數(shù)器、動(dòng)畫(huà)文本和跳舞的 GIF 只是網(wǎng)頁(yè)設(shè)計(jì)中標(biāo)志著這一時(shí)期的圖形元素中的一小部分。
3、90年代末期的頁(yè)面
它是向非線性頁(yè)面結(jié)構(gòu)邁出的第一步。不同的元素現(xiàn)在可以放置在網(wǎng)頁(yè)的不同部分，設(shè)計(jì)師必須考慮向用戶呈現(xiàn)信息的最佳方式。
在考慮導(dǎo)航和內(nèi)容時(shí)，頁(yè)面結(jié)構(gòu)仍然至關(guān)重要。它在很大程度上決定了用戶如何體驗(yàn)以及與您的網(wǎng)站進(jìn)行交互。
Flash 標(biāo)志著以訪問(wèn)者為中心的設(shè)計(jì)的開(kāi)始——結(jié)構(gòu)和導(dǎo)航成為重要的考慮因素，設(shè)計(jì)師開(kāi)始關(guān)注外觀和可用性，而不是純粹的內(nèi)容。
說(shuō)實(shí)話，這些 90 年代的網(wǎng)站設(shè)計(jì)真的很奇怪 —— 五彩斑斕的頁(yè)面、各種不同字體的混搭、隨意設(shè)置的背景圖形、不考慮用戶觀感的字體大小，隨便拎一條都能作為設(shè)計(jì)中的原罪。
不過(guò)技術(shù)總是在不斷發(fā)展的，設(shè)計(jì)理念也是在發(fā)展的過(guò)程中一步步完善，一步步前行。當(dāng)我們回過(guò)頭看這些「糟糕」的設(shè)計(jì)，其實(shí)都是前人給我們鋪好的階梯，讓我們能一直進(jìn)步！http://www.rugbycreeksporthorses.com/jianzhan/dingzhijianzhan.html