美觀(guān)的登錄頁(yè)面將帶來(lái)很好轉化率，那么如何是登錄也面更加美觀(guān)與高效呢？

譯者：L_Lainey

對于設計師來(lái)說(shuō)，工作中的挑戰之一就是創(chuàng )建一個(gè)看起來(lái)不錯，而且還能有很好轉換率的登錄頁(yè)面。您可以理解為什么這是案例設計的目標和業(yè)務(wù)目標常常是不一致的。

當產(chǎn)品相關(guān)人員創(chuàng )建登陸頁(yè)時(shí)，他們更專(zhuān)注于布局，基本原則和信息層次。然而，設計師最關(guān)心的是用戶(hù)體驗，顏色，排版和風(fēng)格元素，有助于建立強大而有效化的準則。

轉化最優(yōu)設計本質(zhì)上希望使這兩個(gè)思想學(xué)派相一致。因此，不僅要專(zhuān)注于UX，還要強調勸導和轉化，同時(shí)將它與將導致更好的網(wǎng)站的美學(xué)選擇合并。

1.選擇正確的布局

產(chǎn)品經(jīng)理非常了解，頁(yè)面上不同元素的布局會(huì )影響轉化率。這就是為什么他們要求設計師將最重要的信息放在首要位置，并從檢出頁(yè)面中刪除導航菜單，即使這個(gè)操作違反了UX設計的原則。

但是，您可以采用一些理論原則來(lái)創(chuàng )建轉化優(yōu)化的著(zhù)陸頁(yè)，而不會(huì )影響用戶(hù)體驗：

1）按照三分法規定設計

如果你曾經(jīng)拍過(guò)攝影課，你可能聽(tīng)說(shuō)過(guò)三分之一的規則。這個(gè)規則越少越好，這個(gè)規則說(shuō)，任何形象在分為 9 個(gè)相等的部分時(shí)，會(huì )有更多的緊張和精力。

來(lái)自維基百科的這個(gè)GIF說(shuō)明它完美：

維基百科 CC BY-SA 2.5

三分之一的規則是攝影師并不總是把他們的主題放在框架中的原因。世界上最著(zhù)名的一些照片遵循這一規則。

這里有一個(gè)例子：

人物在九分之一的右上角

三分法則不僅適用于照片 – 它也適用于登錄頁(yè)?？纯碬ebDAM的這個(gè)登陸頁(yè)面：

或者來(lái)自Inbound Emotion的一個(gè)：

Inbound Emotion

根據設計理論和眼睛定視來(lái)看，3× 3 網(wǎng)格線(xiàn)的交點(diǎn)在任何頁(yè)面上都得到最多的關(guān)注。因此，放置在這些網(wǎng)格線(xiàn)上的元素也會(huì )更受關(guān)注。

“使用三分法規則來(lái)設計的布局視覺(jué)看上去會(huì )更舒適?！?/p>

2）按照菲茨法則的重要內容

訓練人眼遵循層次結構。我們的眼睛自然地從大到大的元素發(fā)展。尼爾森進(jìn)行的眼睛跟蹤研究也顯示：

在這里，用戶(hù)比標題更多地集中在人物圖像上，并且他們的眼睛比較小的段落文字更長(cháng)的字體。

與此相似的另一個(gè)原理是菲茨定律。最初由心理學(xué)家保羅·菲茨（Paul Fitts）在 1954 年制定的描述人機交互的方法，該法規定用戶(hù)移動(dòng)到屏幕上對象的速度是對象的接近度（與用戶(hù)）的比例及其大小的函數。

在數學(xué)上，這表示如下：

結論：目標越大，完成點(diǎn)擊越快，時(shí)間越短。同樣地，目標越近，指向越快，完成點(diǎn)擊時(shí)間越短。也就是說(shuō)，定位點(diǎn)擊一個(gè)目標的時(shí)間，取決于目標與當前位置的距離，以及目標的大小。