徐衛(wèi)衛(wèi)

（寧波經(jīng)貿(mào)學(xué)校，寧波315000）

0 引言

國(guó)內(nèi)部分關(guān)于“網(wǎng)頁(yè)設(shè)計(jì)”的論著往往是憑借經(jīng)驗(yàn)泛泛論述較多；設(shè)計(jì)的理論依據(jù)較為空洞，說(shuō)服力不強(qiáng)[1]；針對(duì)具體問(wèn)題（功能模塊）研究較少；采用心理實(shí)驗(yàn)研究法進(jìn)行嚴(yán)謹(jǐn)科學(xué)實(shí)證研究更少。梳理文獻(xiàn)資料后可得知“眼動(dòng)追蹤研究”和“網(wǎng)頁(yè)設(shè)計(jì)”之間沒有形成有機(jī)的互聯(lián)，往往只是針對(duì)于某一小模塊的探討，將兩者統(tǒng)一起來(lái)研究的并不多見，并且呈現(xiàn)出研究的不系統(tǒng)性[2]。所以基于系統(tǒng)的國(guó)內(nèi)外眼動(dòng)研究成果的網(wǎng)頁(yè)設(shè)計(jì)應(yīng)運(yùn)而生，力求給出一套系統(tǒng)、有科學(xué)依據(jù)的方法。在此背景下利用“眼動(dòng)追蹤”技術(shù)對(duì)網(wǎng)頁(yè)設(shè)計(jì)進(jìn)行定定量分析，對(duì)網(wǎng)頁(yè)結(jié)構(gòu)、內(nèi)容等的設(shè)計(jì)具有很強(qiáng)現(xiàn)實(shí)指導(dǎo)意義。本研究針對(duì)學(xué)生瀏覽教育網(wǎng)頁(yè)的“視覺偏好區(qū)域”進(jìn)行論證研究，為教育網(wǎng)頁(yè)優(yōu)化設(shè)計(jì)提供數(shù)據(jù)支撐。同時(shí)也可以給中小學(xué)教師進(jìn)行信息化教學(xué)實(shí)施過(guò)程，提供一個(gè)全新的審視視角[3]，論證設(shè)計(jì)的有效性、科學(xué)性。

1 實(shí)驗(yàn)假設(shè)（目的）

驗(yàn)證教育網(wǎng)頁(yè)頁(yè)面的“中上部”位置是其視覺的“優(yōu)勢(shì)區(qū)域”。

2 實(shí)驗(yàn)被試

實(shí)驗(yàn)對(duì)象為寧波大學(xué)本科生，涉及的學(xué)科有教育學(xué)、理學(xué)、工學(xué)、管理學(xué)、文學(xué)、經(jīng)濟(jì)學(xué)、法學(xué)、醫(yī)學(xué)等。隨機(jī)選取34 人（男16，女18），分為兩組，兩組男女人數(shù)分別相同。要求裸眼視力或矯正視力正常，不是色盲、色弱、閃光者，無(wú)眼動(dòng)實(shí)驗(yàn)經(jīng)驗(yàn)。

3 實(shí)驗(yàn)設(shè)計(jì)

采用被試內(nèi)實(shí)驗(yàn)設(shè)計(jì)，利用AB、BA 交互平衡法，先讓第一組（17 人）中每人先瀏覽教育網(wǎng)頁(yè)A，接著瀏覽教育網(wǎng)頁(yè)B；然后，讓第二組（17 人）中每人先瀏覽教育網(wǎng)頁(yè)B，再瀏覽教育網(wǎng)頁(yè)A。瀏覽時(shí)間被試自己控制。其中教育網(wǎng)頁(yè)的微觀結(jié)構(gòu)（“版塊”填充的信息內(nèi)容）為自變量，因變量為注視次數(shù)、注視時(shí)間。

4 實(shí)驗(yàn)材料、儀器

