以眼動追蹤技術探討響應式網頁之物件位置排列

10.29428/9789860544169.201801.0108

王俊嘉；楊宗誌

響應式網頁設計 ； 眼動追蹤 ； 網頁物件 ； 凝視時間 ； 視覺軌跡 ； Responsive Web Design ； Eye Tracker ； Web Page Object ； Gaze Duration ； Vision Tracker

NCS 2017 全國計算機會議

2017（2018 / 01 / 01）

572 - 577

繁體中文

隨著行動載具的普及與行動上網通訊技術的成熟，全球對於網路的依賴性日益攀升，讓國內外業者紛紛搶進行動商務的無限商機潛能。網頁設計者亦不得不重新考量為智慧型手機等小型顯示畫面的行動裝置設計更合宜的網站內容。隨著｢不應該為載具客製化網頁版型｣的理論而誕生的｢響應式網頁設計(Responsive Web Design, RWD)｣網頁設計模式，讓網頁設計者在設計網站時僅需設計一個版型即可同時兼容各個裝置的顯示。本研究以響應式網路訂房網站畫面為實驗素材，透過眼動追蹤技術紀錄與分析受測者觀看RWD法則所設計的網頁內容時，其不同網頁物件排列方式的關注區域位置(Regions of Interest, ROIs)是否產生差異，藉此找出應用RWD技術所設計的行動商務網站應呈現何種方式的物件排列介面，較能符合使用者的視覺動線，讓使用者快速完成其瀏覽目的。

With the popular commodities of mobile devices and the maturity of information and communication technology (ICT), smartphones with internet feature have become necessary to daily life. Since people starts to rely on the network, not only domestic but also foreign industries have begun to pay attention to boundless business opportunities of mobile commerce. Thus, the web designer needs to organize a well-defined website content to meet the necessity of smaller display. Based on the 'Not Customized Website Layout by its Capacity 'theory', Responsive Web Design (RWD) rules have been proposed and formed to conduct the website design. The web designers do not need to worry the layout display on other devices anymore, construct one model layout can be used in many devices at the same time. In this study, we used a room reservation situation as our RWD subject. Through the records of the eye movement captured by eye tracker, we examined whether the item arrangements would influence the users' regions of interest (ROIs) while the participants were viewing the web page by RWD rules design. According to the results of the experiment, the study showed that there are no significant differences of total contact time (TCT) and number of fixations (NOF) on item arrangements and there are significant differences of total time tracked (TTT) and TCT on the layout of menu representations.