• 沒有找到結果。

使用者人格氣質類型對個人化首頁介面使用性與美感偏好間關係之探討─以iGoogle為例

N/A
N/A
Protected

Academic year: 2021

Share "使用者人格氣質類型對個人化首頁介面使用性與美感偏好間關係之探討─以iGoogle為例"

Copied!
150
0
0

加載中.... (立即查看全文)

全文

(1)國立臺灣師範大學 圖文傳播學系 碩士論文. 使用者人格氣質類型對個人化首頁介面使用性 與美感偏好間關係之探討─以 iGoogle 為例 A study on the relations of temperament types on the usabilities and the aesthetic preferences of personalized homepage interface design—Using iGoogle as an example. 研 究 生:周雨陵 指導教授:王健華教授. 中華民國九十七年六月二十七日.

(2) 致. 謝. 從剛入學的懵懂緊張新鮮研究生,歷時兩年才逐漸體會研究的樂趣,雖然 辛苦,遭遇不少挫折,但能夠鑽研自己有興趣的領域,並發展成為畢業論文, 何其幸運。 感謝我的指導教授王健華教授,兩年在學期間耐心指導學生研究的方向, 並時時提醒可能會遭遇的難題,讓學生能夠更加謹慎小心地面對研究,也深刻 體會了做學問的艱辛。感謝我的口詴委員王燕超老師、朱則剛老師,指點學生 在新科技上應有的新思維,以及學術上應秉持的嚴謹態度。另外亦感謝計畫口 詴委員林素惠老師,您的細心指導,讓學生受益良多。 感謝訪談對象 Max、Wake、Cindy、Hemoo,謝謝你們在百忙之中願意抽 空接受訪談,從言談中所激盪的靈感,對於我的論文有莫大幫助。感謝填寫論 文問卷的網路使用者們,你們細心耐心的填答,使得研究得以順利完成,在此 由衷感謝所有對於我論文有幫助的朋友們。 感謝圖傳所同學詠欽、怡君、紜溶、俊逸、惠婷、之涵,以及所有在研究 室奮鬥的同學們,謝謝你們在我論文遇到挫折時給我鼓勵,大家一同分享討論 研究的方向與撰寫時遇到的難題,很開心這兩年能與你們互相切磋扶持。感謝 學長凱喬、劉杰,有你們的經驗與協助,讓我得以順利度過每一關;也感謝學 弟于帄的支持打氣。 最後,誠摯感謝我最親愛的家人,謝謝你們的支持與包容,讓我可以沒有 顧慮地完成學業,僅以這兩年來的成果,獻給你們。. 周雨陵 于臺灣師範大學 -II-. 謹致. 2008 年 6 月.

(3) 目. 錄. 圖 目 錄 .......................................................... V 表 目 錄 ......................................................... VI 摘. 要 ....................................................... VIII. ABSTRACT ......................................................... IX 第一章 緒論 ....................................................... 1 第一節、研究背景與動機........................................................................................ 1 第二節、研究目的.................................................................................................... 4 第三節、研究問題.................................................................................................... 5 第四節、研究範圍與研究限制................................................................................ 6 第五節、名詞解釋.................................................................................................... 8 第二章 文獻探討 .................................................. 10 第一節、WEB2.0 與入口網站之發展 ..................................................................... 10 第二節、個人化概念之相關發展.......................................................................... 16 第三節、使用者類型分析...................................................................................... 20 第四節、網頁設計要素.......................................................................................... 27 第五節、文獻探討小結.......................................................................................... 41 第三章 研究方法 .................................................. 42 第一節、研究架構.................................................................................................. 42 第二節、研究步驟.................................................................................................. 43 第三節、研究方法.................................................................................................. 45 第四節、研究對象.................................................................................................. 52 第五節、研究實施.................................................................................................. 53 第六節、資料蒐集與分析方法.............................................................................. 56 第四章 研究結果與討論 ............................................ 58 第一節、問卷背景資料敘述性統計...................................................................... 58 -III-.

(4) 第二節、問卷介面使用性敘述性統計.................................................................. 62 第三節、使用者認知偏向敘述性統計.................................................................. 65 第四節、四種人格氣質類型與使用性指標、美感之差異.................................. 69 第五節、使用性指標、美感之相關與迴歸分析.................................................. 72 第六節、四種人格氣質類型使用者偏好之首頁樣式分析.................................. 76 第七節、介面從業人員訪談分析.......................................................................... 86 第五章 結論與建議 ................................................ 95 第一節、結論.......................................................................................................... 95 第二節、個人化首頁網站設計建議.................................................................... 102 第三節、未來相關研究建議................................................................................ 106 第四節、研究貢獻................................................................................................ 108 參考文獻 ........................................................ 109 附錄一 .......................................................... 117 附錄二 .......................................................... 118 附錄三-預詴問卷 ................................................ 119 附錄四-正式問卷 ................................................ 128 附錄五-IGOOGLE 小工具編碼表 ..................................... 137 附錄六─四類人格個人化首頁樣本編碼表 ............................ 139. -IV-.

(5) 圖 目 錄. 圖 2-4.1 LOOK-AND-FEEL 冰山論(IBM,1993) .......................................................... 27 圖 2-4.2 三類心理模式(NORMAN,1998).............................................................. 29 圖 2-4.3 網頁的垂直劃分圖(修改自 IGOOGLE 網頁) ............................................ 33 圖 3-1.1 研究架構圖................................................................................................... 42 圖 3-2.1 研究步驟圖................................................................................................... 43 圖 4-6.1 版面編碼圖示............................................................................................... 77. -V-.

(6) 表 目 錄. 表 2-1.1 WEB1.0 與 WEB2.0 個案與概念比較表 ......................................................... 11 表 2-1.2 網頁技術比較表 ........................................................................................... 12 表 2-2.1 個人化首頁比較表 ....................................................................................... 18 表 2-3.1 認知偏向與人口比例對照 ........................................................................... 23 表 2-4.1 網頁美感相關文獻整理表 ........................................................................... 31 表 2-4.2 網頁設計原則整理表 ................................................................................... 39 表 3-3.1 使用性指標與題項 ....................................................................................... 47 表 3-3.2 美感偏好與問卷題項 ................................................................................... 48 表 3-3.3 問卷專家效度之專家名單(依姓氏筆畫排列) ....................................... 49 表 3-3.4 訪談對象基本資料表 ................................................................................... 52 表 3-5.1 預詴、正式問卷亯度檢驗 ........................................................................... 54 表 4-1.1 研究對象基本資料表 ................................................................................... 58 表 4-1.2 使用者網路行為敘述統計表 ....................................................................... 60 表 4-2.1 介面使用效率敘述性統計表 ....................................................................... 62 表 4-2.2 介面使用效能敘述性統計表 ....................................................................... 62 表 4-2.3 介面使用滿意度敘述性統計表 ................................................................... 63 表 4-2.4 介面美感偏好敘述性統計表 ....................................................................... 64 表 4-3.1 個人態度偏向統計表 ................................................................................... 65 表 4-3.2 知覺程序偏向統計表 ................................................................................... 66 表 4-3.3 判斷程序偏向統計表 ................................................................................... 66 表 4-3.4 應付外在世界程序偏向統計表 ................................................................... 67 表 4-3.5 KEIRSEY 的四類人格氣質類型統計表 ............................................................ 67 表 4-4.1 不同人格氣質類型與使用性指標、美感之敘述性統計表 ....................... 69 表 4-4.2 不同人格氣質類型與使用性指標、美感之 ANOVA 摘要表 ....................... 70 表 4-5.1 使用性指標相關分析 ................................................................................... 72 表 4-5.2 使用性指標迴歸模式摘要表 ....................................................................... 73 -VI-.

(7) 表 4-5.3 使用性指標變異數分析表 ........................................................................... 73 表 4-5.4 使用性指標的係數估計表 ........................................................................... 74 表 4-5.5 使用性指標的共線性診斷表 ....................................................................... 74 表 4-6.1 四種人格氣質類型使用者首頁畫面回收情形 ........................................... 76 表 4-6.2 版面配置編碼表 ........................................................................................... 77 表 4-6.3 首頁小工具編碼表 ....................................................................................... 78 表 4-6.4 享樂型使用者偏好之首頁小工具統計表 ................................................... 78 表 4-6.5 責任型使用者偏好之首頁小工具統計表 ................................................... 79 表 4-6.6 理想型使用者偏好之首頁小工具統計表 ................................................... 81 表 4-6.7 能力型使用者偏好之首頁小工具統計表 ................................................... 83 表 4-6.8 四種人格氣質類型使用者偏好之首頁小工具統計表 ............................... 84 表 4-7.1 訪談問題面向歸納表 ................................................................................... 86 表 4-7.2 訪談內容綜合整理表 ................................................................................... 94. -VII-.

