當(dāng)設(shè)計(jì)問(wèn)題與網(wǎng)頁(yè)表格的設(shè)計(jì)相關(guān)時(shí)，你知道設(shè)計(jì)的原則是什么嗎?你是否可以正確地設(shè)計(jì)模板網(wǎng)站的網(wǎng)頁(yè)表格呢?下面就和創(chuàng)新互聯(lián)一起來(lái)看看我們網(wǎng)站表格設(shè)計(jì)原則吧。

良好的表格設(shè)計(jì)可以使用戶(hù)更快、更準(zhǔn)確地完成表格。研究表明，當(dāng)表格設(shè)計(jì)遵循基本的可用性原則時(shí)，用戶(hù)準(zhǔn)確填寫(xiě)表格的時(shí)間幾乎是不遵循可用性原則的用戶(hù)填寫(xiě)表格時(shí)間的兩倍。

什么樣的形式才是好的設(shè)計(jì)?創(chuàng)新互聯(lián)認(rèn)為這可能與許多因素有關(guān)，如表的長(zhǎng)度、表的內(nèi)容和要收集的數(shù)據(jù)等。實(shí)際設(shè)計(jì)應(yīng)根據(jù)具體情況分析。但是下面的可用性基本原則可以幫助你避免很多問(wèn)題。

1. 保持簡(jiǎn)短

這個(gè)原則適用于許多事情。減少不必要的內(nèi)容需要一定的時(shí)間，但是這樣可以減輕用戶(hù)的負(fù)擔(dān)，加快用戶(hù)的完成。為了減少a.哪些內(nèi)容可以通過(guò)其他方式收集，b.哪些內(nèi)容在未來(lái)更容易收集，以及c.直接省略一些內(nèi)容。當(dāng)你縮短表格的長(zhǎng)度時(shí)，表格的轉(zhuǎn)化率就會(huì)增加，這具有非常重要的商業(yè)意義。

2. 標(biāo)簽對(duì)應(yīng)于輸入框

在模板網(wǎng)站中標(biāo)簽應(yīng)靠近其對(duì)應(yīng)的輸入框，該輸入框可以直接位于移動(dòng)端輸入框的正上方，并與PC端輸入框平行。一定要避免那些容易產(chǎn)生歧義的空格，例如標(biāo)簽和兩個(gè)輸入框之間的距離相同。如果要詢(xún)問(wèn)兩個(gè)不同主題的內(nèi)容，應(yīng)該將其分為兩個(gè)單獨(dú)的輸入框。

3.輸入框?qū)R

如果輸入框位于多個(gè)列中，則表的垂直動(dòng)量將被打破。所有輸入框應(yīng)該對(duì)齊到同一列，而不是讓用戶(hù)適應(yīng)凌亂的布局。

4. 按邏輯排序

表格上的標(biāo)簽順序和選項(xiàng)應(yīng)按邏輯順序排列，如“姓名、性別、手機(jī)號(hào)碼……”或“一日游、兩日游、三天游……”。當(dāng)然，這里也要考慮到用戶(hù)的使用頻率，盡量提出用戶(hù)選擇多的選項(xiàng)。

5. 避免占位符文本

設(shè)計(jì)師通常喜歡使用占位符文本，因?yàn)樗梢杂懈玫囊曈X(jué)效果。然而，占位符文本通常會(huì)導(dǎo)致許多額外的問(wèn)題，創(chuàng)新互聯(lián)認(rèn)為我們應(yīng)該盡量避免這些問(wèn)題。

6. 輸入表格與輸入內(nèi)容匹配

如果只有兩個(gè)或三個(gè)選項(xiàng)，不要使用下拉列表，直接使用單選按鈕更合適。文本輸入框的大小應(yīng)與所需的文本輸入長(zhǎng)度匹配。例如，姓名列通常不超過(guò)四個(gè)單詞，而移動(dòng)電話(huà)號(hào)碼通常是11位數(shù)字。

7. 區(qū)分可選內(nèi)容和所需要的內(nèi)容

我們應(yīng)該盡可能減少選擇。如果某些內(nèi)容確實(shí)是必要的，但只適用于部分用戶(hù)，請(qǐng)給予解釋?zhuān)灰`導(dǎo)大多數(shù)用戶(hù)。將表格中的選項(xiàng)限制為一個(gè)或兩個(gè)，并清楚地將它們標(biāo)記為可選。

8. 解釋輸入或格式要求

如果輸入需要特定的格式或內(nèi)容，請(qǐng)給出準(zhǔn)確的解釋。不要讓用戶(hù)猜測(cè)你的請(qǐng)求。如下圖所示，直到用戶(hù)密碼格式錯(cuò)誤，網(wǎng)站才給出準(zhǔn)確的要求，顯然違反了這一原則。正確的方法應(yīng)該是在用戶(hù)輸入時(shí)給出詳細(xì)的格式要求。

9. 避免重置和清除按鈕

重新設(shè)置或清除寫(xiě)好的內(nèi)容常常給用戶(hù)帶來(lái)不必要的麻煩。如果是收集敏感信息，例如財(cái)務(wù)信息，我們應(yīng)該為放棄填寫(xiě)并希望刪除個(gè)人信息的用戶(hù)提供一個(gè)“取消”按鈕。但是，應(yīng)該注意的是，“取消”按鈕應(yīng)該比“提交”按鈕更不可見(jiàn)，以避免意外點(diǎn)擊。

10. 提供可見(jiàn)的和特定的錯(cuò)誤信息

我們應(yīng)該以各種方式提示用戶(hù)錯(cuò)誤，不僅僅是顏色，還有粗體和繪圖錯(cuò)誤區(qū)域，以確保用戶(hù)不會(huì)忽略錯(cuò)誤信息。在這件事上，我們不能太狡猾。此外，我們應(yīng)該保留用戶(hù)以前的輸入錯(cuò)誤，以便用戶(hù)可以方便地修改它們。

看完這些，相信你對(duì)模板網(wǎng)站表單設(shè)計(jì)的原則已經(jīng)有所了解。創(chuàng)新互聯(lián)關(guān)于網(wǎng)站表格設(shè)計(jì)原則的相關(guān)介紹就說(shuō)到這里，希望對(duì)大家有幫助，如對(duì)文章內(nèi)容有疑問(wèn)可以來(lái)電咨詢(xún)我們或者在官網(wǎng)給我們留言。

當(dāng)前題目：模板網(wǎng)站:網(wǎng)站表格的設(shè)計(jì)原則
瀏覽地址：http://www.rwnh.cn/news20/287870.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、定制網(wǎng)站、網(wǎng)站排名、商城網(wǎng)站、域名注冊(cè)、微信小程序

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)