網頁中動畫分布位置與閱讀績效之研究

Abstract

隨著技術的發展與整合，網頁不僅可以不受時空限制地傳遞資訊、成為教材，資訊本身也加入更多引人的視覺特效。本研究旨在探討網頁上的動畫分佈位置與閱讀網頁內文的績效，兩者之間的關係，閱讀績效所使用的指標包括：閱讀網頁內容所花費的時間、回憶報告內容的正確程度、閱讀者的自覺疲勞度。以供將來網頁設計之參考，企圖尋找出網頁上的動畫分佈位置與閱讀績效之間，最為合適的安排。期望對設計界與教育界在網頁資訊設計與視覺設計之間求得良好的平衡。 本研究藉由生理上、心裡學上文獻探討尋找出可能的影響因素，設計實驗材料與步驟，為9階（動畫位置於文字的上、下、左、右、左上、左下、右上、右下方及無動畫的控制組）單因子實驗。網頁中不同位置的動畫圍繞經過亂數出現的九個英文字母，讓具備相當閱讀能力、視力、網頁經驗的國一學生來閱讀，同時記錄閱讀時間，並在閱讀之後進行正確程度的測驗，及九等量表測試受試者對於閱讀網頁疲勞度的主觀評比。結果發現，網頁中動畫相對於文字區塊的不同分布位置，會對瀏覽者閱讀所需的時間、瀏覽者主觀自覺的疲勞程度、正確選擇接收回憶報告的整體容量有不同程度的影響，但是無關乎會正確報告的文字位置或是錯覺組合發生的機率。由於視覺負荷包含眼球運動負荷與資訊處理負荷兩種，經由統計分析找出網頁上的動畫分佈位置，與閱讀績效之間，最為合適的安排之後，嘗試以這兩方面領域的既有文獻，分析研究結果，建立網頁中動畫造成認知運作過程的推論與提出設計實務建議。

The reading process, at any level, is a complicated mental activity. Visual detection, eye movement, and the attention are all keys in gaining the most rapid comprehension while requiring the least amount of effort from the reader. The rapid growth in popularity of the World Wide Web has led some to predict the web-page format will become the standard for printed matter in the next century. As new media is developed and merged with existing technology, information conveyance is not only by word, but also through the technique of combining light and animation effects. Though sensual stimulation is satisfied through these measures, the question as to whether the message is conveyed more clearly and effectively, received more comfortably, and not lost in the technical effect must be addressed. Reading effectiveness includes the reading rate, correct identifying of the character, and the comfortability level of the presentation of the material. Therefore, by examining previous physical and psychological studies, this paper will first attempt to pinpoint control variables. Then it will attempt to define the relationship between the locations of animations on a web page and reading effectiveness. By experiment, attempts will be made to quantify the results, allowing for convenient reference in the process of designing electronic printed material. THE QUESTION: On a web page, how is the message or information conveyed by word influenced by the locations of surrounding animations? In terms of reading effectiveness, what should be the best arrangement for the locations of animations? INTRODUCTION TO THE EXPERIMENT: The test subjects are 765 junior high school students who score normally on a vision acuity test and demonstrate both English-alphabet-recognition ability and moderate experience with reading web pages. In design of the animation material, the content, color, direction, size, flash speed, and smoothness of rhythm remain constant. The location of the animation is varied randomly among eight different possibilities. In addition, a ninth random possibility is the total absence of an animation. A program is designed that will record in the computer the amount of time required by each subject to read the test material; the test responses of the subjects; and the discomfort level, rated by the subjects on a graded scale. THE RESULTS： Animations present result in longer periods of time in reading of test material. This period varies dependent upon location of animation. Generally, animations at one of the four corners of the test block result in shorter periods of time spent on the reading material than when the animations are at one of the four sides. The discomfort level reported by the subjects parallels the “reading time”: the higher the reported feeling of discomfort, the longer the time spent on the material. Various locations of the animation result in different capacities by the subjects in reading or recalling characters. However, those locations do not show significant influence in determining which of the nine text boxes are recalled. Rather, regardless of animation location, correct recall of alphabet character ranges in a general, though not necessarily exact, pattern from the upper left of the text block to the lower right. “Illusory conjunction” is found in the results of the research, and, though influenced by the location of the text, is not influenced by the location of the animation.