...

如何設計一個交互好(hǎo)轉化率高的表單

2021-06-19

1、表單标簽需采用合适的展現形式 

根據表單的運用場景,标簽應采用對(duì)應的展現形式,常見的展現形式有以下三種(zhǒng):左标簽、頂部标簽、行内标簽。A. 左标簽在一些網頁表單當中,标簽局左是最常見的一種(zhǒng)形式。左标簽的展示形式給人一種(zhǒng)秩序感,也便于用戶在填寫表單的過(guò)程中快速的辨别标簽内容。左标簽的這(zhè)種(zhǒng)形式一般用于網頁當中,不适合在手機端或者小屏下的移動端出現,因爲小屏幕的尺寸有限,标簽居左會(huì)占用較大的空間,輸入框就(jiù)會(huì)受限。B. 頂部标簽頂部标簽指的是标簽位于輸入框上方,這(zhè)種(zhǒng)形式一般出現在一些移動端當中。頂部标簽可以使輸入框的寬度變大,用戶在填寫信息也可以比較得到完整的展示。但這(zhè)種(zhǒng)布局方式也有一個缺不好(hǎo)的點,就(jiù)是這(zhè)個表單可能(néng)需要滾屏,用戶才可以看完。C. 行内标簽行内标簽常常出現在手機端的注冊界面(miàn)當中,這(zhè)樣的設計可以節省頁面(miàn)空間,所以大部分app的界面(miàn)設計都(dōu)采用這(zhè)樣的設計。當然,部分網站pc端的表單設計中也會(huì)用到這(zhè)種(zhǒng)設計。 

2、英文标簽避免全部大寫 

一些英文界面(miàn)的表單設計,我們要避免标簽的全大寫。全部大寫的标簽容易造成(chéng)閱讀和浏覽上的困難。 

3、特殊标簽需使用合适的輸入框長(cháng)度 

對(duì)于特定的标簽,像驗證碼、郵編這(zhè)樣的标簽,在設計的時(shí)候需要采用合适的輸入框長(cháng)度。畢竟這(zhè)樣的輸入框是用戶可預見的,所以輸入框的長(cháng)度可以不需要太長(cháng)。 

4、複選框排列需注意 

在表單中常出現複選框的設計,這(zhè)樣的情況需要特殊處理。比如在注冊的過(guò)程中,會(huì)有性别的選擇,所以通常設計該表單的時(shí)候我們會(huì)將(jiāng)男女橫排在一行。但是對(duì)于内容多的情況下,就(jiù)建議采用豎排的排序方式。

5、主按鈕和輔按鈕需要明确的區分 

在表單提交的時(shí)候,出現多個按鈕的情況下,需要做明确的區分,這(zhè)樣有利于用戶在操作過(guò)程中方便辨别操作步驟。 

6、提醒文本設計需要明确 

用戶在填寫表單的過(guò)程中,對(duì)于輸入的錯誤信息需要有幫助的提醒文本,對(duì)于較爲複雜的提示文本需要做一個隐藏圖标。 

7、必填項需用*号做好(hǎo)标示 

有些表單内容較多,可以采用*号标注幾個必填項來讓用戶縮短表單的填寫時(shí)間。

8、特殊标簽的可選項設計 

對(duì)于出生年月日、地區等特殊标簽,最好(hǎo)設計成(chéng)可選項,減少用戶的使用成(chéng)本。


一個好(hǎo)的表單設計,需考慮到用戶的方方面(miàn)面(miàn)。而好(hǎo)的用戶體驗還(hái)要盡可能(néng)的簡化操作步驟,全部手動輸入的模式費時(shí)費力,對(duì)用戶來說(shuō)也不是一種(zhǒng)友好(hǎo)的體驗。所以表單的設計,需要滿足界面(miàn)上美感的同時(shí)還(hái)需要考慮到用戶體驗。