網(wǎng)絡(luò)課程的網(wǎng)頁布局與導(dǎo)航樣式對學(xué)習(xí)影響的眼動實驗研究

賴麗花，王咸偉

（1.深圳職業(yè)技術(shù)學(xué)院 動畫學(xué)院，廣東 深圳 518055；2.華南師范大學(xué) 教育信息技術(shù)學(xué)院，廣東 廣州510631）

網(wǎng)絡(luò)課程的網(wǎng)頁布局與導(dǎo)航樣式對學(xué)習(xí)影響的眼動實驗研究

賴麗花1，王咸偉2

（1.深圳職業(yè)技術(shù)學(xué)院 動畫學(xué)院，廣東 深圳 518055；2.華南師范大學(xué) 教育信息技術(shù)學(xué)院，廣東 廣州510631）

Web網(wǎng)頁是網(wǎng)絡(luò)課程重要的人機界面，其布局和設(shè)計直接影響學(xué)習(xí)者的學(xué)習(xí)效果．本文從眼動心理學(xué)角度，利用眼動實驗研究學(xué)習(xí)者利用網(wǎng)絡(luò)課程學(xué)習(xí)的視覺搜索行為，測量學(xué)習(xí)者在3種常見的網(wǎng)頁布局及其導(dǎo)航樣式下學(xué)習(xí)時的眼動數(shù)據(jù)，探討網(wǎng)頁布局對網(wǎng)絡(luò)學(xué)習(xí)的影響．通過記錄注視次數(shù)、注視持續(xù)時間等6項眼動指標，并結(jié)合態(tài)度測量，試圖揭示學(xué)習(xí)者學(xué)習(xí)時的眼動心理生理基本特征，以期找出適宜的網(wǎng)頁布局形式和導(dǎo)航樣式，為網(wǎng)絡(luò)課程的設(shè)計和開發(fā)提出有效建議．實驗研究表明：（1）T字型布局有利于學(xué)習(xí)者進行視覺搜索；（2）國字型布局更有利于學(xué)習(xí)者對知識的認知加工；（3）學(xué)習(xí)者進行視覺搜索時興趣區(qū)集中在導(dǎo)航區(qū)，進行知識學(xué)習(xí)時興趣區(qū)集中在主體內(nèi)容區(qū)；（4）學(xué)習(xí)者在國字型布局下能取得更高的正確率．

網(wǎng)絡(luò)課程；網(wǎng)頁布局；導(dǎo)航樣式；視覺搜索；眼動實驗；EyeLink II

隨著網(wǎng)絡(luò)和多媒體技術(shù)的高速發(fā)展及廣泛應(yīng)用，網(wǎng)絡(luò)課程已經(jīng)發(fā)展成為網(wǎng)絡(luò)學(xué)習(xí)和遠程教育的重要數(shù)字化學(xué)習(xí)資源．雖然目前有一些精品網(wǎng)絡(luò)課程，但大部分網(wǎng)絡(luò)課程離教育部的網(wǎng)絡(luò)課程認證標準還有一定的差距[1]．在網(wǎng)絡(luò)教學(xué)中，由于師生在時空上的隔離，學(xué)習(xí)者主要通過網(wǎng)絡(luò)課程支撐平臺來學(xué)習(xí)．網(wǎng)絡(luò)課程資源潛的豐富性一方面給學(xué)習(xí)者提供了較大的選擇余地，同時也要求學(xué)習(xí)者能夠快速準確地捕捉課程的基本信息，才能做出正確的選擇．有關(guān)研究表明，網(wǎng)頁布局在一定條件下可以提高視覺搜索績效[2]，適宜的網(wǎng)頁布局形式有利于促進網(wǎng)絡(luò)課程的學(xué)習(xí)．因此，加強對網(wǎng)絡(luò)課程界面設(shè)計和學(xué)習(xí)效果的研究有助于促進我國網(wǎng)絡(luò)課程以及遠程教育實踐的發(fā)展．