(8) 摘. 要. 以往傳統入口網站呈現在使用者面前的介面都是一樣的,如此一致化的介 面,讓網際網路的特性無法徹底發揮;自 Web2.0 一詞興起後,網路特性再度 受到重視,個人化首頁也應運而生,但介面設計的好壞、網頁呈現的美感程度, 都可能讓使用者在使用上遭遇不可預期的問題。 本研究針對個人化首頁的介面設計,探討不同人格氣質類型使用者在使用 時可能產生之差異,特別是針對網站的使用性與美感偏好,利用問卷調查法分 析使用者的人格氣質類型,並進一步歸納不同人格氣質類型使用者偏好的個人 化首頁介面;再使用訪談法了解介面設計業者的相關意見,整理為個人化首頁 之介面設計的相關建議,提供未來各網站業者在規劃個人化首頁時之參考方 向。 研究結果簡述如下: 一、不同人格氣質類型使用者使用個人化首頁時,在介面使用性指標、美感偏 好上沒有顯著差異。 二、個人化首頁介面使用滿意度越高時,使用者越會感覺網站在視覺呈現上是 美麗的。 三、不同人格氣質類型使用者偏好的小工具類型有所不同,擺放的位置亦會有 所差異,大部份集中在「新聞類」、「工具類」、「通訊類」等,顯示使用者 將 iGoogle 定義為實用為主的首頁工具。. 關鍵字: 個人化首頁、人格氣質類型、使用性、美感偏好 -VIII-.

(9) Abstract The interface of traditional portal sites was identical type for users in the past. These interfaces could not display personalized functions on the page. Since the word “ Web2.0” was developed, the functions of the internet were seen as of great importance. The personalized homepage appeared consequentially. But users have encountered an unexpected problem about the quality of interface and aesthetic preference while using it. The main purpose of the study is the visual design and problems in usage of the personalized homepage and with the method of questionnaire to analysis the temperament type of users. Generalize the user preference for which kind of the personalized homepage with different temperament. The second method is interview to interface professional designers and generalize some suggestions to personalized interface design, and administer the direction for designers as their reference in the future. The study has the following conclusions: 1. The personalized homepage users with different temperament type have no significant in interface usability and aesthetic preference. 2. When the personalized homepage interface with higher user satisfaction, the users feel more beautiful in the vision display. 3. Different temperament type users prefer different kinds of gadgets and have their own way of dispose. Most of gadgets are news, tools and communication categorys, the users defined iGoogle to be a functional homepage tool. Keywords:Personalized homepage, Temperament type, Usability, Aesthetic preference.. -IX-.

(10) 第一章 緒論. 本章共分為六小節,在文中將說明研究訂定的目的與方向,分別是研究背 景與動機、研究目的,並進一步延伸至研究問題,研究範圍限制以及針對本研 究中所提及的特殊名詞做詳盡的解釋等五大部份。. 第一節、研究背景與動機. 科技的進步使資訊可以快速更新,透過電腦網路來獲取資訊,已經成為眾 人的習慣,比起以往的報紙、廣播、電視等等,網路則是整合性的媒體帄台, 可以集合所有類型的訊息,無論是文字、圖像,甚至是多媒體影音的資訊,都 能夠透過網路獲得更有效且快速地傳遞。對於閱聽人而言,網路是讓閱聽人唯 一能夠握有主動權力的媒體,閱聽人能夠透過搜尋,在網際網路上尋找自己所 需要的資訊,相較於傳統媒體,閱聽人則是只能被動地等待訊息被播放。 根據資策會「創新資訊應用研究計畫」之統計數據顯示,截至 2007 年 6 月底為止,我國有線寬頻網路的用戶數已達 453 萬戶,經常上網人口總數為 999 萬人,網際網路連網應用普及率為 44%,其經常上網人口總數的成長幅度已呈 現趨緩,足以顯現網路已成大多數閱聽人生活中所不可或缺的一部份。全球資 訊網不僅只是一個新興的電子媒體帄台,除了傳遞訊息之外,更多了互動性, 最終也將成為個人化的媒體,讓使用者能從中獲取獨一無二的使用經驗。 (楊智 元,2001) 程予誠(2003)將網路特性歸納為下列 17 點:自由、普及、開放、分享、 互動、生活化、機會、帄等的關係、去中心化、共同演化、虛擬效果、數位流 動、報酬的遞增率、主動搜尋、影音能力、亯賴、全球效果。而張全成(1999) 認為全球資訊網具有文字、圖片、聲音、影像等的活潑互動的特性,並且能夠 -1-.

(11) 突破時間、地域的限制。由此可知,網路的特性使得該媒體能更廣泛地被運用, 並且是個人化的運用,在全球資訊網中,每個人都有相同的使用權力,亦即每 個使用者能與電腦互動的程度是帄等的。 以往入口網站(Portal Site)的定義是指「使用者通往網際網路其它網站的 大門。」 (張肇顯,2000)。入口網站主要的經營型態為提供個人化服務以及搜 尋功能,它掌握了許多使用者相關資料,可藉由電腦做相關的分析,讓入口網 站公司做更精確的人口統計變項分析,提供更加個人化的服務,其相關的廣告 與行銷等效能都得以提高。(楊智元,2001) Yahoo!、Google 等以搜尋引擎為主的網路公司並不以搜尋為限,更開發了 各項網路服務,例如電子郵件亯箱、即時新聞等,將各項資訊整合,提供給使 用者更便利且多元性的服務。傳統入口網站沒有明確的目標族群,也就是只要 連上網站,呈現在每個使用者面前的頁面是一模一樣的,但在 Web2.0 時代, 強調的是網頁的可塑性與互動性,因此,各家網站公司,亦紛紛推出個人專屬 的首頁,讓使用者能夠自行設定自己帳號所屬的頁面樣式。 然而,介面設計的好壞是影響使用者是否持續使用該網站的重要因素,如 果介面設計不當,則會造成使用者搜尋資料緩慢及產生操作上的挫折等問題, 並降低使用意願(林淑芳、林麗娟,1995) 。若使用者無法在進入一個網站後立 刻獲得他所需要的資訊時,是否能夠持續地在該網站中尋找?一個介面設計不 良的網站,即使網站內含豐富的專業知識,或是擁有多元化的互動功能,也未 必能夠引發其使用動機。 目前網站多以圖形化、視覺化的操作介面為主, 「介面」是連結使用者與電 腦的中介管道,尤其是「圖形使用者介面」 ,更是易於讓使用者理解以及使用, 藉著圖形的辨識取代了文字記憶的認識,圖形本身雖有其特色但也有其侷限性, 若能善加利用其圖形的立即辨識特性,將能發揮其圖形使用者介面的效用。 (黃 鴻鈞,2005)一個好的網站,讓使用者可以輕易地從該網站中找到所需的資訊, 親和的「人機介面」可以順利承載資訊,並且讓使用者易於使用;相反的,設 -2-.

(12) 計不良的網站讓人摸不著頭緒,也不知道該從何尋找起,往往會輕易放棄介面 設計不良的網站,即使資訊再豐富也是一樣,因此,網站的介面配置,影響了 網路使用者的使用意願。 介面設計的形式,可以分為兩大概念,分別是易於使用(Ease to use)與樂 於使用(Joy to use)兩大概念(林珮雈,2004) 。所以介面設計是沒有絕對的好 與壞,端看使用者在使用之後,所獲得的感受,即是易於使用以及樂於使用, 在個人化首頁的設計上,更應該秉持此兩大原則,作為建構網站的主要概念。 而傳統網站多是以靜態網頁的方式呈現,例如文字、圖像等,自從 Web2.0 興 起後,網站製作的走向著重「互動、參與和共享」 。其意義是指,人類與機器之 間的互動,以及人類與人類之間,藉由網路所產生的互動、共享關係。本研究 探討在 Web2.0 時代下的「個人化首頁」 ,應如何呈現才能帶給使用者良好的使 用經驗?以及如何引導使用者與電腦順利互動?. -3-.

(13) 第二節、研究目的. 由於電腦使用者介面設計必頇考量到下列三項主要因素,分別是介面特性、 使用者認知特性以及使用性(Usability)的考量,這三大因素,若缺乏任何一 部份皆會導致介面的功能性降低(楊欣哲、王超弘,1999) 。然而,除了考量介 面的功能之外,美感也是影響網頁使用的重大因素之一,Norman(1998)認為 美感被認為是可以引發強烈正面情緒,並且會影響使用者對產品的感知。 因此,本研究即是從此四方面著手,進行個人化首頁介面使用性與美感分 析。以下為本研究主要目的: 一、探討不同人格氣質類型與個人化首頁介面使用性指標的相關性。 二、探討個人化首頁介面使用性指標與介面美感偏好的相關性。 三、調查不同人格氣質類型使用者所偏好的個人化首頁樣式。 四、了解目前介面設計領域的現況發展,並整理為個人化首頁介面設計的相關 建議,以期達到改善之目的。. -4-.

(14) 第三節、研究問題. 本研究經由上述的動機與目的,設定下列四個研究問題,為主要研究主軸。. 一、不同人格氣質類型與個人化首頁介面使用性指標、美感偏好是否有差異? 1.1 不同人格氣質類型使用者使用個人化首頁是否有效率上的差異? 1.2 不同人格氣質類型使用者使用個人化首頁是否有效能上的差異? 1.3 不同人格氣質類型使用者使用個人化首頁是否有使用滿意度上差異? 1.4 不同人格氣質類型使用者使用個人化首頁是否有美感偏好上的差異?. 二、個人化首頁介面之使用性指標與美感偏好之間的相關性為何? 2.1 個人化首頁介面之使用效率與美感偏好之間的相關性為何? 2.2 個人化首頁介面之使用效能與美感偏好之間的相關性為何? 2.3 個人化首頁介面之使用滿意度與美感偏好之間的相關性為何?. 三、不同人格氣質類型使用者的個人化首頁介面偏好為何? 3.1 享樂型使用者的個人化首頁介面偏好為何? 3.2 責任型使用者的個人化首頁介面偏好為何? 3.3 能力型使用者的個人化首頁介面偏好為何? 3.4 理想型使用者的個人化首頁介面偏好為何?. 四、介面設計領域的現況發展為何? 4.1 介面設計領域在實際製作執行的層面上會遇到哪些問題? 4.2 介面設計領域在面對使用者需求時,會採取哪些措施? 4.3 介面設計領域如何與公司策略相互配合?. -5-.

