模板網(wǎng)站:網(wǎng)站表格的設(shè)計(jì)原則

2023-10-26    分類: 網(wǎng)站建設(shè)

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

模板網(wǎng)站:網(wǎng)站表格的設(shè)計(jì)原則

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

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

1. 保持簡短

這個(gè)原則適用于許多事情。減少不必要的內(nèi)容需要一定的時(shí)間,但是這樣可以減輕用戶的負(fù)擔(dān),加快用戶的完成。為了減少a.哪些內(nèi)容可以通過其他方式收集,b.哪些內(nèi)容在未來更容易收集,以及c.直接省略一些內(nèi)容。當(dā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è)輸入框之間的距離相同。如果要詢問兩個(gè)不同主題的內(nèi)容,應(yīng)該將其分為兩個(gè)單獨(dú)的輸入框。

3.輸入框?qū)R

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

4. 按邏輯排序

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

5. 避免占位符文本

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

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

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

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

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

8. 解釋輸入或格式要求

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

9. 避免重置和清除按鈕

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

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

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

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

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

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

廣告

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

成都定制網(wǎng)站網(wǎng)頁設(shè)計(jì)