當前我國教育技術(shù)領(lǐng)域?qū)W(wǎng)絡(luò)課程的研究大都偏重于文獻和理論研究，缺乏深入的實證研究．大多數(shù)研究采用定性研究，使用主觀測量等方法研究學(xué)習(xí)者的網(wǎng)絡(luò)學(xué)習(xí)行為；而定量的研究更傾向于使用問卷和量表測量等．近年來，網(wǎng)絡(luò)課程中的網(wǎng)頁設(shè)計理念開始從“以機器為本”轉(zhuǎn)向了“以人為本”，強調(diào)機器能夠適應(yīng)人的心理和生理特征．與主觀測量等方法相比，直接的生理測量技術(shù)——眼動技術(shù)能實時記錄用戶上網(wǎng)時的眼動數(shù)據(jù)，例如注視次數(shù)、注視持續(xù)時間等，這些數(shù)據(jù)不僅能直接、動態(tài)和連續(xù)地反映學(xué)習(xí)者的網(wǎng)上行為，而且能揭示其背后的心理加工過程和規(guī)律．目前，眼動技術(shù)已逐漸應(yīng)用到人機交互中界面評價、網(wǎng)頁設(shè)計等研究領(lǐng)域．

以往對網(wǎng)絡(luò)課程的眼動研究大多從基本元素構(gòu)成、單一元素著手，研究網(wǎng)頁的字體、顏色、文字排版樣式、圖片位置等因素對視覺搜索的影響．而探索網(wǎng)絡(luò)課程整體布局和導(dǎo)航樣式對學(xué)習(xí)者網(wǎng)絡(luò)學(xué)習(xí)影響的研究則較少，已有的一些研究也很少將信息內(nèi)容的理解納入布局效應(yīng)的考察范圍．

目前網(wǎng)絡(luò)課程的布局形式有T字型、口字型、對稱型、國字型、正文標題型[3]、左右框架型、上下框架型、綜合框架型、封面型、Flash型、變化型[4]等多種類型，通過對我國大多數(shù)精品課程網(wǎng)站的布局形式和導(dǎo)航樣式進行分析，本著常用和實用等原則，我們篩選了3種常見布局：T字型、國字型和正文標題型作為樣本進行研究，試圖從網(wǎng)頁整體布局和導(dǎo)航樣式出發(fā)，利用 EyeLink II型眼動儀測量學(xué)習(xí)者在這3種常見的網(wǎng)頁布局及其相應(yīng)的導(dǎo)航樣式下進行學(xué)習(xí)時的眼動數(shù)據(jù)，研究不同導(dǎo)航樣式對視覺搜索的影響，并考察不同網(wǎng)頁布局形式對學(xué)習(xí)效果的影響．

1 實驗研究

本實驗為單因素完全隨機實驗，實驗分為 3個階段進行：

第一階段：選擇被試，了解學(xué)習(xí)者的視力、計算機操作能力以及網(wǎng)絡(luò)課程的使用情況等，然后挑選符合要求的學(xué)生作為被試進行實驗．

第二階段：被試進行本研究的眼動實驗，分為資源搜索和內(nèi)容學(xué)習(xí)2部分進行．第一部分要求學(xué)習(xí)者針對網(wǎng)頁不同的導(dǎo)航樣式，搜索所需的資源；第二部分要求學(xué)習(xí)者針對3種不同的網(wǎng)頁布局學(xué)習(xí)相關(guān)課程內(nèi)容，并回答問題．

第三階段：被試完成眼動實驗后，填寫一份態(tài)度測量問卷，測量被試對學(xué)習(xí)材料和3種布局的評價態(tài)度．

1.1 研究目標

1）探討T字型、國字型和正文標題型3種不同網(wǎng)頁布局對應(yīng)的導(dǎo)航樣式對學(xué)習(xí)者視覺搜索的影響．

2）探討T字型、國字型和正文標題型3種不同網(wǎng)頁布局對學(xué)習(xí)者學(xué)習(xí)效果的影響．

3）結(jié)合問卷調(diào)查，考察學(xué)習(xí)者對本實驗的態(tài)度以及對網(wǎng)絡(luò)課程3種布局的喜好和評價，為網(wǎng)絡(luò)課程的網(wǎng)頁布局設(shè)計，提供參考建議．

1.2 實驗對象

