技術(shù)資訊
網(wǎng)站的表單設(shè)計要點
2012-08-20 12:29:56
網(wǎng)站的反饋表單有注冊表單在青島網(wǎng)站設(shè)計應(yīng)用比較廣泛,表單的填寫用戶體驗直接關(guān)切到用戶注冊數(shù)量或者客戶反饋的欲望度,一個繁亂且信息量大的表單,相信很少有人原因填寫。下文介紹如果處理這方面的一些問題。
一、如何以用戶視角看post表單?
現(xiàn)在我們把之前的旅行的步驟放到post表單設(shè)計中,我們可以得到如下思路:
從中我們可以發(fā)現(xiàn),似乎發(fā)布前和發(fā)布后這兩個流程,比較容易被忽略。而過程中的設(shè)計點具體應(yīng)該如何做呢?作為用戶出發(fā)看看吧。
二、那么為什么要以用戶的視角呢?
作為設(shè)計師,你是否遇到過這種情況:
· 我們額外加一個填寫項,用來收集用戶信息吧;
· 我們的表單之所以復(fù)雜,是因為我們希望用戶多填寫內(nèi)容,這些內(nèi)容都是有用是;
· 我們的表單應(yīng)該在這最重要的一步出現(xiàn),這樣就能讓更多的用戶看到它…….
作為用戶填表單時,你是否這樣想?
· 我們填寫表單只是為了達(dá)到我想要的目的,才不是為了你們收集信息;
· 如果可以,我希望填寫更少的信息或者不用填寫表單,來達(dá)到同樣的目的;
· 在我想做A事情的時候,我根本不想看到B表單…….
以上的情境可能有些夸張,但是不可否認(rèn)的是,有時候我們做表單設(shè)計的時候,并沒有從用戶的角度出發(fā),看他們想要的是什么,而是從我們所在的產(chǎn)品端的角度,讓用戶去做我們想要他們做的事情。
三、作為用戶出發(fā)看表單
思路已經(jīng)有了,那讓我們作為用戶出發(fā)探索一下post表單吧。
發(fā)布前:
作為用戶,我會抱著一定目的,來找我需要的工具——post表單。
首先,我要從哪進(jìn)入表單?
這個問題是針對用戶在什么樣的情境下會被引導(dǎo)到post表單,看下這個例子吧:
上圖的post表單安排在你對網(wǎng)站有個基本認(rèn)識,并且有意愿聯(lián)系后出現(xiàn),而且這樣的從屬關(guān)系讓人很容易接受。
上圖中的post入口都安排在賬號相關(guān)的區(qū)域,而不是業(yè)務(wù)相關(guān)的區(qū)域,沒有足夠的理由說服用戶從此來發(fā)布。
然后,它跟我的目的是否相符?
表單的開頭應(yīng)該向用戶清楚的傳達(dá),該表單是做什么的,是否符合用戶的期望,如果不,那么用戶應(yīng)該去哪?
上圖的表單很清晰的向用戶傳達(dá)了目的,并提供了快速逃離出口。
圖四中一些簡要的介紹,會讓用戶對表單有個大致的認(rèn)識,對復(fù)雜的信息有個心里準(zhǔn)備,并且更能確認(rèn)自己的目的。
而上圖個頁面,用戶一進(jìn)來印入眼簾的是長篇的規(guī)則介紹和各種功能入口,破壞了之前的引導(dǎo)傳達(dá)給用戶的印象,作為新用戶的話,很難確認(rèn)這里就是自己要找的地方。
發(fā)布中:
填寫表單本身就是一件枯燥的事情,我希望能盡可能減少填寫時的痛苦。
第一步,進(jìn)入表單后,我希望看見干凈簡潔的頁面。(整體感受)
這點雖然不能用數(shù)據(jù)量化,但是對用戶的影響卻不容忽視。
上圖是改版前后的對比,能很明顯的對比出頁面的清爽與否,而且在數(shù)據(jù)上,改版后的也有較為明顯的提升。
第二步,填寫表單前,我希望較長的表單能夠分步驟展現(xiàn)(填寫方式)
較長的表單比較容易嚇跑用戶,而清楚的步驟能夠激勵用戶的填寫欲望。但是使用進(jìn)度條的時候應(yīng)該注意,是否能起到作用。
下圖的表單,把填寫信息單獨作為一個步驟,用戶大部分時間都花在了第二步,其實并沒有起到多少簡化表單的作用。
第三步,開始填寫時,我希望填寫的內(nèi)容一目了然(信息布局)
填寫表單時,最好讓用戶自己知道怎么填,所以信息的布局是否一目了然很重要。這一點主要從一下幾個方面體現(xiàn):
1)信息分類
2)信息排布的順序
3)優(yōu)先級的區(qū)分
很清楚的傳達(dá)給用戶:基本信息與詳細(xì)信息的區(qū)別;必填與非必填的區(qū)別;
再看下面這個例子:產(chǎn)品屬性與產(chǎn)品名稱等信息沒有區(qū)分開,而且順序與優(yōu)先級也不對,造成用戶困擾。
第四步,填寫過程中,我希望盡量避免不必要的問題(內(nèi)容)
從商業(yè)的角度來看,當(dāng)然是用戶填的越多越好,但對于用戶來說,填寫表單只是為了達(dá)到他的目的,如果能達(dá)到同樣的效果,當(dāng)然是填的越少越好。
以上的例子很好的說明了什么是讓用戶達(dá)到目的的最基本填寫。其實上圖中的公司信息,注冊完成以后有專門的流程讓用戶填寫,沒有必要一定要放在注冊流程。
第五步,填寫時以及填寫完,我需要友好的提示和反饋。(引導(dǎo))
這一點對于用戶是否能完成表單填寫非常重要。比如說,很多表單以對話的形式與用戶交流,以人性化的對話代替機(jī)械的告知,會給用戶的心理帶來些許安慰。
反饋傳達(dá)出的是“請去做”的意思
反饋傳達(dá)出的是“錯誤”的意思
如果你是用戶,看到這兩種反饋,你的感受會有什么樣的區(qū)別呢?
發(fā)布后:
我想看下我發(fā)布的東西是否有問題,有問題的話應(yīng)該怎么辦?
現(xiàn)有的表單是無法在發(fā)布后給用戶展示效果的,而且發(fā)布后直接進(jìn)入審核,審核結(jié)束之前用戶是無法修改的,這讓很多用戶頭疼。而且發(fā)布后的體驗,直接關(guān)系到下一次的發(fā)布。
多站在用戶較多考慮表單填寫的體驗,避免信息提交報錯導(dǎo)致的數(shù)據(jù)緩存丟失,或者填寫數(shù)據(jù)保存失敗等問題,站在用戶較多,盡量簡化一些填寫流程和步驟,讓用戶能夠快速便利的完成表單填寫。
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網(wǎng)品牌數(shù)字化
- [2023-05-06 10:32:26] 青島網(wǎng)站建設(shè)公司,高端網(wǎng)站定制,一站式網(wǎng)站服務(wù)——力圖數(shù)字科技
- [2023-04-27 13:47:54] 高端定制網(wǎng)站建設(shè)——從滿足預(yù)期到走向卓越
- [2023-04-11 09:17:49] H5頁面設(shè)計開發(fā)——移動端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數(shù)字科技配套網(wǎng)站服務(wù)支持
- [2021-05-18 10:14:11] 青島網(wǎng)站建設(shè)的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網(wǎng)建設(shè)項目
- [2021-03-05 10:34:45] 移動互聯(lián)時代房地產(chǎn)行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢?為什么要開發(fā)微信小程序?
- [2021-01-08 17:28:04] 網(wǎng)站建設(shè)最容易忽略的人性化設(shè)計
- [2020-12-16 16:55:32] 建設(shè)一個常規(guī)的公司網(wǎng)站建設(shè)成本大概是多少?
延伸閱讀
- [2012-07-02 22:45:33] 網(wǎng)頁的交互設(shè)計
- [2012-11-20 19:45:31] DEDE無簡略標(biāo)題時顯示完整標(biāo)題
- [2014-12-22 17:24:46] 你對網(wǎng)站的未來是怎么樣規(guī)劃?
- [2012-11-20 19:35:40] Dede僅限會員發(fā)表評論
- [2013-12-09 23:35:57] 圓形效果在界面設(shè)計上的應(yīng)用與分析
- [2014-11-10 21:59:32] 如何提高網(wǎng)站的用戶體驗
- [2012-07-22 19:04:16] dede列表字段有則顯示無則不顯示
- [2011-11-20 21:31:05] 如何做好網(wǎng)站內(nèi)鏈的優(yōu)化?
- [2014-11-28 21:51:04] 網(wǎng)站優(yōu)化的外鏈應(yīng)該怎么發(fā)
- [2012-05-11 02:32:47] dede 后臺插入附件
- [2015-03-26 16:49:53] 服務(wù)器不支持中文圖片名字或者中文路徑的解決辦法
- [2015-03-16 09:08:12] 網(wǎng)站登陸頁面應(yīng)遵循的原則?
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計解決方案 科技企業(yè)網(wǎng)站設(shè)計解決方案 電子家電網(wǎng)站設(shè)計解決方案 食品行業(yè)網(wǎng)站設(shè)計解決方案 集團(tuán)公司網(wǎng)站設(shè)計解決方案 企事業(yè)單位網(wǎng)站設(shè)計解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計解決方案 健身運動網(wǎng)站設(shè)計解決方案 美容與化妝品網(wǎng)站設(shè)計解決方案 建筑設(shè)計行業(yè)網(wǎng)站設(shè)計解決方案 物流行業(yè)網(wǎng)站設(shè)計解決方案
TAGS關(guān)鍵字
網(wǎng)站推廣 外貿(mào)網(wǎng)站建設(shè) 青島高端網(wǎng)站設(shè)計公司哪家好 微信營銷的優(yōu)勢 力圖 微官網(wǎng) 微官網(wǎng)帶來的好處 網(wǎng)站設(shè)計資訊 H5 企業(yè)建站 青島網(wǎng)站建設(shè)公司哪家好 H5專題頁面 交互設(shè)計 網(wǎng)站設(shè)計 網(wǎng)站規(guī)劃 膠南網(wǎng)站建設(shè)公司 力圖數(shù)字科技 青島SEO robots 英文網(wǎng)站建設(shè) 青島網(wǎng)站營銷 H5定制設(shè)計 青島高端網(wǎng)站建設(shè) 良好的導(dǎo)航 互聯(lián)網(wǎng) 網(wǎng)站品牌 網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè) 集團(tuán)性網(wǎng)站 SEO優(yōu)化 青島網(wǎng)絡(luò)公司