實(shí)驗(yàn)材料為兩張教育新聞網(wǎng)頁(yè)（如圖1 和圖2）。兩張網(wǎng)頁(yè)的宏觀結(jié)構(gòu)（布局方式）相同，但是微觀結(jié)構(gòu)不同（每個(gè)“版塊”填充的信息內(nèi)容不同）。為模擬真實(shí)操作環(huán)境，超鏈接均設(shè)為空鏈接。

實(shí)驗(yàn)采用瑞典Tobii T120 型眼動(dòng)儀（雙眼追蹤），采樣頻率為120Hz，屏幕分辨率為1280×1024 像素，被試眼睛距顯示器中心的距離為60-70cm，不需要佩戴頭盔。實(shí)驗(yàn)材料的呈現(xiàn)和數(shù)據(jù)的記錄、加工由其自帶的Tobii Studio 軟件完成。

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

實(shí)驗(yàn)在寧波大學(xué)教師教育學(xué)院“眼動(dòng)與生物反饋實(shí)驗(yàn)室”中進(jìn)行。該實(shí)驗(yàn)室有單獨(dú)的被試等候室，具有良好隔音功能，光線、溫度條件良好，并且被試無(wú)需帶頭盔，最大限度的模擬真實(shí)的操作環(huán)境，確保實(shí)驗(yàn)結(jié)果的可信度。實(shí)驗(yàn)由一名主試引領(lǐng)一名被試進(jìn)行個(gè)別測(cè)試，一名輔助人員在等候室接待被試及排序。

6 數(shù)據(jù)采集與處理

興趣區(qū)（AOI）劃分。本研究將每個(gè)實(shí)驗(yàn)材料分別劃分為五個(gè)興趣區(qū)（Area Of Interest，AOI），五個(gè)興趣區(qū)的面積相當(dāng)[1]。如圖1-圖2 所示：

圖1 教育新聞網(wǎng)A（五個(gè)興趣區(qū)）

圖2 教育新聞網(wǎng)B（五個(gè)興趣區(qū)）

根據(jù)上面劃分的興趣區(qū)，Tobii Studio 軟件會(huì)自動(dòng)生成相關(guān)眼動(dòng)數(shù)據(jù)，然后用Spss17.0 軟件對(duì)數(shù)據(jù)進(jìn)行統(tǒng)計(jì)分析[2]。

●教育新聞網(wǎng)A 五個(gè)興趣區(qū)在注視時(shí)間（fixation duration）維度上的分析

表1 教育新聞網(wǎng)A 五個(gè)興趣區(qū)注視時(shí)間的平均值和標(biāo)準(zhǔn)差

從表1 可以得出，AOI 1 的注視總時(shí)間明顯多于其他四個(gè)區(qū)域，AOI 1 注視時(shí)間的平均值除了較AOI 2 差別明顯外和其他三個(gè)的差異并不明顯。

表2 教育新聞網(wǎng)A 五個(gè)興趣區(qū)注視時(shí)間上的單因素方差分析

通過(guò)單因素方差分析可見，在注視時(shí)間上，F(xiàn)（4，34）=10.335，p<0.001，說(shuō)明網(wǎng)頁(yè)中區(qū)域的位置會(huì)對(duì)讀者在其區(qū)域內(nèi)的注視時(shí)間產(chǎn)生異常顯著影響。

為了能夠分析清楚五個(gè)興趣區(qū)它們兩兩之間差異的具體情況，進(jìn)一步進(jìn)行了事后多重比較研究（LSD），如表3。

表3 教育新聞網(wǎng)A 五個(gè)興趣區(qū)在注視時(shí)間上的事后多重比較（LSD）

從表3 可以看出，當(dāng)進(jìn)行興趣區(qū)在注視時(shí)間上兩兩比較時(shí)，AOI 1 和AOI 2 存在異常顯著的差異、AOI 1和AOI 3 是存在顯著差異，但是AOI 1 和AOI 4、AOI 5存在的差異沒有達(dá)到顯著水平；AOI 2 和其他各區(qū)的差異都達(dá)到了極其顯著水平；AOI 3 和其他各區(qū)差異都顯著；AOI 4 與 AOI 1、AOI 5 沒有顯著差異，與其他區(qū)域差異顯著；AOI 5 與 AOI 2、AOI 3 差異顯著，與其他區(qū)域差異不顯著。

