域名預(yù)訂/競(jìng)價(jià)，好“米”不錯(cuò)過(guò)

默認(rèn)樣式，就是最原生態(tài)的樣式。就像大家經(jīng)常用的按鈕或者藍(lán)色有下劃線的超鏈接。本文，潛行者m將從兩個(gè)元素來(lái)討論默認(rèn)樣式在設(shè)計(jì)中的應(yīng)用。

超鏈接的默認(rèn)樣式

超鏈接的默認(rèn)樣式 超鏈接是網(wǎng)頁(yè)中最常用最基礎(chǔ)的元素，可以說(shuō)是必不可少的。我們?cè)O(shè)置超鏈接，也是希望人們?nèi)c(diǎn)擊，去使用它。那么我們拿什么讓人們知道，這是一個(gè)超鏈接呢?你可以在旁邊說(shuō)，這里有個(gè)超鏈接，快來(lái)點(diǎn)擊我。但是，當(dāng)人們看到這幾個(gè)字的時(shí)候，是需要思考的，實(shí)際情況下，人們是不想思考的。所以，我們?cè)O(shè)計(jì)的目的，就是讓人們一看上去，就覺(jué)得這是一個(gè)可以點(diǎn)擊的超鏈接。這里幾個(gè)超鏈接，我分別為他們加上了樣式，請(qǐng)看下圖：

請(qǐng)你告訴我，這里面究竟哪一個(gè)才是可以點(diǎn)擊的超鏈接?很顯然，第一個(gè)超鏈接是默認(rèn)樣式，這種藍(lán)色下劃線的樣式，已經(jīng)深入人心，任何一個(gè)經(jīng)常上網(wǎng)的朋友，看到這個(gè)就知道它是一個(gè)可以點(diǎn)擊的超鏈接。但是有個(gè)非常明顯的問(wèn)題，這種藍(lán)色下劃線的樣式實(shí)在是太丑了。而且和我的設(shè)計(jì)風(fēng)格不相似。那么，我們就可能會(huì)考慮后面三種。

現(xiàn)在，我們的任務(wù)就變成了，如何讓后面的這三個(gè)超鏈接，變得讓人以為這是一個(gè)可以點(diǎn)擊的超鏈接。這時(shí)，我們需要結(jié)合具體的文境來(lái)說(shuō)。請(qǐng)看下面這張圖，我已經(jīng)把上面這三個(gè)超鏈接加入了文章中：

這是比較常見(jiàn)的文章環(huán)境，當(dāng)超鏈接在文章中時(shí)，我們就會(huì)發(fā)現(xiàn)一些東西?，F(xiàn)在請(qǐng)你告訴我，這四個(gè)鏈接的位置以及究竟哪一個(gè)鏈接可以點(diǎn)擊?很顯然，第一個(gè)下劃線的可以點(diǎn)擊。然后紅色、藍(lán)色鏈接也可以輕易找到，但是黑色的卻不見(jiàn)了。因?yàn)樗臉邮胶臀恼碌囊粯印?/p>

