下面是一些設計中需要注意的細節:
一、標注鍵盤類型
根據輸入框的不同數據類型，為用戶提供不同的鍵盤標注，比如：輸入手機號是標注數字鍵盤等等，用戶會偏愛那些根據輸入內容提供了合適鍵盤的應用。
二、考慮鍵盤喚起狀態
左圖：這樣布局看起來沒問題，但沒有考慮到鍵盤調起的狀態，因為鍵盤調起來的時候登錄按鈕會被擋住，操作成本就會增加。
中圖：不管鍵盤有沒有被喚起，頁面的布局都不會改變。
右圖：當鍵盤喚起時，頁面向上提，漏出登錄按鈕。
三、減少用戶輸入
（1）增加一次性清除按鈕：當輸入框內容不為空的時候獲得焦點，顯示一次性清除內容的按鈕，而不需要用戶一直按刪除鍵，一個個字符刪。
（2）智能預設：需要填寫、選取的表單最好有預設的初始值或者內容填充在其中，可以是建議，也可以是相關推薦，這樣可以幫助用戶更準確、高效地填寫信息。常見的使用場景有搜索聯想輸入，地址定位等。
四、輸入提示
數據的呈現方式多種多樣，所以，當你在設計輸入框的時候，應當與用戶輸入信息的類型、格式相互匹配。
選中輸入框準備輸入的時候，應當提供清晰的視覺提示，這樣讓用戶明確知道自己的位置，而不是迷失在茫茫表格中，這種細微的反饋會讓用戶更有掌控力。比如：外發光的輸入框，或者閃動的光標，變顏色、加粗等都行。金額輸入：當用戶輸入的金額超過千時，出現最高分位提示，每多輸入一位，最高分位隨之增加。通過設計輸入框格式來“格式化”輸入內容，讓用戶可以清楚的知道應該輸入哪種類型、多少位。對于手機的輸入設置成3-4-4格式，身份證的輸入設置成6-8-4格式，便于用戶能夠清楚及時了解到自己輸入的號碼有無缺漏。【對于身份證與手機，保存后可將中間幾位數變成*號，畢竟是敏感信息】輸入框的輸入記錄：對部分輸入框的內容進行記錄，比如登錄用戶名、手機號，無需用戶二次登錄時輸入，提高輸入速率，優化用戶體驗。
五、必要的說明
（1）不要過于依賴占位文本和標簽。
一旦在輸入框里輸入內容，占位文本就無法被看到了——一則用戶無法檢查輸入的內容是否正確；二則當用戶在輸入框中看到提示文本，他們有可能認為這個文本框已被預填成功從而忽略它。
可以使用浮動標簽，當用戶填寫當前文本框時，行內標簽即浮動到文本框頂部，這樣可以使用戶隨時確認他們填寫的內容是否正確。
一般當屏幕中多于兩個輸入框時，行內標簽就不適用了。
具體標簽說明可查看：http://www.woshipm.com/pd/931662.html
來源：www.woshipm.com/ucd/361227.html
（2）加入文字說明：比如：專業性強，大眾可能不清楚的文本解釋。
例如：銀行轉賬不是及時到賬，需要兩小時，金額每天有上限，并且和所剩的余額相關。如果這些是在用戶輸入完才告知，或者報錯，那么這個鍋用戶當然不愿意背。
再比如：安全隱私或者金錢相關，有心理顧慮，可以承諾不會對用戶造成損失，或者找背書，該方案已經通過XXX安全認證。消除顧慮之后才能順利進行下一步。
（3）幫助信息（或相關文字）應當出現在需要的地方。
比如：表單中用文字說明為何需要填寫信用卡號，以及生日日期填寫之后的福利，又或者“服務條款”鏈接的存在。它們適時地出現，幫助用戶解釋了一些令人困惑的問題。一般說來，這類幫助信息最好不要超過100字。
來源：www.woshipm.com/ucd/361227.html
六、清晰的反饋
關于填寫錯誤的描述應該非常清晰，比如：注冊時密碼填寫，不要說密碼安全性過低，而要說——碼必須超過8位，或者密碼必須包含大小寫和數字。
注冊填寫手機號，當提示用戶手機號已被注冊時，應提供跳轉登錄的入口。
七、及時的驗證
（1）在用戶填完內容后立刻告知用戶輸入內容是否正確，而不是等提交后才提示。
（2）實時的頁內校驗可以馬上告知用戶輸入的正確性，幫助用戶及時改正，無需等到點擊提交按鈕。如果只有一個錯誤要修正，那就很容易，能降低用戶放棄的可能性。
來源：www.woshipm.com/ucd/361227.html
八、輸入限制問題
對于輸入框，當文字只輸入一行的時候，不會有什么問題，但輸入多行的時候，如果輸入框對字數有限制，而你沒有把規則告訴用戶，那用戶一定會吐糟。
（1）微信個性簽名會在輸入框的右下角告訴你還可以輸入多少字，5行字以內，輸入框會自動向上撐開；超過5行時輸入框大小不變動，5行以上的文字被遮擋住。
但微信這里有個細節體驗不是很好，因為遮擋住的內容完全看不見。這個點唱吧的聊天界面就做得比較好，被擋住的文字會露出半行，讓用戶知道原來上面還有字。
（2）發布微博的時候，會在右下角告訴你已經輸入多少文字，如果超過140字后，數字的顏色會變成橙色，起到警示作用。
（3）知乎提問界面，當離限制字數差10個字以內時，提示還差幾個字。當輸入超過限制字數時，直接提示已超過多少個字。
九、移動端自查清單
這個輸入框真的是必須有的嗎？
輸入框的文字描述在它的上方嗎？（不在里面，也不在下面）
這個輸入框是必填的（*）還是選填的？
有沒有把輸入框里的占位符都去掉？
輸入框是否足夠大，以便完整顯示那些最有可能出現的輸入內容？
當鍵盤出現的時候，輸入框是否在橫屏和豎屏兩個模式下都能被看到？
輸入框是否有合適的默認值？任何可用的歷史記錄值？用戶經常使用的值？
能不能用手機的特有功能（攝像頭，GPS，語音，聯系人）來填充呢？
能不能根據其他信息幫助用戶得出要填的值（例如，根據郵政編碼，或者優惠券輸入碼來推測用戶所在的地區）？
是否支持直接復制并粘貼到輸入框內？
適合這個輸入框的鍵盤是哪個類型的？（譯注：如英文鍵盤還是數字鍵盤）
能不能根據前面輸入的字符進行自動聯想或自動匹配？對姓名、地址和電子郵件地址，不啟用自動更正。
允許單詞拼寫錯誤或是縮寫嗎？
允許用戶以任何格式輸入信息嗎？（譯注：如信用卡號、電話號碼里的「–」符號）可以把用戶輸入的各式信息自動轉換為統一格式。
本文由@二O一七原創發布，未經作者許可，禁止轉載。
題圖來自網絡
Normal
0
7.8 磅
0
2
false
false
false
EN-US
ZH-CN
X-NONE
/* Style Definitions */
table.MsoNormalTable
{mso-style-name:普通表格;
mso-tstyle-rowband-size:0;
mso-tstyle-colband-size:0;
mso-style-noshow:yes;
mso-style-priority:99;
mso-style-parent:;
mso-padding-alt:0cm 5.4pt 0cm 5.4pt;
mso-para-margin:0cm;
mso-para-margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:10.0pt;
font-family:Calibri,sans-serif;}
更多關于云服務器，域名注冊，虛擬主機的問題，請訪問三五互聯官網：www.shinetop.cn