本研究選擇華南師范大學(xué)教育技術(shù)學(xué)、攝影、傳播學(xué)3個專業(yè)的28名大學(xué)生作為被試進行實驗，其中，14名男生，14名女生，男女比例各占50%，年齡為18～25歲（平均值x=23.0，標準差s=1.3），母語均為漢語，所有被試無行為缺陷，右利手．所有被試來自同一學(xué)院，具有相似的學(xué)習(xí)背景，對學(xué)習(xí)內(nèi)容不了解或不知情．同時要求被試均能熟練操作計算機，并具有網(wǎng)絡(luò)課程學(xué)習(xí)的經(jīng)驗，無類似的眼動實驗經(jīng)驗，均沒有智力異?；蜷喿x障礙，所有被試裸眼或矯正視力達到5.1或以上，色覺正常，沒有斜視或散光問題．

1.3 變量的操作性定義

1.3.1 自變量

本實驗的自變量有2個：網(wǎng)絡(luò)課程頁面的布局形式及其對應(yīng)的導(dǎo)航樣式．網(wǎng)頁布局形式選擇的是網(wǎng)絡(luò)課程中最常用采用的3種布局形式．其中，T字型布局是指頁面最上方的頁眉區(qū)是網(wǎng)站標識以及橫幅廣告條，頁眉下方是內(nèi)容主體區(qū)，左邊是導(dǎo)航菜單，右邊顯示主體內(nèi)容，其造型在整體上類似于字母“T”的布局．T字型布局是一種常見的網(wǎng)頁布局形式，整體布局條理清晰，主次分明．國字型布局也稱為同字型布局，頁面最上方是網(wǎng)站標識以及橫幅廣告條，接下來就是網(wǎng)頁的主要內(nèi)容區(qū)域，左右兩邊分列導(dǎo)航，中間是主要內(nèi)容區(qū)，與左右兩邊導(dǎo)航一起羅列到底，而頁面最下方是網(wǎng)站的一些基本信息、聯(lián)系方式以及版權(quán)聲明等．國字型布局常見于一些信息量大的網(wǎng)站．正文標題型布局是指頁面最上面是標題或類似元素，下面就是正文內(nèi)容區(qū)域．正文標題型的布局結(jié)構(gòu)相對簡單，常見于文章頁面、注冊頁面和說明頁面等．這3種布局對應(yīng)的導(dǎo)航樣式樣例分別如圖1～3所示．

1.3.2 因變量

1）注視次數(shù)（Number of Fixation）．人們在閱讀的過程中，眼球的運動不是連續(xù)的，而是跳躍式的．2次跳躍之間眼球存在一個相對靜止的狀態(tài)，稱為注視（Fixation）．注視位置的多少，即被試閱讀時注視點的數(shù)量，稱為注視的次數(shù)，它反映被試的閱讀熟練程度、閱讀的策略以及材料的難易程度．在保證快速找到所需要資源的基礎(chǔ)上，本研究認為注視次數(shù)越少越好；在閱讀材料時，在保持較高正確率的基礎(chǔ)上，注視次數(shù)越少越好．

2）注視持續(xù)時間（Duration）．注視持續(xù)時間也稱為持續(xù)時間，是指對整張圖片的所有注視點的持續(xù)時間的總和，與被試對信息的提取和編碼有關(guān)，注視持續(xù)時間的長短反映被試對材料的加工程度．就一個被試而言，持續(xù)時間越長，則對信息加工越深，而對不同被試而言，持續(xù)時間越長，則加工速度越慢．

3）平均注視時間（Average Fixation Duration）．平均注視時間也稱為平均注視持續(xù)時間，是指一個注視點的平均注視停留時間，平均注視時間的長短反映被試對材料加工的程度．

4）眼跳次數(shù)（Number of Saccade）．人們在閱讀的過程中，眼球的運動是跳躍式的，當對注視的內(nèi)容加工結(jié)束時，會出現(xiàn)眼跳，通常情況下，2次注視之間會出現(xiàn)一次眼跳．在保證快速找到所需要資源以及保證較高正確率的基礎(chǔ)上，本研究認為眼跳次數(shù)越少越好．