當(dāng)我們拋開(kāi)第一個(gè)，請(qǐng)你再告訴我，究竟哪個(gè)是可以點(diǎn)擊的超鏈接?很顯然，是紅色后面的藍(lán)色超鏈接，因?yàn)樗{(lán)色是超鏈接的默認(rèn)顏色，是標(biāo)志性的顏色，所以我們會(huì)認(rèn)為藍(lán)色是可以點(diǎn)擊超鏈接。如果排除藍(lán)色鏈接，你還會(huì)點(diǎn)擊什么?這時(shí)候，你會(huì)發(fā)現(xiàn)文中突然黑字里面出現(xiàn)了一個(gè)紅色超鏈接。這是你的大腦會(huì)進(jìn)行短暫的思考，這個(gè)紅色超鏈接是什么，為什么別的都是黑色的，它是紅色的?它是不是有特殊的功能，是不是可以點(diǎn)擊?要不我把鼠標(biāo)移動(dòng)上去，看看吧。

當(dāng)我們把鼠標(biāo)移動(dòng)上去之后，發(fā)現(xiàn)鼠標(biāo)變成了小手狀，紅色還變了色，而且還加了下劃線。OK，這個(gè)就是可以點(diǎn)擊的超鏈接了。

至于黑色超鏈接，潛行者m就直接找不到了，碰巧鼠標(biāo)移動(dòng)到什么，可能會(huì)變成小手。但是一般人是無(wú)法注意到了。

通過(guò)這個(gè)案例，我們可以分析出，超鏈接應(yīng)當(dāng)如何定義：

盡可能的使用默認(rèn)的藍(lán)色，甚至加上下劃線。如果與風(fēng)格不符，請(qǐng)使用與其他文字差別較大的色彩來(lái)表示，這是一段與眾不同的文字，它有特殊的含義。

當(dāng)鼠標(biāo)移動(dòng)上去的時(shí)候，請(qǐng)定義：hover，讓其進(jìn)行變色，并且加上下劃線，因?yàn)檫@是一個(gè)超鏈接默認(rèn)的樣式，經(jīng)過(guò)這樣處理之后，能夠讓人深信不疑的認(rèn)為這是一個(gè)超鏈接。

如果你無(wú)法合理的配色或者你的作品無(wú)法使用多種色彩，請(qǐng)嘗試讓字體變大或者變小或者傾斜，讓超鏈接變得與眾不同，這樣就會(huì)讓人產(chǎn)生疑問(wèn)。

如果你無(wú)法比較合理的完成上面三條，請(qǐng)不要使用默認(rèn)樣式。

按鈕的默認(rèn)樣式

按鈕也是使用比較廣泛的網(wǎng)頁(yè)元素，通常用于表單提交，或者其他需要點(diǎn)擊的地方。通常有以下三種形式的定義

第一種就是默認(rèn)情況下的，而第二種只是簡(jiǎn)單的個(gè)邊框，使其去掉默認(rèn)樣式平面化，第三中則可以代表使用圖片背景的自定義按鈕。

當(dāng)你第一眼看到這三個(gè)按鈕的時(shí)候，很顯然，第一個(gè)是最想按鈕，并且可以讓人產(chǎn)生點(diǎn)擊欲望的按鈕。除了第一個(gè)之外的后面兩個(gè)呢?這里需要注意一下，第三個(gè)是有一個(gè)變色處理的，當(dāng)鼠標(biāo)移動(dòng)到上面，會(huì)變成這樣：

默認(rèn)的按鈕樣式以及滿足不了我們網(wǎng)站的風(fēng)格，所以我們目前的任務(wù)，就是讓后面兩個(gè)按鈕，變得像可以點(diǎn)擊的按鈕。我們主要來(lái)分析一下，為什么后面兩個(gè)按鈕不像前面那個(gè)可以點(diǎn)擊的按鈕，有什么特點(diǎn)和區(qū)別。

1，外觀要像一個(gè)按鈕，其中第三個(gè)要比第二個(gè)更像按鈕，因?yàn)樗菆A角、橢圓形的，它要比直來(lái)直去的方框更容易給人以按鈕的感覺(jué)。

2，要有3d突出感，按鈕是一個(gè)突出的東西，給人一種3d突出的感覺(jué)更讓人容易相信這是一個(gè)可以點(diǎn)擊的按鈕，例如淘寶購(gòu)買(mǎi)按鈕

可以通過(guò)添加陰影或者漸變等,制造這種突出的效果。

3，要有變換特效，及時(shí)的和瀏覽者溝通，告訴他們，這是一個(gè)可以點(diǎn)擊的按鈕。

4，如果你的設(shè)計(jì)，無(wú)法很好的完成上面說(shuō)的三點(diǎn)，請(qǐng)使用默認(rèn)樣式。

        原文：

申請(qǐng)創(chuàng)業(yè)報(bào)道，分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處，共同探討創(chuàng)業(yè)新機(jī)遇！