正如同我們所知道的，網(wǎng)頁從誕生之初直到標(biāo)準(zhǔn)化經(jīng)歷了一個漫長的過程，隨著網(wǎng)絡(luò)、硬件、軟件的逐步成熟，才有了今天我們所看到的豐富多彩的網(wǎng)絡(luò)世界。但是世界從來都不是單一維度的，有優(yōu)秀的設(shè)計，自然也有奇葩到令人發(fā)指的難看的設(shè)計，就像美的追求從來都沒有止境一樣，丑的下限也總是能被人一次又一次地刷新。今天我們從網(wǎng)絡(luò)的故紙堆里面翻出了10個上世紀(jì)90年代流傳廣泛的「辣眼睛」的網(wǎng)頁設(shè)計作品，也許它們不是有史以來最丑的，但是也足夠博君一笑了。

畢竟，審丑和審美同樣重要。

1. Penny Juice

Penny Juice 是一款專門為孩子們而準(zhǔn)備的濃縮果汁。

多彩的果汁，似乎應(yīng)該搭配一個多彩的網(wǎng)站。在1999年的時候，如果你訪問這個網(wǎng)站，系統(tǒng)會提示你想看 HTML 的版本還是 Flash 的版本，如果你選擇 Flash 的版本，那么你會迅速看到一個使用大量熒光色、帶有交互式背景、包含旋轉(zhuǎn)硬幣、動畫文字和浮云等元素的網(wǎng)站。網(wǎng)站混合使用了當(dāng)時流行的 Time New Roman 字體，氣泡中則使用了堪稱反面典型的 Comic Sans，所有的這些元素共同構(gòu)成了這個堪稱精神污染的彩虹色網(wǎng)站。

排名第一絕對不是蓋的。

2. Arngren

Arngren 這個90年代都算得上的網(wǎng)頁設(shè)計中反面典型的網(wǎng)站，最令人震驚的一點是它一直存在至今。

這個以混亂擁擠而著稱的網(wǎng)站首頁信息量簡直像是要爆炸開一樣，至于它究竟是一個在線商店還是線上目錄，根本沒有人會深究，因為絕大多數(shù)人打開個網(wǎng)站的目的只有一個：前來膜拜。

想在這個被低像素貼圖塞滿的網(wǎng)站當(dāng)中找到特定的物品是一件真正意義上海底撈針的事情。

3. Sixties Press

有的時候，專業(yè)的事情還是盡量讓專業(yè)的人來做吧。這個名為 Sixties Press 的網(wǎng)站看起來像是一個6歲的孩子拼貼起來的，但是實際上它的來頭極大：這是英國著名作家 James Duval 親手設(shè)計，用來推銷詩歌圖書的網(wǎng)站。

很難想象他通過這個網(wǎng)站能賣得出去書。

當(dāng)然，現(xiàn)在打開這個網(wǎng)站，已經(jīng)不再使用上圖中這個邪教般的設(shè)計了。

4. The Internet 1996 World Exposition

其實這個名為1996互聯(lián)網(wǎng)世界博覽會的網(wǎng)站本身根本談不上丑，其內(nèi)容更是涵蓋了大量的來自藝術(shù)家、工程師和企業(yè)高管的互聯(lián)網(wǎng)歷史百科全書。

但是這個包含了大量子頁面的網(wǎng)站充滿了權(quán)利的游戲美學(xué)風(fēng)格，無論是在當(dāng)時還是在現(xiàn)在，都是一個相當(dāng)神奇的存在。這種奇特的美學(xué)特征貫穿了整個網(wǎng)站，從字體到裝飾均是如此。

5. Aliweb

Aliweb 被認為是世界上最古老的搜索引擎之一，通過搜索欄能夠找到你想獲取的內(nèi)容。

當(dāng)然，作為一個90年代的網(wǎng)站，將信息塞滿整個頁面，用小號字體確保頁面能夠承載盡可能多的內(nèi)容，也談不上什么錯誤，畢竟當(dāng)時大家還不是那么明白用戶體驗這個事情的重要性。雖然這個網(wǎng)站在設(shè)計上說不上是辣眼睛，但是費眼睛是一定的。

6. USGS

這個網(wǎng)站是1994年美國地址調(diào)查局的網(wǎng)站。

這個網(wǎng)站的背景采用了當(dāng)時非常常見的黃色背景，而網(wǎng)站真正讓人覺得神奇的是其中紅色的部分，這些文本其實全部都是鏈接，這個網(wǎng)站的設(shè)計師大概根本不太清楚網(wǎng)站的真實設(shè)計方法吧，這個槽簡直是不知道從哪里開始吐槽比較合適：紅色本是用來警告的，這里被用來作為超鏈接的色彩；紅色對于視覺障礙用戶而言也是不容易分辨的；另外，為什么這個網(wǎng)站全部的文本都是鏈接？