5）平均眼跳幅度（Average Saccade Amplitude）．當學(xué)習(xí)者對注視的內(nèi)容加工結(jié)束后，會出現(xiàn)眼跳．在本研究中平均眼跳幅度是反映學(xué)習(xí)者對學(xué)習(xí)材料認知加工的重要指標．

6）興趣區(qū)（Region of Interest，ROI）．眼動分析軟件可以根據(jù)注視點移動軌跡、不同位置的注視時間、注視點停留的區(qū)域分布來勾畫出興趣區(qū)．興趣區(qū)域可以是靜態(tài)的也可以是動態(tài)的，各種幾何形狀都可以用于興趣區(qū)外觀匹配．興趣區(qū)域可以與視點變化過程重現(xiàn)視圖或者熱區(qū)圖疊加顯示[5]．本研究主要通過注視點的分布情況來研究興趣區(qū)．

7）正確數(shù)．正確數(shù)是指被試學(xué)習(xí)完相關(guān)學(xué)習(xí)材料后，回答問題的正確數(shù)量．本研究一共有T字型、國字型和正文標題型3種網(wǎng)頁布局，每種布局的學(xué)習(xí)材料對應(yīng)3個問題，共有9個問題，對被試進行保持測驗和遷移測驗，問題主要為識記類，以保持測驗為主，均以單選題形式出現(xiàn)．一般來說，回答問題正確數(shù)越高，說明被試對閱讀材料的內(nèi)容理解程度越深．在本研究中，正確數(shù)是衡量學(xué)習(xí)者學(xué)習(xí)成績的重要指標．

8）學(xué)習(xí)態(tài)度．本研究編制了一份態(tài)度問卷，測量被試對網(wǎng)絡(luò)課程學(xué)習(xí)以及眼動實驗過程的態(tài)度，學(xué)習(xí)態(tài)度的測量是在被試完成眼動實驗之后進行的，測量學(xué)生對實驗材料難易程度的評價以及對布局的喜愛態(tài)度．

圖1 T字型導(dǎo)航圖

圖2 國字型導(dǎo)航圖

圖3 正文標題型導(dǎo)航圖

1.4 實驗材料的選擇與確定

本研究選取了華南師范大學(xué)3門不同布局的精品課程網(wǎng)站作為實驗材料，分別是《教育心理學(xué)》（網(wǎng)址：http://202.116.45.198/pe/web1/ps/Console. htm?part=courseinfo）、《中國古代史》（網(wǎng)址：http://jpkc.scnu.edu.cn/zggds/wlkc/index.htm）、《植物生理學(xué)》（網(wǎng)址：http://sky.scnu.edu.cn/jpkc /zwslx/kcjj.htm），它們分別采用了 3種網(wǎng)頁布局形式：T字型、國字型和正文標題型，其中《教育心理學(xué)》和《植物生理學(xué)》是國家級精品課程，《中國古代史》是廣東省省級精品課程．而學(xué)習(xí)材料選擇的是《教育心理學(xué)》①張大均．教育心理學(xué)[M]．人民教育出版社，2005．的內(nèi)容，針對每種布局的學(xué)習(xí)材料分別設(shè)計了針對于“學(xué)習(xí)策略及其培養(yǎng)”、“主要的心理發(fā)展理論”和“多媒體計算機教學(xué)的特點”的問題，一共有9個問題，對學(xué)習(xí)者進行保持和遷移測驗，以保持測驗為主．

1.5 實驗環(huán)境和實驗儀器

本實驗在華南師范大學(xué)教育科學(xué)學(xué)院的眼動儀實驗II室進行，該實驗室是華南師范大學(xué)的重點實驗室，經(jīng)過隔光隔音設(shè)計并通過了嚴格的檢測，被試進行實驗時與外界有兩層物理隔離，有效保證了實驗可以在安靜、良好、無干擾的環(huán)境中進行．實驗采用加拿大SR Research Ltd公司生產(chǎn)的EyeLink II 型眼動儀，該儀器是一款頭戴式雙眼跟蹤設(shè)備，程序版本為EyeLink.204，系統(tǒng)所使用的操作系統(tǒng)為 Windowns XP，實驗程序用E-prime1.0進行編寫和編譯．屏幕為17寸液晶，分辨率為1024×768，實驗時，被試眼睛與顯示器中心齊平，被試與屏幕的距離約為70 cm．實驗使用的系統(tǒng)參數(shù)見表1．

