網站設計分享-以表格設計為主的內容行銷

要如何打造吸引人的網站內容??今天KPN設計部要分享以表格設計為主的內容應該要注意什么?根據我們做了千千百百個專案經驗,將其珍貴經驗分享給大家:

(1)首先是以表格label tag的左與上的差別, 對于視覺上的影響:

label在左邊較適合簡單的表格

label在上較適合需要輸入較多的表格下使用

但視覺的專注上其實label在上是比較好的方式
參考連結:
http://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php


(2)再來是表格的簡化方向
很多研究都顯示出表單的簡化,可以讓使用者更有意愿填寫


例子1: 藉由郵遞區號直接帶入城市跟區

例子2 : 信用卡號直接判別信用卡類型

例子3 : 密碼確認輸入時,直接判定是否正確-->延伸(4)

參考連結:
http://uxmovement.com/forms/form-field-input-techniques-to-prevent-garbage-output/


(3)因應Google Material Design的使用者體驗
視覺設計上我們可以把表格簡化,但又不影響使用者的習慣,所以新的設計方向是Float Label


參考連結 :

http://www.google.com/design/spec/components/text-fields.html
http://codepen.io/boast/pen/pLjld


(4)最后是APP上提醒password的想法
根據統計82%的人會忘記密碼,購物網站75%的人在忘記密碼下,放棄購買欲望,所以有幾個方式來輔助記憶或是讓使用者打對密碼。


例子: 一個按鈕顯示隱藏密碼,且明確告知現在是Show password的狀態

以上