綜合以上三個(gè)表格，AOI 1 明顯優(yōu)于AOI 2 和AOI 3，AOI 1 與 AOI 4、AOI 5 的差異不大，但是從總的注視時(shí)間上看，AOI 1 較AOI 4 和AOI 5 還是要具有相當(dāng)?shù)膬?yōu)勢(shì)。總之被試在不同的網(wǎng)頁(yè)區(qū)域可能會(huì)有不同長(zhǎng)度的注視時(shí)間，讀者對(duì)網(wǎng)頁(yè)的中上部區(qū)域（AOI 1）呈現(xiàn)出注視時(shí)間上特定的“區(qū)域偏好性”。

●教育新聞網(wǎng)A 五個(gè)興趣區(qū)的注視點(diǎn)個(gè)數(shù)（fixa?tion count）維度上的分析

表4 教育新聞網(wǎng)A 五個(gè)興趣區(qū)注視點(diǎn)個(gè)數(shù)的平均值和標(biāo)準(zhǔn)差

通過(guò)表4 可以得出，注視點(diǎn)個(gè)數(shù)的平均數(shù)和總數(shù)在AOI 1 里面是最多的，明顯多于其他四個(gè)區(qū)域，存在明顯的差異。

表5 教育新聞網(wǎng)A 五個(gè)興趣區(qū)在注視點(diǎn)個(gè)數(shù)上的卡方檢驗(yàn)

由表 5 可以看出，X2=68.993，p<0.001，所以 AOI 1和其他區(qū)域相比存在的差異極其顯著。說(shuō)明，網(wǎng)頁(yè)中的區(qū)域位置會(huì)對(duì)讀者在其區(qū)域內(nèi)的注視點(diǎn)個(gè)數(shù)產(chǎn)生很大影響。

根據(jù)以上的兩個(gè)表可以得出：AOI 1 中的注視點(diǎn)的平均數(shù)和總數(shù)明顯多于其他幾個(gè)區(qū)域，并且與其他區(qū)域在注視點(diǎn)個(gè)數(shù)上存在極其顯著的差異。

為了排除因?yàn)榫W(wǎng)頁(yè)內(nèi)容造成的教育新聞網(wǎng)A 中上部區(qū)域?yàn)椤皟?yōu)勢(shì)區(qū)域”，所以打亂A 網(wǎng)頁(yè)的內(nèi)容排列，但是網(wǎng)頁(yè)宏觀結(jié)構(gòu)不變，然后對(duì)教育新聞網(wǎng)B 進(jìn)行試驗(yàn)。

●教育新聞網(wǎng)B 五個(gè)興趣區(qū)注在“注視時(shí)間”（fix?ation duration）維度上的分析

表6 教育新聞網(wǎng)B 五個(gè)興趣區(qū)注視時(shí)間的平均值和標(biāo)準(zhǔn)差

從表6 可以看出，AOI 1 的注視總時(shí)間遠(yuǎn)遠(yuǎn)地超越了其他四個(gè)區(qū)，尤其是AOI 2。但是從平均數(shù)上看，五個(gè)區(qū)域的差異不明顯。

通過(guò)單因素方差分析可見，在注視時(shí)間上，F(xiàn)（4，34）=10.260，p<0.001，說(shuō)明，網(wǎng)頁(yè)中的不同區(qū)域會(huì)對(duì)讀者在其區(qū)域內(nèi)的注視時(shí)間的長(zhǎng)短產(chǎn)生異常顯著影響。

為了能夠分析清楚五個(gè)興趣區(qū)它們兩兩之間在注視時(shí)間上差異的具體情況，進(jìn)一步進(jìn)行了事后多重比較研究（LSD），如表 8。

表8 教育新聞網(wǎng)B 五個(gè)興趣區(qū)在注視時(shí)間上的事后多重比較LSD