1.6 實驗過程

實驗過程包括如下幾個環(huán)節(jié)：

1）選擇被試，挑選符合要求的被試，進行單因素完全隨機眼動實驗．

2）被試提前五分鐘進入眼動實驗室，熟悉整個實驗室的環(huán)境．

3）主試向被試介紹本實驗的目的和意義，以及提出合作的要求．

4）進行實驗．

（1）被試坐在顯示器前的椅子上，與屏幕的距離約為70cm．

（2）被試明白了實驗的要求以后，為其安置頭盔式眼動儀，并設(shè)置好頭部相機和眼部相機，視角大約28×32度．

表1 EyeLink II系統(tǒng)的產(chǎn)品規(guī)格①

① EyeLink II系統(tǒng)的產(chǎn)品規(guī)格[DB/OL]．http://www.souvr.com/Shop/200806/244.hTml，2012-03-10．

（3）對被試進注視點校準、確認和漂移修正．

（4）隨后開始宣讀實驗指導(dǎo)語．

（5）在被試計算機屏幕上呈現(xiàn)實驗材料，按照既定程序完成與眼動儀的連接，眼動儀會根據(jù)被試的按鍵自動開始或停止記錄眼動數(shù)據(jù)．

（6）實驗過程中主試記錄被試實驗問題答案．

（7）眼動實驗結(jié)束后發(fā)放態(tài)度問卷，對被試進行態(tài)度測量．

每一名被試重復(fù)上述步驟，直到全部被試完成實驗．在實驗過程中，要求被試盡量保持身體和頭部沒有大幅度的移動，被試在每一個刺激的呈現(xiàn)過程中，如果出現(xiàn)注視點漂移，均可以暫停來進行九點校準，待校準完畢后再接著實驗．如果被試因為頭部疲勞或者眼睛不舒適需要中斷實驗，主試將及時做好調(diào)整，以排除被試因為生理狀態(tài)對實驗引起的影響．整個實驗過程中只有一名主試、一名助手，以及一名被試在實驗室內(nèi)，避免了因為實驗環(huán)境對被試產(chǎn)生影響．

2 實驗結(jié)果

本研究的數(shù)據(jù)處理主要有兩方面，首先使用The EyeLink Data Viewer眼動分析軟件對系統(tǒng)導(dǎo)出的EDF文件進行分析，將眼動數(shù)據(jù)導(dǎo)出生成Excel或JPG文件，然后再利用SPSS 17.0和MS Excel 2010對所有數(shù)據(jù)進行處理、統(tǒng)計分析，包括t檢驗和F檢驗．表2、表3為實驗第一、第二部分數(shù)據(jù)的平均值和標準差，其中M表示平均值，SD表示標準差．

2.1 不同導(dǎo)航樣式對持續(xù)時間、注視次數(shù)、眼跳次數(shù)的影響

表4給出了實驗第一部分各變量的方差分析的結(jié)果．

由表4可知，不同導(dǎo)航樣式對持續(xù)時間的影響，F(xiàn)=3.308，P=0.042<0.05；對注視次數(shù)的影響，F(xiàn)=3.571，P=0.033<0.05；對眼跳次數(shù)的影響，F(xiàn)=3.402，P=0.038<0.05，表明不同導(dǎo)航樣式對資源搜索的持續(xù)時間、注視次數(shù)、眼跳次數(shù)均有顯著差異．結(jié)合表2可以看出，學(xué)習(xí)者在T字型布局對應(yīng)的導(dǎo)航樣式下進行資源的搜索，在持續(xù)時間、注視次數(shù)和眼跳次數(shù)上均為最少，其次是正文標題型布局，而國字型布局最多．在資源搜索的過程中，持續(xù)時間是指找到資源所花費的總時間，注視次數(shù)和眼跳次數(shù)反映的是被試的瀏覽習(xí)慣和瀏覽策略．在相同情況下，被試找到所需資源所花的時間越短、注視次數(shù)和眼跳次數(shù)越少，表明T字型布局的導(dǎo)航樣式更有利于資源搜索．

