很多非常聰明的人都說(shuō)過(guò)，不從歷史中吸取教訓的人注定要重蹈覆轍。還有人說(shuō)懷舊誘餌，回顧得到了很多點(diǎn)擊，個(gè)人認為回顧一下過(guò)去一些過(guò)時(shí)的UI慣例可能既有趣又有教育意義。

記住他們曾經(jīng)存在的原因，他們是如何死的以及為什么死的很好。它讓我們深入了解最佳實(shí)踐是如何產(chǎn)生的，以及為什么它們是我們擁有的“最佳”實(shí)踐，它為我們構建web的未來(lái)提供了環(huán)境。此外，這個(gè)行業(yè)每年都有新人加入，他們也應該知道一些這方面的知識。

對于那些現在還沒(méi)有本能反應的人來(lái)說(shuō)，標簽就能做到這一點(diǎn)：blink。斷斷續續，一會(huì )兒在那兒，一會(huì )兒不在那兒，就好像它是為了傷害你的眼睛而設計的。這個(gè)標簽是在早期瀏覽器大戰的高潮時(shí)期發(fā)明的，是瀏覽器專(zhuān)用標簽的早期例子，目的是讓Netscape Navigator比當時(shí)剛剛興起的Internet Explorer更有優(yōu)勢。


Flash菜單


在開(kāi)始時(shí)，無(wú)法用JavaScript構建動(dòng)畫(huà)導航菜單（即具有懸停狀態(tài)的菜單），或者在Dreamweaver中稱(chēng)為DHTML，所以用Macromedia Flash創(chuàng )建了帶有動(dòng)畫(huà)按鈕的超炫菜單，并將它們嵌入到制作的每個(gè)網(wǎng)站標題中。


有一段時(shí)間，基于flash的菜單模板是一個(gè)獨立的家庭手工業(yè)，熱點(diǎn)提示：永遠，永遠不要做一個(gè)你不能通過(guò)編輯文本文件來(lái)改變的網(wǎng)站菜單。光是維護成本就令人頭痛不已，搜索引擎也從未掌握在Flash文件中爬行的竅門(mén)。

盤(pán)旋

框架，最初的AJAX

是的，在我們使用JavaScript在漸進(jìn)式web應用程序中加載所有數據之前，所有的工作都是由瀏覽器完成的，想必現在仍然可以。你知道iframes嗎？他們曾經(jīng)有一個(gè)“老大哥”，叫做“框架”，在表格出現之前，我們用它來(lái)做基本的布局。

問(wèn)題是，即使他們允許瀏覽器只更新部分頁(yè)面，而不是加載一個(gè)全新的頁(yè)面（某種程度上），他們也破壞了幾個(gè)基本的瀏覽器功能，包括：

后退和前進(jìn)按鈕；

一般瀏覽器歷史；

將鏈接復制粘貼到網(wǎng)站的特定頁(yè)面更加困難；

重新加載一個(gè)網(wǎng)站肯定有點(diǎn)隨機，通常只會(huì )帶你回到“主頁(yè)”，因為它是。

最終整個(gè)框架集功能被棄用，人們主要使用iframe來(lái)加載嵌入內容，比如YouTube視頻。


圖像按鈕


不久前，平面設計風(fēng)靡全球，促使人們說(shuō)，“等等……那是一個(gè)按鈕嗎？”我可以點(diǎn)擊它嗎？為什么要使用自定義游標呢？“在那之前，所有人都在關(guān)注那些看起來(lái)像3d的按鈕，因為它們很漂亮。聽(tīng)著(zhù)，它始于90年代初，我們對1980年至2005年間發(fā)生的任何事情都不提出質(zhì)疑，只是時(shí)間不同。

當然，CSS3幾乎關(guān)閉了基于圖像的按鈕，當文本被嵌入到圖像中時(shí)，按鈕是不可能管理的，而當它不管理時(shí)，我們不得不使用上千種技巧使它們甚至是半響應的。有人記得做過(guò)一個(gè)按鈕嗎？一個(gè)部分是loooooong PNG，另一個(gè)部分是右邊的角？或者在按鈕的每個(gè)角落都有一個(gè)單獨的PNG？


選框

曾幾何時(shí)，在所有人都開(kāi)始說(shuō)圖像滑塊不好之前，HTML實(shí)際上有一個(gè)內置的元素來(lái)讓東西在頁(yè)面上滑動(dòng)。它被稱(chēng)為大帳篷標簽，在它真正死去之前很久，人們就討厭它了。它是在Internet Explorer中實(shí)現的，以響應標記，而且對您的眼睛的危害也只是稍微好一點(diǎn)。


它被拋棄了，并因過(guò)于分散用戶(hù)的注意力而遭到唾棄。


分隔符分隔器/頁(yè)面


在我們開(kāi)始做正確的布局之前，人們需要一種方法來(lái)分解長(cháng)頁(yè)的文本，使它們看起來(lái)不那么別扭，對于某些人來(lái)說(shuō)，


元素感覺(jué)太平淡了，所以當時(shí)的設計師們就像他們經(jīng)常做的那樣，將注意力轉向了. gif。它們在本質(zhì)上只是單杠，但只要它們是圖像，它們就可以是你喜歡的任意想象。


這是CSS/CSS3的另一個(gè)趨勢，此外，當分隔符在視覺(jué)上比文本更令人興奮時(shí)，可能會(huì )給用戶(hù)帶來(lái)一些沖突。


站點(diǎn)地圖曾經(jīng)是導航的全部和最終部分，在網(wǎng)站擁有自己的搜索功能之前，您可以使用站點(diǎn)地圖來(lái)查找任何給定站點(diǎn)上所需的內容。很簡(jiǎn)單：所有的內容都在那里，你只需要滾動(dòng)。

現在，很多站點(diǎn)都太大或太小，以至于不需要站點(diǎn)地圖作為UI元素。它們通常仍然由許多CMS自動(dòng)生成，但它們用于幫助搜索引擎更快地搜索站點(diǎn)。對于中等規模的網(wǎng)站，這是一個(gè)可以恢復的功能，它不會(huì )傷害任何人。

表布局

表布局一些人在笑話(huà)中嘲笑它，而另一些人則只是在低聲細語(yǔ)中引用它。這是推動(dòng)網(wǎng)頁(yè)設計向前發(fā)展的趨勢，也是一個(gè)不能很快消亡的趨勢。它結合了內聯(lián)樣式、相當多的混亂以及1像素的.gif文件，這些文件以某種方式將布局組合在一起。


它的死亡是因為CSS有浮動(dòng)，雖然這是一個(gè)骯臟的一個(gè)半，它實(shí)際上是更好的。我們使用表的時(shí)間之所以如此之長(cháng)，是因為瀏覽器（咳咳）跟不上CSS支持的速度，但它們最終做到了這一點(diǎn)。

奇怪的是，CSS網(wǎng)格就像有表格一樣，但是好多了。