這個網(wǎng)站的設(shè)計師簡直是可用性是殺手。藍色之所以用來作為超鏈接的色彩，很大程度上是因為它是可識別度最高的色彩，不具備侵略性，而且是約定俗成的做法。

7. Amazon

要開始挖黑歷史了。

如今 Amazon 已經(jīng)是互聯(lián)網(wǎng)巨頭了，而巨頭剛剛開始的時候其實網(wǎng)站的設(shè)計也不咋樣。這個時候亞馬遜的網(wǎng)站設(shè)計和漂亮簡直毫不沾邊。

和許多90年代的泥石流級別的網(wǎng)站其實差別并不大，簡單粗陋，超鏈接的識別度低，背景的灰度過高，還不如前面美國國家地質(zhì)調(diào)查局的網(wǎng)站設(shè)計！

另外，這個階段亞馬遜的 LOGO 還是一個大理石材質(zhì)的字母A，和之后的設(shè)計簡直一個天上一個地下。

8. Apple

對的，接下來要說蘋果公司的網(wǎng)站了。

和同時期的其他網(wǎng)站相比，當(dāng)時蘋果公司的網(wǎng)站看起來并沒有那么糟糕，甚至要強上不少。

1997年的蘋果網(wǎng)站采用了垂直導(dǎo)航，帶有清晰的鏈接和滾動條，還很貼心地把日期和時間為你標(biāo)識出來。網(wǎng)站依然采用了老版的彩虹蘋果LOGO。

當(dāng)然，和今天的蘋果的網(wǎng)站相比，這個階段的蘋果公司的網(wǎng)站設(shè)計不僅毫無亮點，甚至可以說毫無可比性。

9. CocaCola

可口可樂在90年代的官網(wǎng)也是一個相當(dāng)值得吐槽的案例。

不說讓人很容易想起肯德基的紅色背景，首頁文本內(nèi)容的可讀性低得不像是一個重視設(shè)計的公司能設(shè)計得出來的樣子，而最重要的問題在于，可口可樂這個如此重視品牌的網(wǎng)站里面，LOGO在哪？

10. Disney

最后拉出來游街的大佬是迪斯尼。

如果不深究的話，網(wǎng)站本身在美學(xué)上確實很有迪斯尼的特征。網(wǎng)站采用了非常反常規(guī)的底部雙層導(dǎo)航欄，整個設(shè)計在可用性上并不強，單一個首頁就用了超過6種字體，極為花哨。

結(jié)語

這些90年代的老舊網(wǎng)站真的很糟糕，即使大廠出品的網(wǎng)站同樣呈現(xiàn)出各種各樣的缺陷。許多不成熟、不合理甚至不好看的設(shè)計，同樣能夠給我們很多啟示。

現(xiàn)如今，設(shè)計師通過成熟的流程（需求分析、用戶調(diào)研、線框圖、原型、開發(fā)、測試）來確保網(wǎng)站能夠逐步成熟，通過協(xié)同合作最終落地。用戶體驗設(shè)計師通過可用性測試等不同的手段讓產(chǎn)品功能和體驗真正能夠更加貼近用戶，貼合需求，也正是這些合理的手段和成熟的方法，讓設(shè)計的價值最終體現(xiàn)出來。

「2018年設(shè)計趨勢，一個都不要錯過」

• 《2018年，這10個LOGO設(shè)計趨勢值得你關(guān)注》
• 《超全面總結(jié)！2017年UI設(shè)計領(lǐng)域流行過這21個設(shè)計趨勢》
• 《掌握這12個移動端UX設(shè)計趨勢，你就掌控了2018年》
• 《這款獨特的紫色，是為你指引2018年設(shè)計方向的年度潘通色》

================明星欄目推薦================

優(yōu)優(yōu)教程網(wǎng)： UiiiUiii.com 是優(yōu)設(shè)旗下優(yōu)質(zhì)中文教程網(wǎng)站，分享了大量PS、AE、AI、C4D等中文教程，為零基礎(chǔ)設(shè)計愛好者也準(zhǔn)備了貼心的知識樹專欄。開啟免費自學(xué)新篇章，按照我們的專欄一步步學(xué)習(xí)，一定可以迅速上手并制作出酷炫的視覺效果。

設(shè)計導(dǎo)航：國內(nèi)人氣最高的設(shè)計網(wǎng)址導(dǎo)航，設(shè)計師必備： http://hao.uisdc.com