2.2 不同布局形式對平均注視時間、平均眼跳幅度、持續(xù)時間、注視次數(shù)、眼跳次數(shù)的影響

表5給出實驗第二部分各變量的方差分析的結(jié)果．

由表5可知，不同布局形式對平均注視時間的影響，F(xiàn)=1.522，P=0.223>0.05；對持續(xù)時間的影響，F(xiàn)=1.403，P=0.252>0.05；對注視次數(shù)的影響，F(xiàn)=1.286，P=0.282>0.05；對眼跳次數(shù)的影響，F(xiàn)=1.027，P=0.363>0.05，表明不同布局形式對學(xué)習(xí)者學(xué)習(xí)時的平均注視時間、持續(xù)時間、注視次數(shù)、眼跳次數(shù)均沒有顯著差異．在進行知識的學(xué)習(xí)過程中，平均注視時間與持續(xù)時間一樣能反映被試的加工程度，持續(xù)時間越長表明對材料的加工程度越深；注視次數(shù)和眼跳次數(shù)則反映被試對閱讀材料的理解情況以及感興趣程度，一定程度上也反映材料的難易程度；不同布局形式對學(xué)習(xí)者學(xué)習(xí)時的平均注視時間、持續(xù)時間、注視次數(shù)、眼跳次數(shù)均沒有顯著差異，一方面表明材料的難易程度相當，另一方面也表明被試對材料的加工程度、閱讀策略、瀏覽習(xí)慣以及感興趣程度并沒有多大差異．

不同布局形式對平均眼跳幅度的影響，F(xiàn)=10.196，P=0.000<0.05，表明不同布局形式對平均眼跳幅度的影響有顯著差異．平均眼跳幅度是對材料的認知加工廣度的重要指標，平均眼跳幅度越大，對材料的認知加工越深．結(jié)合表3可以看出，學(xué)習(xí)者在進行知識的學(xué)習(xí)過程中，國字型布局的眼跳幅度最大，該布局更有利于學(xué)習(xí)者對知識和內(nèi)容的認知加工．

2.3 興趣區(qū)分析

興趣區(qū)可以根據(jù)注視點移動軌跡、注視點分布的區(qū)域進行勾畫，本研究主要通過注視點的分布情況來分析興趣區(qū)．在進行資源的搜索過程中，學(xué)習(xí)者主要關(guān)注的是網(wǎng)頁導(dǎo)航區(qū)，注視點、注視軌跡主要集中在導(dǎo)航區(qū)的按鈕或鏈接位置．T字型、國字型、正文標題型3種導(dǎo)航樣式的興趣區(qū)與其各自的形狀相似．圖4～6分別給出了被試在3種導(dǎo)航樣式下進行資源搜索時的注視點和興趣區(qū)圖．從圖4（見圖中的虛線矩形框）可以看出其興趣區(qū)的形狀與 T字型導(dǎo)航樣式形狀一致，呈現(xiàn)出“T”字形狀；從圖5中虛線框可以看出其興趣區(qū)的形狀與國字型導(dǎo)航樣式形狀一致，呈現(xiàn)出“門”字形狀；從圖 6中虛線框可以看出被試興趣區(qū)的形狀與正文標題型導(dǎo)航樣式形狀一致，呈現(xiàn)出“一”字形狀．3種導(dǎo)航樣式的興趣區(qū)主要與導(dǎo)航的位置有關(guān)，主要差異在于其導(dǎo)航本身位置的差異．

表2 實驗第一部分相關(guān)數(shù)據(jù)

表3 實驗第二部分相關(guān)數(shù)據(jù)

表4 實驗第一部分方差分析結(jié)果

表5 實驗第二部分的方差分析結(jié)果

圖4 T字型導(dǎo)航樣式的興趣區(qū)圖