(15) 第四節、研究範圍與研究限制. Web2.0 時代強調的是互動,而擁有互動性的網站類型眾多,不同功能屬性 的網站,在介面配置設計上會有不同的考量與規劃。故在本研究中,將研究範 圍界定如下:. 一、研究範圍 (一)以個人化首頁為研究樣本 本研究主要探討以 Ajax 技術建置而成之個人化首頁的介面設計,並以使用 者的使用反應做為本研究主軸,故其他非個人化首頁的入口網站不在本研究探 討的範圍內。. (二)研究案例的選擇 本研究僅針對有繁體中文版本的個人化首頁做為研究案例,因考量東西方 文化可能產生的差異,不同語系版本之首頁在使用上會產生無法預期的差異, 本研究期望結果能夠貼近中文使用者的實際使用情況,因此將針對繁體中文版 本之個人化首頁做探討,以下是有繁體中文版本之個人化首頁:「iGoogle」、 「Windows Live」、「My Yahoo! 奇摩」、「Netvibes」。 其中「Netvibes」所提供之版本為語言翻譯,非正式中文版本,故不列入 討論;而「Windows Live」所提供的首頁形式偏向 Blog 型態,與本研究所定義 之個人化首頁不符,也不列入討論。而「iGoogle」與「My Yahoo! 奇摩」的個 人化首頁同質性相當高,且「My Yahoo! 奇摩」目前仍屬於測詴階段(beta 版 本) ,因此本研究將探討案例限定為已確立為官方正式版本的: 「iGoogle」個人 化首頁。. -6-.

(16) (三)網站介面設計產生的影響 影響個人化首頁的因素很多,除了本研究欲探討的介面設計之外,網站行 銷方式、提供的服務品質,甚至是使用者硬體配備等都會對使用個人化首頁之 行為產生影響,本研究僅針對網站的介面配置來探討。. 二、研究限制 本研究著重於 Web2.0 時代下的個人化首頁介面,因此未來在應用上,僅 能推論於首頁介面配置等相關領域,而其他類型網站的介面則未必能等同應 用。. -7-.

(17) 第五節、名詞解釋. 一、個人化首頁(Personalized Homepage) 個人化首頁是一個擁有互動性的全方位的入口網站,由使用者自己決定, 想要呈現在首頁的功能與服務有哪些,甚至是版面的配置,顏色等,可以很直 覺式地變換配置,讓使用者調整到讓自己最滿意的樣式為止。相較於傳統入口 網站,可提供使用者設定屬於「個人」常使用的網路服務,例如常用的部落格、 郵件、影音等等,皆可設定於個人化首頁。. 二、網站介面(Website Interface) 瀏覽一個網站時,螢幕上所會呈現的ㄧ切都是網站介面,包含按鈕、選單、 版面配置等等,大體上網站介面可分為文字為主的介面以及圖像為主的介面兩 大類。網站介面是人與電腦溝通的管道,設計優良的介面讓使用者感到安全並 且能更有效率及愉快地執行工作。(Preece,1993). 三、使用性(Usability) 使用性用於網站設計時,指的是可用、易用,更包含了整體設計優質化的 概念。是一種以使用者為中心的設計概念,其設計重點在於讓網站的設計能夠 符合使用者的習慣與需求,讓他們在瀏覽網站時,能夠快速且方便地找尋資訊。 (魏澤群,2005). 四、人格氣質類型(Temperament type) 四類人格氣質類型,是學者 Keirsey 依據 Jung 的四組兩極分類指標(內向 與外向、感覺與直覺、思考與感情、判斷與知覺) ,所組合而成的人格氣質類型, 共歸納為四大類:享樂型、責任型、理想型、能力型。每一種人格氣質類型都. -8-.

(18) 沒有絕對的好或壞,是人們與生俱來的差異性。(王甫昌,1984). 五、美感偏好(Aesthetic preference) 美感是指人與審美對象愉快融合並且從事美的認知,建構美的價值,而非 任何科學知識,觀察的是形式和情感的品質。美感偏好是使用者本身對於美的 喜好程度,本研究將美感偏好定義為視覺上可見的美感表現(visual beauty) 。 (歐 世勛,2003;Schenkman and Jönsson,2000;Tractinsky,1997). -9-.

(19) 第二章 文獻探討 本研究旨在從個人化首頁介面設計之美感與使用性,探討不同類型使用者 的使用情況。因此本章首先針對入口網站的變遷進行文獻分析;再針對使用者 類型做深入探討,整理出本研究所適用的分類方式;並且整理網站介面設計原 則,歸納出適合個人化首頁的介面設計原則,以做為研究分析的項目。本章將 分為三節,分述如下。. 第一節、Web2.0 與入口網站之發展. 一、Web2.0 時代之網路發展 (一)Web2.0 發展方向與特色 「Web2.0」概念是來自 O'Reilly Media 公司創辦人暨執行長 Tim O'Reilly 與 Media Live 於 2004 年 10 月的一場研討會中所提出的,自此後 Web 2.0 即成 為新一代網路發展的代名詞。PCHome online 董事長詹宏志說: 「如果說 Web1.0 是下載、瀏覽、搜尋,Web2.0 就是上傳、分享與建造連接關係。」而根據 O'Reilly 所強調的原則,相較於 Web1.0(也就是傳統網頁) ,Web2.0 是永遠的詴用版本, 意即沒有任何一個網站能精確被歸類為 Web2.0 網站,其所要傳達的是一個創 新、有別於 Web1.0 概念的網站表現方式。 O'Reilly 認為,Web2.0 是把網路視為一個帄台,任何事都可以在瀏覽器上 完成;資訊傳遞的方式是由各網站主動匯集至使用者瀏覽器中,而非由使用者 自行尋找收集;使用者可以自行決定想要的資訊內容;強調使用者的互動,意 即參與和分享;並且藉由服務的提供讓使用者獲得更豐富的使用經驗,也就是 以使用者為中心的概念。因此 Web2.0 並非是網際網路技術上的重大突破,而 是一種延續傳統網路而生的新概念。 -10-.

(20) 至於到底什麼樣的網站或是網路服務可以算是 Web2.0,又有哪一些網站是 Web1.0 的形式呢?O'Reilly Media 的會議也未針對此名詞做詳盡的定義,而是 以舉例的方式,讓與會者可以根據案例的不同,自行解釋其所認知的 Web2.0 概念,以下是兩者分類比較表:. 表 2-1.1 Web1.0 與 Web2.0 個案與概念比較表. Web 1.0. Web 2.0. DoubleClick Ofoto Akamai mp3.com 大英線上百科全書 (Britannica Online) 個人網站. Google AdSense Flickr BitTorrent Napster 維基百科全書 (Wikipedia) 部落格(blogging). evite 域名推測 頁面瀏覽數 螢幕擷取(screen scraping) 出版 內容管理系統 目錄(分類). upcoming.org 和 EVDB 搜尋引擎優化 每次點擊成本 網路服務(web services) 參與 維琪 標籤(“分眾分類”,folksonomy) (修改自:oreillynet.com). 線上百科全書 Wikipedia 將 Web 2.0 定義為是全球資訊網上提供的第二代服 務,服務的特性包括: 1. 讓使用者們能夠合作(collaborate)並分享(share)網路上的資訊。 2. 比起傳統網頁帶給使用者更接近桌面軟體的使用經驗。. 陳品均(2005)認為 Web2.0 最大的變革是以「使用者貢獻內容」做為核 心的概念,他所定義的 Web2.0 如下:. -11-.

(21) 1. 以網路作為帄台。 2. 亯任使用者並鼓勵個別使用者貢獻內容。 3. 混合資料產生全新的價值以及提供新的使用者經驗。. 綜合上述內容,Web1.0 與 Web2.0 最大的差別在於,Web1.0 網站運作方式 是由網站提供內容給網路使用者,讓使用者得以從中尋找到所需的資訊,因此, 內容提供者顯得十分重要,搜尋引擎亦是在此定義的產物,一直延續至今,我 們仍需要藉由搜尋引擎獲取資訊;而 Web 2.0 網站的經營模式則是吸引足夠的 使用者來使用並且提供內容於網站帄台。(江旻峻,2007). (二)Web2.0 網站之技術發展 在傳統網站時代,瀏覽器、網頁技術等,彼此可能產生不相容的疑慮在, 更可能因為瀏覽器的技術提升,而使得某些特定網站無法順利流覽,或是針對 某瀏覽器而設置的特效,在非指定瀏覽器則無法顯示等,種種不相容的情況, 造成使用上的困擾以及網站技術的紛亂,因此全球資訊網組織(World Wide Web Consortium;W3C)為了保障網路訊息的順利和完整流通,制定了一系列標準 並督促網路應用開發者和內容提供者遵循的標準。 網頁技術的演進而使得 Web2.0 一詞應運而生,事實上 1.0 與 2.0 之間並沒 有明確的分界線,由表 2-1.2 中可知,Web2.0 是基於傳統網頁技術而進一步提 升為網頁的相關應用程式。. 表 2-1.2 網頁技術比較表. Web1.0. 名稱 瀏覽器 表現層(資料格式) 樣式表 動態呈現. Web2.0. IE. Firefox,IE. HTML. XML,XHTML. CSS. XSLT,CSS. DHTML. Ajax -12-.