從圖表8 中可以看出，當(dāng)進(jìn)行不同區(qū)域注視時(shí)間兩兩比較時(shí)，AOI 1 和AOI 2 存在極其顯著差異、AOI 1和AOI 3 是存在顯著差異，但是AOI 1 和AOI 4、AOI 5存在的差異沒有達(dá)到顯著水平；AOI 2 和其他各區(qū)的差異都達(dá)到極其顯著水平；AOI 3 和其他各區(qū)差異都顯著；AOI 4 與 AOI 1、AOI 5 沒有顯著差異，與其他區(qū)域差異顯著；AOI 5 與 AOI 2、AOI 3 差異顯著，與其他區(qū)域差異不顯著。

綜合以上三個(gè)表，對(duì)注視時(shí)間的影響上，AOI 1 明顯優(yōu)于 AOI 2 和 AOI 3，AOI 1 與 AOI 4、AOI 5 的差異不大，但是從注視總時(shí)間上看，AOI 1 較AOI 4 和AOI 5還具有相當(dāng)?shù)膬?yōu)勢(shì)?？傊辉囋诓煌木W(wǎng)頁(yè)區(qū)域可能會(huì)有不同長(zhǎng)度的注視時(shí)間，在注視時(shí)間上，讀者在網(wǎng)頁(yè)的中上部區(qū)域（AOI 1）呈現(xiàn)出特定的“區(qū)域偏好性”。

●教育新聞網(wǎng)B 五個(gè)興趣區(qū)注視點(diǎn)個(gè)數(shù)（fixation count）維度上的分析

表9 五個(gè)興趣區(qū)在注視點(diǎn)個(gè)數(shù)上的平均值和標(biāo)準(zhǔn)差

從圖表9 中可以看出，AOI 1 平均注視點(diǎn)個(gè)數(shù)最多，注視點(diǎn)總個(gè)數(shù)最多，AOI 2 最少，AOI 3、AOI 4、AOI 5 差異不大。

表10 教育新聞網(wǎng)B 五個(gè)興趣區(qū)在注視點(diǎn)個(gè)數(shù)上的卡方檢驗(yàn)

由表 10 可知，X2=68.993，p<0.001，所以 AOI 1 和其他區(qū)域在注視點(diǎn)個(gè)數(shù)上相比存在的差異極其顯著。說(shuō)明，網(wǎng)頁(yè)中的不同區(qū)域會(huì)對(duì)讀者的在其區(qū)域內(nèi)的注視點(diǎn)個(gè)數(shù)產(chǎn)生很大影響。

綜合以上兩個(gè)表得出，在注視點(diǎn)的個(gè)數(shù)上，AOI 1相對(duì)于其他區(qū)域占有明顯的優(yōu)勢(shì)，是注視點(diǎn)個(gè)數(shù)最多的區(qū)域。

7 研究討論

網(wǎng)頁(yè)的“中上部”區(qū)域是被試的頁(yè)面“興趣區(qū)”（視覺偏好區(qū)），表現(xiàn)在不論是在注視時(shí)間上，還是在注視點(diǎn)的個(gè)數(shù)上，相對(duì)于其他區(qū)域來(lái)說(shuō)AOI 1 都占有明顯優(yōu)勢(shì)，并且表現(xiàn)出與其他區(qū)域存在較大的差異性。

通過(guò)教育網(wǎng)頁(yè)A 與教育網(wǎng)頁(yè)B 比對(duì)還可以得出：被試在網(wǎng)頁(yè)上的視覺偏好區(qū)域跟頁(yè)面的空間位置存在必然聯(lián)系，跟網(wǎng)頁(yè)空間位置放置的“信息內(nèi)容”關(guān)聯(lián)很小[3]。

該結(jié)論對(duì)網(wǎng)頁(yè)設(shè)計(jì)的科學(xué)性和商業(yè)價(jià)值具有較強(qiáng)指導(dǎo)作用。教學(xué)能力大賽、優(yōu)質(zhì)課比賽信息化教學(xué)設(shè)計(jì)模塊，以此結(jié)論為指導(dǎo)進(jìn)行有效設(shè)計(jì)，爭(zhēng)取在效果和理論職支撐上分別取得理想成績(jī)。