賴(lài)麗花，王咸偉

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

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

賴(lài)麗花1，王咸偉2

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

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

網(wǎng)絡(luò)課程；網(wǎng)頁(yè)布局；導(dǎo)航樣式；視覺(jué)搜索；眼動(dòng)實(shí)驗(yàn)；EyeLink II

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

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

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

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

1 實(shí)驗(yàn)研究

本實(shí)驗(yàn)為單因素完全隨機(jī)實(shí)驗(yàn)，實(shí)驗(yàn)分為 3個(gè)階段進(jìn)行：

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

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

第三階段：被試完成眼動(dòng)實(shí)驗(yàn)后，填寫(xiě)一份態(tài)度測(cè)量問(wèn)卷，測(cè)量被試對(duì)學(xué)習(xí)材料和3種布局的評(píng)價(jià)態(tài)度．

1.1 研究目標(biāo)

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

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

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

1.2 實(shí)驗(yàn)對(duì)象

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

1.3 變量的操作性定義

1.3.1 自變量

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

1.3.2 因變量

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

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

3）平均注視時(shí)間（Average Fixation Duration）．平均注視時(shí)間也稱(chēng)為平均注視持續(xù)時(shí)間，是指一個(gè)注視點(diǎn)的平均注視停留時(shí)間，平均注視時(shí)間的長(zhǎng)短反映被試對(duì)材料加工的程度．

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

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

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

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

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

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

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

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

1.4 實(shí)驗(yàn)材料的選擇與確定

本研究選取了華南師范大學(xué)3門(mén)不同布局的精品課程網(wǎng)站作為實(shí)驗(yàn)材料，分別是《教育心理學(xué)》（網(wǎng)址：http://202.116.45.198/pe/web1/ps/Console. htm?part=courseinfo）、《中國(guó)古代史》（網(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)頁(yè)布局形式：T字型、國(guó)字型和正文標(biāo)題型，其中《教育心理學(xué)》和《植物生理學(xué)》是國(guó)家級(jí)精品課程，《中國(guó)古代史》是廣東省省級(jí)精品課程．而學(xué)習(xí)材料選擇的是《教育心理學(xué)》①?gòu)埓缶逃睦韺W(xué)[M]．人民教育出版社，2005．的內(nèi)容，針對(duì)每種布局的學(xué)習(xí)材料分別設(shè)計(jì)了針對(duì)于“學(xué)習(xí)策略及其培養(yǎng)”、“主要的心理發(fā)展理論”和“多媒體計(jì)算機(jī)教學(xué)的特點(diǎn)”的問(wèn)題，一共有9個(gè)問(wèn)題，對(duì)學(xué)習(xí)者進(jìn)行保持和遷移測(cè)驗(yàn)，以保持測(cè)驗(yàn)為主．

1.5 實(shí)驗(yàn)環(huán)境和實(shí)驗(yàn)儀器

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

1.6 實(shí)驗(yàn)過(guò)程

實(shí)驗(yàn)過(guò)程包括如下幾個(gè)環(huán)節(jié)：

1）選擇被試，挑選符合要求的被試，進(jìn)行單因素完全隨機(jī)眼動(dòng)實(shí)驗(yàn)．

2）被試提前五分鐘進(jìn)入眼動(dòng)實(shí)驗(yàn)室，熟悉整個(gè)實(shí)驗(yàn)室的環(huán)境．

3）主試向被試介紹本實(shí)驗(yàn)的目的和意義，以及提出合作的要求．

4）進(jìn)行實(shí)驗(yàn)．

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

（2）被試明白了實(shí)驗(yàn)的要求以后，為其安置頭盔式眼動(dòng)儀，并設(shè)置好頭部相機(jī)和眼部相機(jī)，視角大約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）對(duì)被試進(jìn)注視點(diǎn)校準(zhǔn)、確認(rèn)和漂移修正．

（4）隨后開(kāi)始宣讀實(shí)驗(yàn)指導(dǎo)語(yǔ)．

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

（6）實(shí)驗(yàn)過(guò)程中主試記錄被試實(shí)驗(yàn)問(wèn)題答案．

（7）眼動(dòng)實(shí)驗(yàn)結(jié)束后發(fā)放態(tài)度問(wèn)卷，對(duì)被試進(jìn)行態(tài)度測(cè)量．

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

2 實(shí)驗(yàn)結(jié)果

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

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

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

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

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

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

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

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

2.3 興趣區(qū)分析

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

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

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

表4 實(shí)驗(yàn)第一部分方差分析結(jié)果

表5 實(shí)驗(yàn)第二部分的方差分析結(jié)果

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

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

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

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

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

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

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

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

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

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

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

圖10 被試對(duì)3種導(dǎo)航樣式的評(píng)價(jià)圖

圖11 被試對(duì)3種布局的喜好

3 結(jié)論與建議

3.1 結(jié)論

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

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

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

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

3.2 建議

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

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

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

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

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

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

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

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

[5] iViewX眼動(dòng)儀[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

賴(lài)麗花（1986-），廣東人，碩士，研究方向?yàn)橐曈X(jué)心理、平面設(shè)計(jì)、實(shí)訓(xùn)平臺(tái)建設(shè)等．