圖1.1所示,簡單表單的眼動跟蹤數據圖突出了清晰瀏覽線的重要性。本例中,標簽、輸入框及主要動作按鈕構成主要垂直軸,提供了貫穿表單的單一路徑。
圖1.1? Etre提供的綜合眼動軌跡圖(熱點圖),表明人們填寫一個簡單表單時所看到的表單內容
為了進一步說明這一點,考慮下面兩種表單之間的差別。第二張表單中,從第一個信息點開始一直到主要動作結束,都有清晰的瀏覽線,人們可以看清所用需要快速回顧的信息。第一張則采用不同的視覺處理,完成過程變成了“之”字眼動運動。通過統一布局,采用單一路徑更容易處理表單所提問題。人們關注執行任務,看見表單所用問題并作出答復,從而提高完成率。
圖1.2?? 第一個表單設計中,內容組之間采用有意義的區分,但第二個PayPal表單提供了清晰的完成路徑,人們只需要遵循一條向下的直線
設計良好的瀏覽線能恰當設置問題之間的視覺空間,滿足每對標簽/輸入框之間的平衡。視線能在表單中舒適移動,而不會錯過任何重要信息。空間間隔合適,很大程度上取決于表單風格。但一般而言,最好采用輸入框高度約50%~75%作為問題之間的間隔。
圖1.3問題有節奏的流動需要之間有合適的間隔