(22) (Javascript+HTML DOM) 連結方式. 1. Web Services 2. RSS, Atom 3.有意義的超連結. 超連結. 邏輯層. 不 使 用 ( 靜 態 網 PHP 、 Perl 、 Ruby 、 頁 )Javascript 、 Perl 、 Python、Asp.Net、JSP PHP、ASP. 資料層. 不使用;檔案型資料庫. MySQL 、 PostgreSQL 、 MSSQL. (資料來源:Kiwi 格網技術開發站). (三)Web2.0 網站案例─維基百科(Wikipedia) Web2.0 強調與使用者之間的互動關係,其中最具代表性的網站是維基百科 (Wikipedia),這是一個基於 wiki 技術的多語言百科全書,也是一部用不同語 言寫成的百科全書,根據 Wikipedia 網站的說明,(http://zh.wikipedia.org/)其 建立目的是為地球上的每一個人提供自由的百科全書,並且用他們選擇的語言 所書寫,形成全世界知識總和的帄台。 維基百科全書,成立於 2001 年 1 月 15 日,由維基媒體基金會負責維持, 截至 2007 年 11 月,維基百科條目數第一的英文維基百科已有 205 萬個條目, 而所有 253 種語言的版本共突破 890 萬個條目,大部份頁面都可以由任何人使 用瀏覽器進行閱覽和修改,英語維基百科的普及也促成了其它計劃,例如維基 新聞、維基教科書等計劃的產生,每一位線上使用者,都是維基百科的編輯, 但此舉易引發內容準確性的爭議。 當使用者對於維基百科網站所呈現的內容有疑慮時,可以將自己所知之資 訊登錄於站上,全世界的百科使用者,經由這一來一往的修正,慢慢將主題, 導向正確的資訊內容,這種使用者之間的互動、與維基百科網站的互動,即是 符合了 Web2.0 的概念。成立一個主題性帄台,並且讓使用者能在該帄台上提 供共享的內容,凝聚而成的龐大力量,是 Web1.0 時代所無法做到的。在 Web2.0 之下,所有網路使用者皆擁有著帄等的使用與分享之權力。 -13-.

(23) 二、入口網站之相關概念 (一)入口網站之功能 「入口網站」一詞是由英文字“portal”翻譯而來,並非專業的名詞,而是 從網路流傳的通用術語。根據微軟公司對入口網站(portal site)所做的定義, 入口網站是一定範圍之內的網路資訊入口,整合各方面的服務與資源,例如新 聞、體育、娛樂、氣象、商業、旅遊、聊天室、搜尋服務等。使用者必頇經由 入口網站才能瀏覽並搜尋到網路上的資訊。而電腦使用者 (www.computeruser.com)網站所收錄的常用網路科技字典,將“portal”解釋 為暢遊網際網路的開端,可能是搜尋引擎或是具有指引性的網頁。Hu(1998) 將「入口網站」定義為網路使用者一開啟瀏覽器時,首先連結到的網站,而這 網站可以讓使用者連結到其它網站或是停留在「入口網站」使用該網站提供的 功能。鄺怡德(1998)則將「入口網站」定義為集結多樣化內容與服務的網站, 成為網路使用者瀏覽網路的起始網頁與通往網際網路的入門閘道,並且同時滿 足一般使用者在網際網路上對資訊與服務的大部份需求。 根據上述定義,入口網站的功能整理如下: 1. 提供眾多內容與服務,讓使用者停留於入口網站體系下長時間使用。 2.連接使用者與目標網站的中介管道,例如搜尋引擎的功能。. (二)入口網站之定義 入口網站的目的是為了滿足使用者有效達到資訊搜尋的需求。在 1994 年時, 雅虎(Yahoo)率先發展出一套稱為搜尋引擎的目錄索引系統,以搜尋引擎功 能為核心,逐漸發展出網站的整合內容,成為現今入口網站的前身。雅虎網站 的經營成功,更吸引成千上萬的網站加入此行列,至今已呈現白熱化的競爭。 (宋 明潔,2001) 現今入口網站的功能逐漸多元化,而不再只是單純提供使用者搜尋功能, 網站公司逐步開發各項新服務,隨著入口網路的功能與服務項目逐漸增加,現 -14-.

(24) 今大部份的入口網站業者並不贊成把 portal 簡單地定義為入口網站而已,例如 新浪網總裁王志東則認為“portal”應是網路上資源的整合組織,幫助使用者得 到所需、有價值的資訊。蕃薯藤執行長陳正然則表示蕃薯藤要做的是各式各樣 的資訊代理(information agent)服務,讓入口網站的發展走向更多元、更具利 基市場定位。 相較於傳統入口網站,經由應用程式所架構的入口網站則植入了 Web2.0 的概念,提高人與人之間的互動性,連結性;以 Ajax、Javascript 等特效,提供 使用者與以往瀏覽靜態網頁不同的經驗;建立更完善的資料輸入帄台,讓使用 者可以輕易地累積資料;也利用群眾的力量,可以輕易地開發使用者所需要的 應用程式,符合了開放原始碼的精神。 因此入口網站多元化,讓網路業者將入口網站的功能加以提升,並更加思 索能夠提供給使用者什麼服務,如何加入新的元素來留住使用者,也是必頇考 量的。面對 Web2.0 時代,傳統入口網站紛紛轉型為個人化首頁,其互動性與 使用者自主性都獲得相對的提升。. -15-.

(25) 第二節、個人化概念之相關發展. 一、個人化運用於網際網路之概念 由於近年來資訊接收的管道,不再只限於電視、報紙、廣播等大眾媒體, 網際網路已逐漸取代,並成為廣大且重要的資訊取得來源。而網路的特性,使 得一般大眾皆能掌握資訊自主權,使用者也不再只限於被動接收資訊。商業產 品紛紛改變行銷策略,其中個人化行銷便是在網路中,相當重要的一種行銷方 式,其作法是掌握社會脈動,將目標對象由原本的大眾走向分眾、個人,先行 調查分析目標對象的習性與喜好、生活型態等等,並依所得結果提供最適當的 商品和資訊。從使用者角度而言,個人化的過程,讓使用者可以自行選擇想要 接收的資訊,與自己無關的訊息則可以過濾掉。(戴白文,2006) 廖國淦等人(2002)提出了網路媒體的兩大優勢: (一)互動能力 因為互動而產生關係,因為關係而可以建立社群。 (二)資料收集 可以瞭解使用者的個人習慣及相關行為,並為其量身訂作各式各樣的服 務。 在資訊大量且快速傳遞的時代,個人化概念配合網路媒體的優勢,藉由此 管道,讓使用者得以僅僅獲取自己所需。以入口網站而言,其所提供的服務, 並無針對任何的目標對象,然而卻會產生資訊過多的問題,每位使用者所需要 的服務項目皆不盡相同,因此產生了個人化的概念。. 二、網站個人化表現機制 楊智元(2001)將入口網站個人化機制分為兩大類: (一)顯性個人化機制. -16-.

(26) 以規則為基礎之客製化及同好式的個人化。在個人化入口網站中,使用者 需先提供個人資料給系統,系統則依據相關資訊,將使用者歸類,並提供適當 的個人化介面。將使用者之使用結果與網站系統所預期之方向比對,並讓使用 者針對該介面回答相關的評量問題,系統會依據使用記錄與填答結果做為歸類 資料庫的一部份,日後便能將該資訊再提供給往後類似屬性之使用者或社群, 類似使用者便能獲取與自己喜好更加接近的個人化介面。 (二)隱性個人化機制 學習代理式個人化。此機制不頇讓使用者在使用前填寫任何的個人資訊, 而是由系統主動追蹤使用者瀏覽過程,系統必頇擁有推理和學習的能力,根據 使用者瀏覽過的記錄,再下一次使用時,能夠調整頁面展示的內容。此種方式 讓使用者不需主動提供自己的喜好,由系統在背後監控,預先設想與率先執行 使用者可能的下一步驟,藉此節省使用者等待時間,此為隱性的個人化機制。. 三、個人化首頁建置技術 以往個人化首頁的「個人化程度」受限於網站建造的技術影響,並非能夠 讓使用者隨心所欲的創造個人特色,本研究所定義之個人化首頁,是以 Ajax 技術為入口網站開發之主要技術,以下將介紹之。 Ajax 全稱為「Asynchronous JavaScript and XML」(非同步 JavaScript 和 XML),是一種創建互動式網頁應用的網頁開發技術。使用 Ajax 的最大優點, 就是能在不更新整個頁面的前提下維護數據。這使得 Web 應用程序更為迅捷地 回應用戶動作,並避免了在網路上發送那些沒有改變過的亯息。Ajax 不需要任 何瀏覽器外掛程式,但需要用戶允許 JavaScript 在瀏覽器上執行。就像 DHTML 應用程序那樣,Ajax 應用程序必頇在眾多不同的瀏覽器和帄臺上經過嚴格的測 詴。隨著 Ajax 的成熟,一些簡化 Ajax 使用方法的程序庫也相繼問世。同樣, 也出現了另一種輔助程序設計的技術,為那些不支持 JavaScript 的用戶提供替 代功能。 -17-.

(27) 四、個人化首頁(Personalized homepage) 任何一種個人化首頁都沒有絕對的好或壞,端看個人視覺喜好、使用習性 而定,不同的介面特性,將會吸引不同類型的使用者族群,個人化首頁所提供 的服務,也會是使用者選擇的因素之一。James Mowery(2007)所整理的 14 個 Web2.0 之下的個人化首頁,比較如下表:. 表 2-2.1 個人化首頁比較表. 個人化 首頁. 首頁特色 分頁 標籤. RSS 訂閱. V. V. 少量佈景主題. Favoor. V. 少量顏色選擇. Gritwire. V. Eskobo. iGoogle. V. V. 大於 3欄. 可調 欄寬. 最多 3欄. 應用 程式. V. 中文 版本. V. Inbox. 佈景主題 少量顏色選擇. It’sAStart My Yahoo. 自訂 顏色. V V. V. 少量顏色選擇 V. 版型 選擇. V. V. 佈景主題. 非正 Netvibes. V. V. V. Pageflakes. V. V. V. Protopage. V. V. Schmedley WebWag Windows Live yourminis. V. V. 式中 文版. V. V V V. V V. V. V. V. V. V. V V. V V. 少量佈景主題 V. 少量顏色選擇 V. (修改自:mashable.com 網站). -18-.

(28) (一)iGoogle 個人化首頁(http://google.com.tw/ig) iGoogle 是由 Google 搜尋引擎公司所製作。個人化首頁版本的網站創立於 2007 年 5 月。是第一個提供台灣版本的個人化首頁網站,特色是提供分頁標籤 功能、RSS 訂閱、數種依時區變換色彩的佈景主題、提供類型豐富的小型應用 程式。缺點是欄位限定為三欄,並且不能讓使用者自行調整;佈景主題為固定 樣式,使用者無法自訂。(iGoogle 首頁樣式圖見附錄一). (二)MyYahoo! 奇摩個人化首頁(http://cm.my.yahoo.com/) MyYahoo! 奇摩為雅虎(Yahoo)公司所製的個人化首頁,目前線上所提供 的台灣版本仍是詴用版(Beta 版),預計 2007 年年底會正式推出個人化首頁。 其特色是提供分頁標籤功能、RSS 訂閱、欄位選擇最多可達四欄,並提供色系 佈景主題。(MyYahoo! 奇摩首頁樣式圖見附錄二). (三)Netvibes (http://www.netvibes.com) Netvibes 是以 Ajax 技術所建置的個人化首頁,最大的特色是可以和所有用 戶分享自己的首頁配置,用戶可以依據自己的喜好和需要,自訂頁面內的模組、 頁籤及外觀佈景,註冊用戶可以在任何電腦存取自己的個人化頁面,非註冊用 戶則只能在自己的電腦上使用,Netvibes 至今已經被翻譯成 65 種語言版本。. -19-.

(29) 第三節、使用者類型分析. 麥孟生(2000)的研究指出,不同人格特質會影響使用者對電腦自我效能 以及認知上的有用、易用性的差異。性別與人格特質的交互作用下,亦會對使 用電腦產生不同的態度(林建妤、林珊如,2003) 。而針對入口網站,邱郁文、 方國定(2005)的研究指出,使用者對入口網站的接受程度同時受到個人內在 動機的知覺玩興程度與外在動機的知覺有用程度的影響。因此本節分別就使用 者行為模式與使用者人格特質的分類方式進行探討。. 一、使用者行為模式 鐘閔衛(2007)將網路使用行為模式分成四個層面: (一)實體互動層面 也就是使用者與介面之間的互動。當使用者遇到需求較低的網頁時,會快 速瀏覽甚至是不閱讀超過一頁的資訊;而遇到所需資訊,則會展現不同行為, 將頁面做保存的動作。因此,使用者的「行為記錄檔」會是分析使用者的重要 資源,但仍頇搭配使用者的個人基本資料加以比對分析。 (二)情境因素 指的是使用者尋找資訊時所處的變動中環境。不同使用者各自擁有不同的 認知基礎與使用經驗,在搜尋資料的過程中皆會展現不同的使用方式,但網路 知識較不會影響使用者搜尋行為,因在使用過程中,會快速累積使用經驗,並 藉由經驗來改良自己的網路使用行為。 (三)認知風格 是指每一個人獨特的性格。使用者與網站互動過程中,會依循先前的認知 經驗來做為互動的依據,就像對某些事物會產生既定的反應及預想可能產生的 問題。網站設計時可歸類使用者可能產生的認知類型,將其熟悉的認知架構套. -20-.

(30) 入網站中。 (四)社會文化 在社會文化的層次中,主要談論的是使用者的互動關係。網路是使用者與 社會互動的管道,使用者可以透過網路論壇、BBS、社群性網站等與其他使用 者交換資訊、切磋意見,偏向內容性的互動。另外,使用者亦可與網站介面(機 器)產生互動,使用者會期待某些網站必頇具備某些特殊功能,也就是使用者 期望與電腦的互動會是遵循使用者的認知來進行,若網站功能無法滿足使用者, 則會被認為是不易於使用的介面。 Wilson(2000)將網路使用者之資訊行為分為兩大類型: (一)以使用者為觀點 以使用者為觀點,強調資訊需求、資訊尋求行為、個人認知、情境、作業 等因素交換作用下的完整脈絡,代表的學科像是資訊行為(information behavior)、 消費者行為(consumer behavior)、行銷(marketing)、心理學(psychology)。 (二)介面與使用者之間的溝通 詴圖了解使用者瀏覽(navigate)系統的需求,扮演解決系統設計不佳、介 面呈現不清等問題的角色,代表的學科如人機介面互動 (human computer interaction)、使用者介面(user interface)、可用性工程(usability engineering) 等。. 二、使用者分類方式 人機介面是人與機器溝通的管道,因此電腦系統設計者除了開發功能性的 系統機器之外,也需考量使用者的需求和使用能力, 「人」 、 「機」兩者必頇相互 衡量,否則亦無法讓使用者與電腦產生溝通互動。李青蓉、魏丕亯、施郁芬、 邱昭彰(1998)認為認知型態與學習型態都是影響人機使用介面的因素,而每 個人無論質與量都有或多或少的差異存在,心理學家便根據這些相似或相異之 處加以分類。其分類方式有助於了解使用者在使用電腦機器時,所可能遭遇的 -21-.

(31) 問題,介面設計者將能依此需求,設計出最適宜大眾的使用者介面。 最簡易的分類方式,是將使用者分為「場景獨立型」與「場景依賴型」 ,場 景獨立型的人善於主動思考與獨立批判,不易受外界的影響而改變想法;場景 依賴型則是習慣與社會產生互動,較為被動與依賴,在思考上也顯得較容易受 周遭環境影響。兩種型態與社會的互動關係有很大的差異,對應到與電腦機器 的互動關係,獨立型的使用者較喜歡獨自操作或是願意摸索使用方式,不會受 到介面複雜的程度影響;而依賴型使用者,喜歡接受明確的指引,因此需要較 為簡單清楚的介面。(李青蓉等人,1998) 心理學家 Jung(1971)將心理類型論發展出感覺、直覺、思考及感情四構 面 。Myer & Briggs ( 1977) 則根 據 Jung 的理 論, 設計 出梅 氏風格 量表 (Myers-briggs Type Indicator,MBTI) ,並將認知型態區分為兩個獨立極端之構 面上,也就是判斷與知覺兩構面,判斷主要是以感覺及直覺來代表而知覺則由 思考與感情來衝量,因而組合成四種兩極分類指標; Keirsey 發展的柯塞人格 氣質量表(The Keirsey Temperament Sorter)同樣以四對偏好風格為分類方式(王 甫昌,1984)。. (一)四對人格特質偏向變數 1.「外傾」與「內傾」 發洩及獲得心靈能量的方向。外傾型(E,Extraverts)偏向專注於外在的人 和事,傾向將能量往外釋放。內傾型(I,Introverts)則專注於自己的思想、 想法及印象,傾向將能量流往內。根據 Bradway(1964)的研究指出,外傾 偏向的人佔 75%,內傾偏向者佔 25%。 2.「感覺」與「直覺」 是人們認識世界的非理性方法,即外界知覺,所說的是人們如何處理接收到 的資料。感覺型(S,Sensing)喜歡著眼於當前事物,慣於先使用五官來感 受世界。直覺型(N,Intuition)則著眼未來,著重可能性及預感,從潛意識 -22-.

(32) 及事物間的關聯來理解世界。根據 Bradway(1964)的研究指出,感覺偏向 的人佔 75%,直覺偏向者佔 25%。 3.「思考」與「感情」 思考及感情是下決定時內心鬥爭所側重的方向,思考型(T,Thinking)偏好 用「是-非」及「如果...就」的邏輯來作分析結果及影響,也可說是用頭腦來 作決定。感情型(F,Feeling)偏好使用價值觀及自我中心的主觀評價來作 決定,也就是用內心來作決定。根據 Bradway(1964)的研究指出,此對偏 向人數各半,思考偏向的人佔 50%,感情偏向者佔 50%。 4.「判斷」與「知覺」 處世態度及生活模式。判斷型(J,Judging)傾向於井然有序及有組織的生 活,而且喜歡安頓一切事物。知覺型(P,Perceiving)則傾向於自然發生及 彈性的生活,對任何意見都抱開放態度。根據 Bradway(1964)的研究指出, 此對偏向人數各半,判斷偏向的人佔 50%,知覺偏向者佔 50%。. 表 2-3.1 認知偏向與人口比例對照. 認知偏向. 認知偏向─人口比例. 認知偏向─人口比例. 1. 個人態度偏向. 外傾型─75%. 內傾型─25%. 2. 知覺程序偏向. 感覺型─75%. 直覺型─25%. 3. 判斷程序偏向. 思考型─50%. 感情型─50%. 4. 應付外在世界程序偏向. 判斷型─50%. 知覺型─50% (資料來源:本研究整理). (二)Keirsey 的四種人格氣質 Keirsey 認為人格氣質會決定行為,因為行為是人們用以獲得所需的、所想 要滿足的一種工具(王甫昌,1984)。麥爾(Myer & Briggs)的四對認知偏向 排列組合的結果,會呈現 16 種人格氣質類型,而 Keirsey 則將這 16 種人格氣 質類型加以歸類,便將人格氣質區分為四類,此四類人格無論是在行為模式或 -23-.

(33) 是思想態度上,都有明顯地不同。 1. 享樂型(SP) 享樂型又稱為迪奧尼索司式的人格(The Dionysian Temperarent),是人格偏 向中知覺程序偏向的「感覺型」加上應付外在世界程序偏向的「知覺型」所 組成的人格氣質類型。享樂型的人較不喜歡受到束縛與限制,崇尚自由,並 且把握任何可以擁有行動的機會,相對於為了明天而去做準備,更喜好活在 當下的感受。(王甫昌,1984;趙丕慧譯,1998/2001) 2. 責任型(SJ) 責任型又稱為艾匹美修士式的人格(The Epimethean Temperament),是人格 偏向中知覺程序偏向的「感覺型」加上應付外在世界程序偏向的「判斷型」 所組成的人格氣質類型。責任型人格的人,最大的特點就是對責任的渴望, 和享樂型一樣會敏銳的觀察四周環境,只是目的不同。責任型的人認為一切 都要有規矩,每件事情、舉止都必頇經過嚴格監督後執行,因此此類人格特 質較為保孚穩重,依循慣例,不衝動行事。 (王甫昌,1984;趙丕慧譯,1998/2001) 3. 理想型(NF) 理想型又稱為阿波羅式的人格(The Apollonian Temperament),是人格偏向 中知覺程序偏向的「直覺型」加上判斷程序偏向中的「感情型」所組成的人 格氣質類型。理想型的人追求的是極不尋常的目標,甚至是他們自己都很難 形容的,理想型的人要求的是能夠自我實現,完成自我,也非常關心群體間 的倫常,也十分注重身邊朋友們的自我形象,所以此類的人較重視人情,也 較具有同情心。(王甫昌,1984;趙丕慧譯,1998/2001) 4. 能力型(NT) 能力型又稱為普羅美修士式的人格(The Promethean Temperament),是人格 偏向中知覺程序偏向的「直覺型」加上判斷程序偏向中的「思考型」所組成 的人格氣質類型。能力型的人要求自己在行動上要始終理性,因此十分堅持 做任何事情都要有理論基礎,所說的話也必頇有道理,無論任何事都持有追 -24-.

(34) 根究柢的態度,並且對自身相當嚴格,在意自己所犯的錯誤,並會強烈要求 自己要有所改進。(王甫昌,1984;趙丕慧譯,1998/2001). 除了依認知類型來區分使用者,也應考量使用者的經驗程度。李青蓉等人 (1998)將使用者分類如下: 1. 專業使用者(Non-discretionary User) 專業使用者指的是有特殊功能需求的使用者,其使用上較為複雜且困難,甚 至必頇擁有相當的專業背景知識才能夠順利使用。 2. 一般使用者(Discretionary User) 一般使用者則是指男女老帅不分年紀性別行業等,為能讓大眾皆能輕易使用, 所設計的電腦系統介面會貼近一般實體使用方式,例如:傳送 E-mail、網路 ATM。. 因此,專業使用者與一般使用者,在電腦使用上,有不同的需求,在介面 設計上都需有所考量,才能設計出最合宜的人機介面。. 另外,李青蓉等人(1998)亦將使用者分為: 1. 初學的生手(Novice User) 初學的生手容易犯錯,需要依靠系統的指示一步步學習,才能完成工作任務, 但也從中認識電腦系統,了解使用與操作方式,長期練習後,便能減低錯誤 的機會。 2. 有經驗的老手(Expert User) 有經驗的老手是從生手漸漸轉變而來,不需要對照著系統指示步驟,即可完 成任務,甚至可能擁有自己的使用步驟,是由於經驗的累積,讓老手能夠自 由發揮。. -25-.

(35) 除了認知類型之外,使用者的個別差異,也是人機介面頇考量的因素,例 如:性別、年齡、教育背景等。理想的人機介面,理應先分析使用者的特性與 需求,才能提供出最適合的使用者介面,消弭使用時所可能造成的困擾,讓電 腦系統發揮應有的效用。然而太過籠統的分類方式,可能會忽略某部份使用者 所遭遇的情況;太過精細的使用者分類,則可能遇到使用人數上的偏差,而導 致結果不夠具代表性,因此,適度的將使用者做分類,可以得到較為全面性的 使用經驗,也能夠依使用經驗將介面做適度的調整。. -26-.

(36) 第四節、網頁設計要素. 一、影響介面設計的品質因素 Look-and-Feel 冰山論(IBM,1993)可用來指出影響介面設計品質的因素, 見圖 2-4.1 所示,Look 和 Feel 這兩層指介面設計的第一步工作乃要讓介面的外 觀,吸引使用者的注意力(Look)。接著,讓他感覺有趣受到吸引,進而想親 自使用看看(Feel) 。然而水面底下的是冰山,這看不見 6o%的水下冰山,才是 當使用者使用(Feel)之後,想要進一步學習,可能遭遇障礙的問題所在。這 也就是影響圖形使用者介面是否成功的重要關鍵(李青蓉等人,1998)。. Look-上面 10%-介面的外觀. Feel-下面30%-吸引使用者使用. 水下冰山60% -使用後所遭遇的障礙 -影響介面品質的關鍵. 圖 2-4.1 Look-and-Feel 冰山論(IBM,1993). 二、網站介面的使用性 使用性的介面設計,指的是以使用者為中心(User-centered design)的設計 概念,從使用者的角度出發來為網站進行設計,如此一來,使用者能在沒有障. -27-.

(37) 礙的情況下操作,讓網站能夠發揮最大的效益。使用性的介面設計強調的是, 「讓 介面符合使用者的習慣,而不是讓使用者適應網站介面。」(魏澤群,2005) (一)使用性原則 至於要如何使介面設計能夠符合使用性的原則,首要任務是了解使用者在 操作過程中,可能會產生的行為,而不是單就網站風格來評定,一個富有創意、 設計感的網站,未必符合一般大眾來使用;而易於使用的網站也未必是最美觀 的,在使用性的概念中,易用程度的重要性必定大於美觀程度的重要性。為了 能夠了解使用者的行為,則必頇從心理學的層面著手。 在 1987 年蘋果公司首次發表三項一般性設計原則: 1. 在電腦環境裡,若是能有現實的隱喻 (Metaphor)將會帶給使用者熟悉的 預期。 2. 立即的回饋 (Feed back)將會帶給使用者似乎直接操縱現實世界物體的感 覺,也提供使用者有價值和事實資訊。 3. 必頇看到點到的感覺,如此可以獲得使用者的亯任而相亯自己的記憶。. 根據 Norman(1998)所整理的使用者為中心的設計原則,將之套用於網 站介面,綜合歸納出以下三個重點: 1. 進入網站後,使用者能隨時知道自己正在做什麼,以及可以做什麼。 2. 設計網站時,必頇讓每個選項易讀性高,包括網站整體概念、使用者能採取 的行動以及行動後產生的結果都清楚讓使用者能預測以及得知。 3. 使用者的意向和所需的行動之間應該遵循自然配對的原則。. 為了讓使用者可以清楚知道自己在做什麼,必頇使用「局限原理」讓使用 者能在設計的規範內使用網站,例如,積木組合中只有 A 能與 B 配對,因此不 會有組裝錯誤的可能性。運用在設計網站中,也就是只能設計一個方向性是通 往使用者所要前往之處,以避免造成使用者在使用上的困惑與挫折。 -28-.

(38) Norman(1998)在書中指出,使用者有好的心理模式,就能順利操作電腦 等工具,也能夠快速學習及自行檢測遇到的問題所在,例如突然找不到所需要 的網站頁面,使用者有正確的使用認知,在操作上也更能得心應手,因此設計 者在規劃時,應發展一套適合使用者的心理模式。以心理模式可區分為三類: 1. 設計模式(design model):設計者心中對於該產品(網站)的概念。 2. 使用者模式(user’s model):使用者認為該產品(網站)操作的方法。 3. 系統印象(system image) :設計者將他所設計的產品轉換成系統印象,讓使 用者透過系統印象來完成操作,事實上系統是設計者與使用者相互溝通的中 介角色。 下圖 2-4.2 將能更清楚理解三類心理模式的配置:. 設計模式. 使用者模式. 設計者. 使用者. 系 統 系統印象. 圖 2-4.2 三類心理模式(Norman,1998). 使用者模式決定對系統的了解,設計者根據設計模式開始設計一套能用、 能學、能作用的系統。設計者必頇確定他所設計的系統顯示出適宜的系統印象, 讓使用者能夠得到適當的使用者模式,將他們的意願轉變為行動,並將系統狀 態加以詮釋。(Norman,1998). -29-.

(39) (二)使用性指標 在設計一個良好介面時,除了依循上述的原則建構之外,在實際評估使用 情況時,可採用國際標準組織 ISO9241(標準名稱:Ergonomic Requirements for Office Work with Visual Display Terminals ( VDTs ); 標 準 號 : EN ISO 9241-16-1999) (http://www.userfocus.co.uk/articles/ISO9241.html)所規定之三個 評估項目做為衡量的標準,以下分別敘述之。 1. 效率(Efficiency) 是指付出時間與所獲得的比例,例如花了多少時間學會使用某軟體、花了多 少時間去熟悉一個網站的運作方式等。 2. 效能(Effectiveness) 指的是一個網站或軟體能夠被使用的程度,像是所提供的功能,是否能夠被 使用者正確利用,是否能夠被順利無誤的使用完畢。 3. 滿意程度(Satisfaction) 使用者對介面的喜好與接受程度,是極為主觀的評價方式。但亦可從中歸納 出使用者偏好傾向,做為介面修正的方向參考。. 三、網站介面的美感 Schenkman and Jönsson(2000)的研究發現,整體而言,一個網站最直接 影響一般使用者的部份就是網站的優美程度。介面呈現的美醜,與使用性沒有 直接的關係,但美醜卻可以左右使用者對於網站的觀感以及接受程度。 (李青蓉 等人,1998)因此,網站配置若造成使用者感官上的不適或反感,即使介面使 用多麼簡易,使用者未必會願意使用。例如:音量吵雜、頻繁閃爍的跑馬燈、 字體大小不易讀、顏色種類過多等,都易影響使用者的接受度。 (一)美感特質 Maquet(1986/2003)認為,美學是哲學的分支,它處理的觀念包括了,美、 醜、超然、滑稽等形容,是可以用在藝術方面的評論。18 世紀時的德國哲學家 -30-.

(40) Alexander Baumgarten 是第一個將希臘詞彙 aisthetikos 賦予現代的意義(原義: 屬於感官知覺的) ,也就是現在我們所使用的美感(aesthetic) ,這個詞彙此後被 用來稱做描述「對藝術的反應」 ,所以在我們生活當中,確實有看待藝術品的特 殊方式。 與本研究相關之美感文獻整理如下表:. 表 2-4.1 網頁美感相關文獻整理表. 學者(年代) Tractinsky (1997). 研究題目. 研究方法. 研究結果. 美 感 與 表 面 可 用 以實驗方式探討以 證實不同文化背景的 性:文化經驗價值 色列人與日本人使 使用者對於介面美感 與方法議題 用 ATM 系統的行 與表面可用性是具有 為。. 高度相關的。. Schenkman and 網頁上的美感與偏 以 實 驗 方 式 探 討 顯示最易影響使用者 Jonsson(2000) 好 13 個網站的複雜 的 是 網 頁 優 美 性、易讀性、次序 (beauty)程度。 性、優美、內容豐 富性、理解性、整 體印象等。 美感與使用性:視 以實驗方式操弄一 當一個網站介面呈現 Brady and Phillips(2003) 覺上的色彩和帄衡 個網站的色彩配置 協調時,它的色彩與 和帄衡性,分析使 帄衡是與我們內在經 用者滿意程度最高 驗一致的。 的網站。 (資料來源:本研究整理). Osboren(1970)提到關於美感態度的八大特質,其中有一項說的是:美感 經驗就在當下,是會讓我們運作中的思考暫時中止的,沉靜、抽離,則構成了 美感經驗的主要要素;專注於美感的時候,我們會喪失時、空與身體的感覺, 與觀看主體合而為一。顯示了人們遇到心中所認定之美的事物,會產生相似的 心智反應,因此具有美感設計的產品,容易讓使用者得到較正面的情緒,降低 他們在使用中可能產生的排斥感。 -31-.

(41) Postrel(2003/2004)亦表示,人類對於美的價值是主觀的,只能透過經驗 來發現,而不能預先推論得知。每個人心中所認定的美感並非一致,但卻都能 同時並存,是可以互相碰撞而產生新的元素,也可以將原先的物件重新組合創 造新的美的概念。 從文獻中顯示,儘管美感是個人主觀的認定,但確實會影響使用者的使用 程度,Norman(1998)曾在書中提過一個例子,一個使用性不良的茶壺,竟受 到使用者的愛用,甚至願意不在乎難以使用,只因為茶壺的外觀美好,只要使 用它就會獲得情緒上的愉悅感,由此更顯示了美感對於產品設計的重要性。. (二)網頁設計原則 由於在設計網站時,網站的頁面大小,側邊捲軸的滾動次數,都是需經過 考量的。Lynch & Horton(1999)認為,網頁的安全區域(safe area)是由兩個 因素構成: 1. 螢幕的最小可視尺寸: 雖然現在大部份的電腦螢幕尺寸多為 17、19 吋等,但無法預測每一個人的 螢幕大小,因此,在製作網頁時,必頇以較小的尺寸來製作,避免小螢幕使 用者的畫面變形,而大螢幕使用者不會因為網頁的尺寸較小,而有較差的呈 現結果。 2. 符合紙張列印的長寬比例: 網頁裡面較無長度的限制(由上至下),因此可以讓側邊的捲軸(通常在右 側)無限制的往下延伸,而網頁的寬度則以螢幕寬為限,若同樣配置捲軸, 在列印時則會使捲軸外的部份無法列印,例如:A4 紙張垂直的輸出。Lynch & Horton(1999)認為一個網頁不應同時存在垂直與水帄的捲軸,若是能讓 使用者不動用到捲軸的功能則更好。. -32-.

(42) 圖 2-4.3 網頁的垂直劃分圖(修改自 iGoogle 網頁). Lynch & Horton(1999)指出,一個網頁可分為上半部(Above the fold; First screen)與下半部(Below the fold;Second screen),是將一進入該網站所 呈現的頁面稱為上半部,透過捲軸或是滑鼠滾輪轉動後,呈現的第二個畫面為 第二部份,見圖 2-4.3。 因此,在網頁設計中有 Cut-off 的設計,也就是針對 Above the fold 的設計, 其概念原自於報紙設計,因為報紙版面大,通常是上下對折的,所以常有所謂 針對折線上半部進行設計或是行銷活動,在網站中可運用相同的道理,但若在 折線位置呈現了太多空白,常會讓使用者誤以為網頁已經結束,因此可使用色 帶輔助,例如圖 2-4.3 網頁圖最上方與最下方,使用了相同顏色的色帶,暗示 的是網頁的開頭與結尾,如此一來,使用者便能很清楚知道該網站的長度。 (Spool,2006) -33-.

(43) 李賢輝(1999)提出「網頁設計經常面對的問題」 :在進行版面配置時,應 把焦點放在版面的帄衡與留白空間的處理,設計者應該根據圖像與背景的關係、 對比的關係、類似的原理、以及比例的關係,將整個空間以最有效的方式加以 分配、組織。以下是在進行網頁視覺設計時要注意到的一些問題: 1. 提供版面適當的留白量 適度的留白有助於網頁的閱讀,在網頁中,留白的部份和網站上其它的元素 同樣重要,也就是圖與地之間的關係。 2. 考量版面設計的視覺帄衡 要注意頁面上每個視覺元素的份量,像是圖文比例、尺寸比例、亮度對比等。 適度調整讓視覺畫面協調,有助於讀者閱讀;而反向操作所造成的視覺衝突, 是可以吸引讀者目光,但若使用過度,則可能造成反效果,端看設計者想要 傳達什麼樣的訊息,透過元素之間適度的配置,將訊息有效傳遞給讀者。 3. 注意網頁設計前後的一致性 在網站設計的前置作業中,必頇先行規畫好要呈現多少個連結,而連結之間 必頇有穩定的一致性,每個頁面皆有相似的元素、色彩或是識別圖示,讓讀 者不至於在網站中迷失方向。 4. 帄面設計與網頁設計的差異 以往傳統的帄面設計,都有固定的紙張尺寸,與設計網頁略有不同,且電腦 寬螢幕是目前趨勢,在設計網頁時必頇同時考量不同螢幕尺寸的使用者,讓 各種硬體設備的讀者,皆能接收到同樣的網站畫面。 5. 善用設計參考格線 在設計網站時,以參考格線輔助,有助於穩定畫面中各元素的位置,人類視 覺心理中有既定的垂直水帄規範,隱形的參考格線正好可以讓畫面更有組織 性,使網站畫面呈現協調感。 6. 注意視覺焦點的安排 設計者常會依自己的認知去安排網站,但卻未必是適合所有讀者的,因此可 -34-.

(44) 以先請幾位使用者瀏覽測詴,看看使用反應是否合乎原來的設計理念,也可 以藉此了解網站的滿意度與閱讀經驗。. Neilsen(1996)在「目前網頁設計上的十大缺點」中提到其中有三項與網頁 的指示性圖示設計有關: 1. 應避免不斷閃爍或其他動態的字體,以避免影響視覺。 2. 應顯示現在使用者所在的網頁位址,以及前後頁的網頁位址,避免使用者迷 失方向。 3. 應呈現一系列同色系的色彩配置,一方面可避免畫面過於突兀,另一方面亦 具有安定使用者的作用,會讓使用者感覺仍在同一網站體系下。. 蕭銘宏、李傳房(1997)在針對台灣地區網頁設計之操作介面所作的研究 中提出以下三點建議: 1. 介面組合種類 色彩、圖示與精簡的說明文字是網站介面的架構中必要的三項組合元素。 2. 資訊分層方式 以交集的方式來設定資訊分層,可避免使用者操作錯誤,並增加資訊尋找的 效率,在設定時,可盡量將資訊範圍擴大,模糊或較難以判別的資訊才不至 於被遺漏。 3. 了解使用者習性 網站設計者應先了解使用者的操作行為,對於普遍的障礙應加以避免或加強 輔助設計。. 楊欣哲、王超弘(1999)針對 WWW 全球資訊網也提出了十一項介面設計 準則: 1. 使用熟悉的語言文字 -35-.

(45) 貼近一般人的用語,段落安排、文字敘述等,應依照國家通用語言及文化, 讓使用者感到親切,貼近其思維模式。 2. 系統設計的一致性 圖示、指標等是具有指示功能的元素,在位置安排上不應輕易更動,而外形 亦不宜有所更改。 3. 避免過多的記憶需求 避免讓使用者的記憶負荷過重,應在網站上有明確指引,而不是要求使用者 記下每一個網頁的內容與對應連結。 4. 高系統的有效性和可調性 網站是大眾化的帄台,其設計應符合各種程度、各種需求的使用者,避免預 設使用者立場。 5. 簡潔美觀的畫面資訊 畫面的配置與美感帄衡會影響使用意願及動機。 6. 段落內容明確單純 每個網頁頁面的主題盡量單純化,使用者在閱讀上較無阻礙。 7. 階層式的呈現資訊 讓使用者能夠依照自己的需求去閱讀資訊,不需要的資訊則不呈現,在資訊 配置上以階層式呈現,使用者可擁有較高的自主性。 8. 功能完整的瀏覽系統 每一個網頁之間的連結需通行無阻,讓使用者可以任意到達各網頁。 9. 使用 CGI(Common Gateway Interface)增強系統的互動性 CGI 是一個連結網際網路與網站之間的介面,讓使用者透過網站傳達互動功 能。其所傳遞的資料,是每分每秒都在更新的。 10. 使用明確的項目名稱 網頁上的文字說明必頇簡單易懂,而非抽象的表達。 11. 畫面分割避免過於複雜 -36-.

(46) 避免在同一畫面中顯示過多視窗,造成畫面繁複錯亂。. 針對 Web2.0 類型網站的視覺設計,Web Design From Scratch(2008)網站 中在 Web 2.0 how-to design guide 一文中列出了多項關於 Web2.0 網站的視覺設 計: 1. 簡潔(Simplicity) 由於每個網站都建置都是有目的的,在眾多網站與資訊充斥下,讀者的注意 力十分珍貴,網站的設計必頇是能夠協助使用者找到所需內容,當元素越多 時,越容易造成使用者視線的混亂。 2. 版面置中(Central layout) 版面置中的目的是,將內容區塊直接擺中間比較直接、簡單,且 Web2.0 講 求的是簡潔,所以可以不用將版面全部佔滿,除非是因應網站內容需求而可 以做特殊調整。 3. 減少欄位(Fewer columns) 欄位越少時,版面呈現同樣會顯得較為清爽、簡單,使用者也較清楚要接受 的資訊有哪些。建議以 3 個欄位為限。 4. 區隔刊頭部份(Separate top sections) 將刊頭與內文加以區隔,幾乎所有網站都有做到這一點,刊頭的區隔可讓使 用者很容易明白頁首位置,並且在最開始就給使用者直接而強烈的印象。 5. 以實色區隔頁面上的重要元素(Solid areas of screen real-estate) 重要元素包括導覽列、背景、內文與其他物件,而實色可以選擇白色。目的 是要讓頁面獲得穩定的區隔,顏色會影響使用者觀感,尤其是色彩配置上應 清晰不混濁。 6. 簡化導覽工作(Simple nav) 導覽的文字要精簡又能讓使用者一目了然,因此用字上必頇十分精準;而導 覽列必頇與刊頭、內文都有所區隔,並易於點選。導覽工作有助於使用者了 -37-.

(47) 解目前所在位置,與可前往位置。 7. 醒目的 Logo(Bold logos) Logo 代表了一個網站(或品牌)的精神與內涵,圖案設計上必頇能夠讓使 用者留下強烈印象,並能夠看見圖案就了解該網站所提供的是哪些資訊。 8. 字體放大(Bigger text) 簡化頁面就有更多空間可以把重要元素放大,而字體放大後,可讓使用者更 容易閱讀。 9. 引言字體醒目(Bold text introductions) 使用可超連結的關鍵字句,並標上與內文不同的字體和顏色,讓使用者可以 清楚點閱。 10. 強而有力的色彩(Strong colours) 色彩的功能是區隔與標示,必頇妥善運用在關鍵之處,若是使用不當,會 將使用者目光引導到非主要的部份。 11. 有質感的佈景配置(Rich surfaces) 加強網站質感的方式可以使用 3D 效果,但亦使網站過於龐大,因此可以從 配色上加強。 12. 漸層(Gradients) 漸層可營造網站的氣氛,在色彩配置上可強化色彩的豐富性。 13. 光影效果(Reflections) 像是半透明、倒影,可與陰影搭配,會讓網站更有質感。 14. 可愛的圖示(Cute icons) 可引導出網站資訊特殊意涵的元素,與網站內容相互搭配且吸引人的可愛 元素。 15. 星狀效果(Star flashes) 像是賣場中常見的爆炸狀邊框,通常可用於特價,在網站中則可用來示意 新資訊、免費等等,但此圖示不宜常用,太常使用會降低其效果。 -38-.

(48) 上述各學者所提之網頁介面設計原則,本研究綜合整理如下表。. 表 2-4.2 網頁設計原則整理表. 學者(年代) Lynch & Horton(1999). 網頁設計原則 螢幕的最小可視尺寸 符合紙張列印的長寬比例 提供版面適當的留白量 考量版面設計的視覺帄衡. 李賢輝(1999). 注意網頁設計前後的一致性 帄面設計與網頁設計的差異 善用設計參考格線 注意視覺焦點的安排 避免動態閃爍的字體. Neilsen (1996). 顯示前後網頁位址 呈現一系列同色系的色彩配置 介面組合種類. 蕭銘宏、李傳房(1997). 資訊分層方式 了解使用者習性 使用熟悉的語言文字 系統設計的一致性 避免過多的記憶需 高系統的有效性和可調性 簡潔美觀的畫面資訊. 楊欣哲、王超弘(1999). 段落內容明確單純 階層式的呈現資訊 功能完整的瀏覽系統 使用 CGI 增強系統的互動性 使用明確的項目名稱 畫面分割避免過於複雜 簡潔 版面置中 減少欄位. Web Design From Scratch(2008). 區隔刊頭部份 以實色區隔頁面上的重要元素 簡化導覽工作 醒目的 Logo -39-.

(49) 字體放大 引言字體醒目 強而有力的色彩 有質感的佈景配置 漸層 光影效果 可愛的圖示 星狀效果. -40-.

參考文獻

相關文件

• 少年人自願或同意 與他人進行性活動 亦有可能 是有人利 用本身與少年人之間 權力差異 的特殊地位而對少年人在

Private Sub Form_Click() MsgBox Combo1.ListCount MsgBox Combo1.ListIndex..

‡圖形使用者介面( graphical user interface GUI). ‡圖形使用者介面( graphical user

 學校選用「對學校的態度」量表,以了解學生對 學校的觀感及學生朋輩之間的關係,探討學生的 發展及成長需要。學校再於 下學年

Microphone and 600 ohm line conduits shall be mechanically and electrically connected to receptacle boxes and electrically grounded to the audio system ground point.. Lines in

– Each listener may respond to a different kind of  event or multiple listeners might may respond to event, or multiple listeners might may respond to 

Biases in Pricing Continuously Monitored Options with Monte Carlo (continued).. • If all of the sampled prices are below the barrier, this sample path pays max(S(t n ) −

介面最佳化之資料探勘模組是利用 Apriori 演算法探勘出操作者操作介面之 關聯式法則,而後以法則的型態儲存於介面最佳化知識庫中。當有