學(xué)習(xí)者在進行知識的學(xué)習(xí)過程與資源搜索的過程不同，主要關(guān)注的是網(wǎng)頁主體內(nèi)容區(qū)，注視點、注視軌跡主要集中在網(wǎng)頁顯示內(nèi)容的區(qū)域，對導(dǎo)航區(qū)的注意力有所減少．圖7～9給出了被試在3種布局形式下進行學(xué)習(xí)時的注視點和興趣區(qū)圖．從圖 7（見圖中的虛線矩形框）可看出其興趣區(qū)主要在網(wǎng)頁右下方的內(nèi)容區(qū)，在此區(qū)域范圍中注視點的分布均勻有序；圖8中虛線框可看出被試的興趣區(qū)主要在網(wǎng)頁中間的內(nèi)容區(qū)，分布也較為密集；從圖9中虛線框可以發(fā)現(xiàn)被試的興趣區(qū)位于導(dǎo)航下方的內(nèi)容區(qū)域，正文標題處注視點較為密集，說明被試會重點關(guān)注每個段落的標題．通過上述分析，發(fā)現(xiàn)學(xué)習(xí)者在進行課程學(xué)習(xí)時，興趣區(qū)均集中在頁面內(nèi)容顯示區(qū)域中．

2.4 回答正確數(shù)分析

被試每學(xué)習(xí)完一種布局對應(yīng)的學(xué)習(xí)材料之后，將回答3個問題，問題是針對材料設(shè)計的，主要為保持測驗．通過統(tǒng)計和分析，T字型布局的平均正確率為79.7619%，國字型為86.9048%，正文標題型為67.8571%，國字型布局的平均正確率是3種布局中最高的，說明學(xué)習(xí)者在國字型布局下能取得較好成績．

2.5 學(xué)習(xí)態(tài)度問卷分析

被試完成所有眼動實驗后，將填寫一份學(xué)習(xí)態(tài)度問卷，測量其對本實驗材料的評價和布局形式的態(tài)度．通過問卷調(diào)查發(fā)現(xiàn)28名被試中82%學(xué)生認為本實驗的問題難易程度合適，14%學(xué)生認為難度小，只有4%學(xué)生認為難度大．對不同布局對應(yīng)的導(dǎo)航樣式，被試中54%認為T字型導(dǎo)航樣式更有利于快速找到所需資源，有28%認為國字型導(dǎo)航樣式有利，有18%認為正文標題型有利，如圖10所示．調(diào)查發(fā)現(xiàn)，被試在進行網(wǎng)絡(luò)課程學(xué)習(xí)時，對T字型和國字型布局均有較高評價，喜歡T字型和國字型布局的學(xué)生各有39.3%，如圖11所示．

圖5 國字型導(dǎo)航樣式的興趣區(qū)圖

圖6 正文標題型導(dǎo)航樣式的興趣區(qū)圖

圖7 T字型布局的興趣區(qū)圖

圖8 國字型布局的興趣區(qū)圖

圖9 正文標題型布局的興趣區(qū)圖

圖10 被試對3種導(dǎo)航樣式的評價圖

圖11 被試對3種布局的喜好

3 結(jié)論與建議

3.1 結(jié)論

1）學(xué)習(xí)者在進行資源的搜索時，網(wǎng)頁布局及其對應(yīng)的導(dǎo)航樣式對資源搜索的持續(xù)時間、注視次數(shù)和眼跳次數(shù)有顯著影響．其中，T字型布局的持續(xù)時間、注視次數(shù)和眼跳次數(shù)均為最少；其次是正文標題型布局，而國字型布局最多．T字型導(dǎo)航樣式更有利于學(xué)習(xí)者進行視覺搜索．

2）學(xué)習(xí)者在進行知識的學(xué)習(xí)過程中，不同布局形式對學(xué)習(xí)者的眼動數(shù)據(jù)的影響表現(xiàn)出不同差異情況．T字型布局、國字型布局和正文標題型布局的平均注視時間、持續(xù)時間、注視次數(shù)和眼跳次數(shù)均沒有顯著差異，但3種布局的平均眼跳幅度存在顯著差異，國字型布局更有利于學(xué)習(xí)者對知識和內(nèi)容的認知加工．

3）當學(xué)習(xí)者進行視覺搜索時，興趣區(qū)集中在網(wǎng)頁的導(dǎo)航區(qū)，而當學(xué)習(xí)者進行知識學(xué)習(xí)時，興趣區(qū)集中在網(wǎng)頁的主體內(nèi)容區(qū)．

