本研究旨在找出響應式網頁設計中「平板電腦」及「智慧型手機」解析度下使用者經驗最佳的設計。實驗分兩階段進行，第一階段透過系統實際操作與問卷填答分析，探討介面設計與使用者經驗的關係，並找出響應式網頁設計在「平板電腦解析度」及「智慧型手機解析度」下使用者經驗最佳之設計。第二階段以第一階段調查結果為基礎，利用眼球儀器將最佳及最差兩種介面設計做眼動行為觀察及驗證，並加入「瀏覽行為」，探討使用者在在平板電腦解析度下，不同的瀏覽目的對眼動行為的影響。最後綜合研究結果進行討論並提出總結、網頁介面設計與後續研究建議
研究結果顯示使用響應式網頁設計之網站，無論在平板電腦或智慧型手機解析度下，皆為「網格式」介面設計模式使用者經驗最佳。此外，在不同瀏覽目的下，部分眼動行為有所差異。平板電腦解析度下，F-Layout設計模式在經驗瀏覽時大部份使用者成「倒N字型」瀏覽，而在主觀搜尋情境下則改為「Z字型」瀏覽。

The purpose of this study is to find out the best UI design pattern of responsive website display for tablets and smartphones.
This study was conducted in two stages. The user experience questionnaire was used in the first stage to understand the relationship between UI design and user experience, and to find out which design pattern has the best user experience.
The second stage was based on the result of the first stage. In this stage, The best and the worst design patterns were observed and verified by eye-tracking instrument. The browsing purpose was added at this stage to investigate the impact of eye movement on different browsing purposes.
The results show that the grid UI design pattern has the best user experience on either tablets or smartphones under the condition of surfing. In addition, these two types of browsing purposes also displayed differences in the visual movement. Most users follow the ”Z” movement pattern when they browse this website leisurely, but follow the “reverse N” movement pattern when they have specific goals.

學位論文審定書 i
摘要 ii
Abstract iii
圖次 v
表次 vii
第一章 緒論 1
第一節 研究背景 1
第二節 研究動機與研究問題 2
第三節 研究流程 4
第二章 文獻探討 5
第一節 響應式網頁設計 5
第二節 使用者經驗(User Experience) 7
第三節 使用者瀏覽行為 11
第四節 眼動行為與眼動指標 12
第三章 研究架構與方法 13
第一節 研究架構 13
第二節 第一階段研究 14
第三節 第二階段研究 24
第四章 研究結果分析 30
第一節 第一階段使用者經驗研究 30
第二節 第二階段眼動行為研究 39
第五章 綜合討論 47
第一節 檢定結果 47
第二節 網站介面編排總體使用者經驗 48
第三節 使用者經驗對眼動行為之影響 49
第四節 瀏覽目的對視覺動線之影響 50
第六章 結論 51
第一節 研究發現 51
第二節 研究貢獻 53
第三節 研究限制與未來研究建議 53
參考文獻 55
附錄一 第一階段問卷 57

.Net-Magazine. (2012). 15 top web design and development trends for 2012. from http://www.creativebloq.com/industry-trends/15-top-web-design-and-development-trends-2012-1123018
Alben, L. (1996). Quality of experience: defining the criteria for effective interaction design. Interactions, 3(3).
Doyle, M. (2011). Responsive Web Design Demystified. from http://www.elated.com/articles/responsive-web-design-demystified/
Duchowski, A. (2007). Eye Tracking Methodology: Theory and Practice (2 ed.): Springer Science & Business Media.
Ehmke, C., & Wilson, S. (2007). Identifying web usability problems from eye-tracking data. Paper presented at the British Computer Society Conference on Human-Computer Interaction (BCS-HCI).
Gardner, B. S. (2011). Responsive Web Design : Enriching the User Experience. Sigma Journal, 11, p13-19.
Garrett, J. J. (2011). The Elements of User Experience: User-Centered Design for the Web and Beyond (2 ed.): New Riders.
Goldberg, J. H., & Kotval, X. P. (1999). Computer interface evaluation using eye movements: methods and constructs. International Journal of Industrial Ergonomics, 24, p631-645.
Goldberg, J. H., Stimson, M. J., Lewenstein, M., Scott, N., & Wichansky, A. M. (2002). Eye tracking in web search tasks: design implications. ETRA, p51-58.
Goto, K. (2004). Web ReDesign 2.0: Workflow that Works: New Riders.
Hinderks, A. (2015). UEQ-Online. from http://www.ueq-online.org/
Hoffman, D. L., & Novak, T. P. (1996). Marketing in Hypermedia Computer-Mediated Environments: Conceptual Foundations. Journal of Marketing, p50-68.
Holmqvist, K., Holsanova, J., Barthelson, M., & Lundqvist, D. (2003). Reading or Scanning? A Study of Newspaper and Net Paper Reading. The mind's eye : cognitive and applied aspects of eye movement research, p657-670.
ISO-9241-210. (2010). Ergonomics of human-system interaction Part 210: Human-centred design for interactive systems: ISO.
Kraft, C. (2012). User Experience Innovation: User Centered Design that Works: Apress.
Kuniavsky, M. (2010). Smart Things: Ubiquitous Computing User Experience Design (1 ed.): Elsevier.
Laugwitz, B., Held, T., & Schrepp, M. (2008). Construction and Evaluation of a User Experience Questionnaire. Computer Science, 5298, p63-76.
LePage, P. (2014). Responsive Web Design Basics. from https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/?hl=en
Marcotte, E. (2011). Responsive Web Design: A List Apart.
Natda, K. V. (2013). Responsive Web Design. Eduvantage.
Roto, V. (2007). User Experience from Product Creation Perspective. Paper presented at the Towards a UX Manifesto, Lancaster.
Spencej. (2011). Advertising by Mindset: Optimizing Ad Receptivity Based on Activity. Yahoo! Advertising Solutions.