4）學(xué)習(xí)者在國字型布局下能夠取得更高的正確率，大部分被試更喜歡T字型和國字型這2種布局．

3.2 建議

1）在網(wǎng)絡(luò)課程學(xué)習(xí)的過程中，如果要提高學(xué)習(xí)者的資源搜索績效，可采用T字型的導(dǎo)航樣式，T字型導(dǎo)航樣式比國字型和正文標題型布局對應(yīng)的導(dǎo)航樣式的資源搜索績效更高．

2）要獲得較好的網(wǎng)絡(luò)課程學(xué)習(xí)效果，網(wǎng)頁設(shè)計者可采用國字型布局形式來安排網(wǎng)頁元素，因為學(xué)習(xí)者在國字型布局形式下能獲得更高準確率，且學(xué)習(xí)者更喜歡T字型和國字型布局形式．

3）設(shè)計者在進行網(wǎng)絡(luò)課程布局設(shè)計時，主頁可采取 T字型布局便于學(xué)習(xí)者搜索欄目和資源，而內(nèi)頁可采用國字型布局便于學(xué)習(xí)者對知識內(nèi)容進行深加工．

本研究只針對3種常用的布局形式：T字型、國字型和正文標題布局及其對應(yīng)的 3種導(dǎo)航樣式進行了眼動實驗，而其它的一些網(wǎng)頁布局類型如對稱型、海報型、拐角型、框架型、Flash型、變化型等對網(wǎng)絡(luò)課程學(xué)習(xí)效果的影響，以及其它的導(dǎo)航樣式如隱喻式導(dǎo)航、沉浸式導(dǎo)航等交互式導(dǎo)航對學(xué)習(xí)者資源搜索的影響，還有待于進一步研究．

[1] 謝幼如，劉鐵英，高瑞利，等．網(wǎng)絡(luò)課程的內(nèi)容分析與評價研究[J]．電話教育研究，2003（11）：45-49．

[2] 鄧勇．淺淡網(wǎng)頁設(shè)計的布局及原理[J]．渝西學(xué)院學(xué)報（自然科學(xué)版），2004（3）：32-34．

[3] 王華英．淺談網(wǎng)頁布局[J]．電子信息，2010（21）：297．

[4] 洪亞玲．淺談網(wǎng)頁的布局[J]．電腦知識與技術(shù)（學(xué)術(shù)交流），2007（7）：91，102．

[5] iViewX眼動儀[ED/OL]．http://www.verTinfo.com /verTnew/showpro.asp?cpid=7804，2012-04-02．

Impact of Webpage Layout and Navigation Style of Network Courses on Learning: An Eye Movement Experiment

LAI Lihua1, WANG Xianwei2

（1.School of Animation, Shenzhen Polytechnic, Shenzhen, Guangdong 518055; 2.College of Educational Information Technology, South China Normal University, Guangzhou, Guangdong 510631, China）

The webpage of a network course is an important human-computer interface. Its layout and design has a direct impact on students’ learning effect. Based on the eye movement psychology, this research conducts an eye movement experiment to study the learners’ visual behavior when they are learning from a network course, and measure the student’s eye movement data in three different webpage layouts and navigation styles, and examine the influences of webpage layout on network learning. Six eye movement data are examined including the amount of fixation and duration. Based on an attitude questionnaire, the physiological and psychological characteristics of the learners are studied to find a more appropriate webpage layout and navigation style, and offer some advice for network curriculum design and development. The results show that: (1) The T-shaped layout is conducive to learners in visual search; (2) The Guo-shaped layout is more conducive to learners' cognitive processing of knowledge; (3) When the learner is doing visual search, the interest region is in the navigation area, when the learner moves on to the content, the interest region is in the content area; (4) The learner can achieve higher accuracy rate in the Guo-shaped layout.

network course; webpage layout; navigation style; visual search; eye tracking experiment; eyeLink II

TP393；G43

A

1672-0318（2014）05-0037-08

10.13899/j.cnki.szptxb.2014·05, 008

2014-06-06

賴麗花（1986-），廣東人，碩士，研究方向為視覺心理、平面設(shè)計、實訓(xùn)平臺建設(shè)等．