顯示包含「網站設計」標籤的文章。顯示所有文章
顯示包含「網站設計」標籤的文章。顯示所有文章

星期五, 5月 10, 2013

在語言形塑文化之下的網站(Websites with Culture and Language Issue)

Sweet Heart
「語言>文化>網站。」其實一句話說完了我的概念,但我想還是解釋一下好了。

嚴格來說,其實是語言形塑出我們的文化。語言是人類發出來的聲音,這些聲音的初始來源可能是樹,可能是流水,可能是海浪,可能是犬吠,各地區的人類獨自發展出特定的聲音,指稱特定的物件。《語言與人生》(Language in Thought and Action by S. I. Hayakawa(早川), 鄧海珠譯)裡是這樣說的:
語言可以用來說明語言,這是人類的聲音系統與動物的叫喊最基本的不同之處。 
除了發展語言,人類還學習到如何在泥版、木塊或石塊、動物皮、及紙上留下比較永久的符號和圖畫來代表語言。這些符號可以幫觔他們達到無論在時間和空方面,聲音都無法達到的範圍。p.15 
是的,接著人類有了符號,記錄了文字。這些符號並非憑空而來,「家」是屋簷底下的豬,「塵」是鹿群奔馳之後的飛揚灰土,印歐語系的符號原先也是從象形文字轉變而來,是原先人類生活當中所看見的景相,是習以為常卻又必需指稱與記錄的生活景觀。這些生活景觀因各自的生活環境不同,所以借用了不同種的符號。而人類藉由這樣特定的聲音與符號,各自發展成了文化。

星期二, 3月 19, 2013

3/16 認真讀書日(Back to Study)

non-alcoholic
non-alcoholic by Fleedom
回淡大圖書館讀書。一共是六本書,是在我離開學校之後出的新書,大部分是在瀏覽,吸收新的觀念或者是新的作法。其中有一本書讓我非常滿意,借了回家讀讀。以下依閱讀順序:

星期二, 1月 17, 2012

我看紐約時報線上版

=New York Times=
The New York Times Company - Quality News, Information and Entertainment
The New York Times - Breaking News, World News and Multimedia
以「內容生產者」自居,出版有質感、「事實」、「即時」的新聞及多媒體內容。

==關於紐約時報的書==

==NYT網站版面設計及互動==

星期二, 7月 14, 2009

《平面設計:視覺比看看》(Graphic design:visual comparisons)的排版及書籍設計

這篇好書摘錄主要是為了回應我之前一篇文章〈為何我討厭《情感設計》〉,這本書的編輯及用心是值得參考及借鏡的:《平面設計:視覺比看看》

題材的取捨與中文版的特殊性
全球中文版除了將原書的文字與圖像完整重現,同時也增加了10頁的全新材料。針對這點,我們也與原作者之一Bob討論許久,他的原意是以刪除部分內容以容納中文翻譯與其他附加資料。然而我們認為這樣與本想要完整保存原有文獻、製作一本「完全復刻」出版物的構想有所衝突;同時,身為設計師,或許我們該在意的是圖像是否修整完美、文字與版面是否整飭到位,但我們更相信一本關於設計的書不應該只去完成美感層面的要求,更重要的是對內容的注視與辨明。因此,我們對華文讀者可能感到陌生或不易了解的的設計案例加上註釋,同時也增加8頁與作者之一Bob Gill的訪談,問題內容涵蓋F/F/G工作室的工作型態、六○年代設計景況與設計教學等不同面向。我們相信這是對待這樣一本重視思考與過程的書適切的做法,也讓在今天決定重製一本四十多年前的出版品的這個計畫更有意義。

書中的中文譯註以解釋原文為原則,並加上我對該件設計作品相關資料的蒐集。儘可能避免「基本資料」或「設計師小檔案」此類的書寫,因為在網際網路如此發達且各種出版品如此容易取得的今天,讀者可以透過搜尋引擎輕鬆獲得某位設計師或設計作品的資訊,實不須再浪費印刷成本及人力物力來承載此類資訊。另外,也避免使用「經典」、「大師」、「名作」等辭來神格化或權威化特定人物或作品,畢竟我們都知道對從不落款的設計師而言,設計作品才是真實與永恒,而不是名氣與頭術。在人名與公司的翻譯上,本書採取保留原英文名的方式,不希望出「英硬翻中」的紊亂譯名問題,如此也方便讀者經由原文去尋求知識。此外,相關網站與網址資訊也刻意在本書中被省略。以上種種限制與規避,是希望這些堅持可以讓本書成為一把往設計世界的鑰匙,而不是一本即溶速食的圖文書,讀者可根據書中的設計作品延伸探索,對來自不同國家的設計師或團體作更縱深的認識。正如同本書中心德目之一所示:設計師除了在意視覺,更該在意解決問題的思考與溝通內容的整理,我相信唯有設計師能不只執著於美好惡的判斷,並能夠跳脫純粹視覺層面的觀點,進而對內容有生產與掌握能力,這個行業才不會流於美工與裝飾,設計師也才能擁有自己的地位。

書籍設計(資訊設計)
另外在書籍設計上,我們亦做了特別的考量,或許最終結果與大多數的中文版物略有不同,故在此說明。首先,書的尺寸、頁面落版與邊界(margin)設定完全依照原書。或許在華文設計常規裡,寬大的邊界是「舒服」且看來「專業」的,然而除了忠於原書,我們認為窄邊界(tight margin)也有其功能與美感上的意義:窄邊界設定可以容物更多的文字,而達到經濟與高效率的印刷成本與時程;同時在美感層面,窄邊界除了可以帶來視覺張力(tension),同時也延伸了內容中五字/圖像方塊的久限,隱喻著其企圖超越實體書冊邊界的意欲。

在字體設定上,英文部份整體使用書版權頁所標示的11/13 pt(11級字大小與13級字行距)Garamond字體,中文部份則使用具有飾線(serif)、字體曲線與轉折風格相似於Garamond的明體。中文字級大小(8.75級)略小於英文,以求得兩種文字在視覺上質量的近似。在及面安排上,長篇文字(訪談與譯序頁面)採用原書前言相同之兩欄式及版面;而譯註與及權頁則使用credits頁面的四攔式安排。

另外,值得述的是本書使中文走文方式:我們選擇這種「靠左對濟,並保文字右側參差不齊(flush left, ragged right)」的設定,而非一般中文常見的「左右齊行(justified)」。原因首先是想避免左右強制齊行,會造成英文字、羅馬數字與標點符號的字母距(letter spacing)與字距(word spacing)過寬,不易閱讀的問題;其次,雖然理論上中文字體是所謂的「等寬字體」(monospace typeface),也就是每個字的寬度都是相同的,理應完美的適用於左右齊行的走文方式。但我們也可以發現,幾乎所有的中文文章裡,或夕或少都天雜著英文與羅馬數字,除非使用特定的英文等寬字,英文字母與羅馬數字是非等寬的,此變因已破壞了中文字的等寬系統;加上中文筆畫簡繁不同、全形標點符號在文字方塊裡的位置差異等因素影響,在現實視覺上,中文字(特別在長篇文字的情況)不是等寬的,左右強制齊行的走文方式也就造成了許多字距的拉扯,並且會有影響閱讀流暢度的空間產生。因此,我們認為西方字體學裡根據視覺(optical)原則去微調文字的觀念的"On Typography"一文中,確認並使用的左右不齊行之走文方式(同時也成為瑞士國際風格的中心德目之一),對中文也有應用價值。所以,在本書的走文設定上,我們對空格過大的全形標點或筆畫少的中文字,以kerning去做字距調整,並對長篇文字以ragging方法針對文意作斷行。

以上種種考量與實驗,除了在閱讀功能上我們認為的確較目前常見的中文排有所提升,另外也是對Alan Fletcher與Colin Forbes兩位師承瑞士字體學派的作者的致敬。更重要的是,我們希望設計除了達到功能的完備與美感的提升,同時也可以宣告設計師不該「畫地自限於特定的視覺風格、字體、顏色,或既有的視覺品味」,也必須有著「探險的精神,不害怕嘗試錯誤。」

負責原書封面設計的Bob堅持在本書重新付梓的此時,對新版封面做出以下修正:在產本已充滿視覺趣且隱義無限的一對眼睛上加上瞳孔,他的理由是這樣才「像」真的眼睛。兩顆瞳孔是他親自畫上去並數位化的,讀者仍可在封面內頁裡看到原始的封面。除了尊重原作者意見之外,他替全球中文版「點睛」的儀式,其實也是深具意義。

我想以上這些原則也適用在網路平台的介面設計上。


其他關於排版的文章。

星期六, 4月 25, 2009

互動的三種層次與設計

雖然我討厭《情感設計》的中文版,但唐納.諾曼(Donald A. Norman)先生的對設計的觀點及sense我依然覺得很夠份量,討論地相當完整,底下一段是他在討論互動的三層次:

情感中不同層次起衝突在設計中是很常見的:真實的產品會有一連串的衝突。人會在多種層次上詮釋同一個經驗,而該經驗對某個層次產生了吸引力,卻不一定會在另一個層次上有吸引力。一個成功的設計必須在各個層次上都很出色。例如:儘管邏輯上驚嚇顧是件壞事是遊樂園中有很多遊客就是為了去體驗那些設計來驚嚇顧客的遊樂設施(註:原譯纜車,我在猜原文應該是rides)和鬼屋。(更深一層的思考可以參考楊照的文章:〈故事體驗比重力加速度更刺激〉,可以順便看看到yahoo blog設計很爛的網址)

星期一, 2月 02, 2009

《設計心理學》(The psychology of everyday things)目錄及節錄

設計心理學─以使用者為中心的日常生活用品設計原理
《設計心理學》 from 博客來
一月時拜讀了Donald A. Norman所著的《設計心理學》(The psychology of everyday things,卓耀宗譯),以前都不知道這本書有中譯本。知道的機緣有點奇妙,那天泡完溫泉去北投圖書館隨手一抽居然讓我發現了《設計&日常生活》,這本晚期一點的著本,有了這個大發現,趕緊連上圖書館目錄查詢,找到現在已經絕版的《設計心理學》。這是本結構完整、內容實用又兼具學術理論的著作,讀完後對於規畫資訊系統時又多了一份想像。以下是書的目錄:
第一章 設計不良的日常用品
你需要擁有工程學位才能解決這個問題
日常生活的一些挫折
日常用品心理學
 日常用品的預設用途
 兩萬件日常用品
 概念模式
易理解性和易用性的設計原則
 提供一個好的概念模式
 易視性
 配對的原理
 回饋原則的原理
可憐的設計者
技術進步的矛盾

第二章日常運作的心理學
錯誤地歸罪自己
日常生活中的一些錯誤觀念
錯怪了原因
人的想法和解釋的本質
採取行動的七個階段
執行和評鑑之間的鴻溝
用來幫助設計的七階段

第三章 腦中和外界的知識
不精確的知識能用來得到精確的動作,是基於下面四個理由:
 訊息存在於外界
 高度精確並不需要
 外界存在著自然的局限
 外界存在著文化的局限
來自不精確知識的精確行為
記憶是存於腦中的知識
 記憶的困擾
 記憶的結構
 有關係事物的記憶
 經過詮釋的記憶
記憶也是存於外界的知識
 備忘
 自然配對
外界知識與腦中知識之間的優劣比較

第四章 知道要做什麼
日常局限的分類
 物理的局美
 意義的局限
 文化的局限
 邏輯的局限
把預設用途和局限應用到日常用品
 門的問題
 開關的問題
易視性和回饋
 把看不到的改成容易看到
 好的顯示是成功之本
 應用聲音代替易視性

第五章 人必犯錯
失誤
 擷取性的失誤
 記述性的失誤
 環境刺激產生的失誤
 聯想的失誤
 忘了動作目的的失誤
 功用的失誤
 失誤的覺察
 失誤的研究給設計的教訓
錯誤
工作事項的組織
意識和潛意識的行為
 不以為然的錯誤
 社會壓力和錯誤
 防患失誤的設計
 如格處理失誤
 強迫性機能
設計哲學

第六章 設計所面臨的挑戰
設計的自然演進
 抗拒設計進步的阻力
 打字機-設計自然演進的個案史
設計者誤入歧途
 美觀第一
 設計者本身不是典型的使用者
 設計者的顧客未必是使用者
設計過程的複雜性
 為了特殊使用者所做的設計
 選擇性的注意:集中注意的問題
水龍頭:設計困難的一個個案史
設計者面臨的兩項可怕誘因
 功能主義
 盲目崇拜
電腦系統的弱點

第七章 以使用者為中心的設計
把困難的工作變容易的七個原理
 應用外界的和腦中的知識
 簡化操作的結構
 把系統設計得明顯易見:縮小執行和評鑑之間的鴻溝
 把配對關係設計正確
 盡量利用自然的或人為的局限
 考慮可能發生的人為錯誤
 標準化
故意把東西設計得難以使用
設計與社會
日常用品的設計

星期四, 6月 19, 2008

Beta:10 網站流量分析與網站設計(Note)

52嶺腳瀑布

from Minwei.
這篇僅是蒐集來參考用的文章,未做深入探討。

網站設計的宗派/作者:Alan K'necht
這是2001/5/28 發表在中文cnet的文章,內容已經移除,我有找到網友的「備份,不過這些是放在網站(架構)下來談的議題,我想很多的文獻還是應該從虛擬實境來著手才是。
--
網站流量分析的文章
善用網站流量分析讓你的網站起死回生
應用網站流量分析的初級認識文章。

Using Google Analytics for Improving Library Website Content and Design: A Case Study
溫老師上課提過的,你看過了嗎?值得一看。

PV退休、WV攪局,最棒的網站排行榜在哪?
討論一般用page view分析網站效益的缺失,是篇blog文章。

星期二, 1月 29, 2008

網站設計者在台灣--資訊架構是網站設計(內容)的核心價值

Rosenfeld & Morville(2004)在《資訊架構學》一書中將此範籌的議題詳細討論。兩位作者所謂的資訊架構,指的是「資訊空間中的結構性設計,讓任務(task)的完成更容易,對資訊內容的存取更直接」,與之相關的過程如設計結構(structuring)、決定組織(organizing)、歸類(labeling)等。「設計結構(structuring)就是決定網站中資訊「單元」(atom)的粗細程度,並決定這些資訊單元之間的關係。決定組織(organizing)就是把這些元件組合成有意義而且各有特色的類別。歸類(labeling)就是找出該如何來稱呼這些類別的名稱,以及一系列導覽這些類別的鏈結。」

在訪談過程中,經常發現設計者談論到資訊架構範圍的議題,如受訪者Charlie在談論網站設計的理念時,希望「[使用者]2-3個click之內就看到他要的內容」、「不要讓[使用者]的視覺一直飄移」等等,但遺憾的是,資訊架構多半不是設計者網站設計時最主要的焦點,或者說未經系統化地規劃及執行的過程。這次受訪單位的網站規模雖然不是都特別龐大,但要「讓使用者一看就知道他所需要的資料在哪邊」(Jason),的確必須在資訊架構上多花一點功夫。相關研究也證實,一個分類不明、不符合使用者認知的瀏覽系統,是會影響使用者使用網站的效度,甚至迷失在網站當中,耗費過多時間在尋求資訊(Gullikson et al., 1999;Lazar et al., 2003)。另外,對網站管理者而言,還要付上再次建造、維護、和訓練的代價,甚至傷害了品牌價值。

|
中國生產力中心-組織圖 | 故宮-網站導覽From Infoweb
值得注意的是,從本研究受訪者的分享,可歸納出以下不同層面的問題:
  1. 內容本身組織的困難,如複雜的立法資訊,或者內容本身的模糊性、異質性、差異極大的不同觀點;
  2. 內容資料量大,選擇適當的組織系統,如Diana要面對不斷擴增的內容;
  3. 導覽系統的組織,例如要處理過多的選項需求、需要針對首頁設計多樣版型、用引導式或提醒式的方式來作服務;
  4. 標籤命名,例如按照需求分類,正確無誤地命名標示資訊;
  5. 搜尋系統,例如利用Google提供的服務搜尋該單位的網站。
另外,許多研究提出幫助使用者瀏覽網站的方法有如:組織系統、全站導覽系統(請見上圖)、區域導覽系統、網站地圖/目錄、網站索引、和網站指南等,而前列四者是台灣網站最常見的做法。其中以組織系統為例,按使用者身份別是最常見的方式,另外,還有精確性組織體系(按年表、地理位置、筆劃)、模糊性組織體系(主題、任務、比喻)等方式,設計者需能靈活地適當應用並搭配使用,才能呈現給使用者最佳的瀏覽方式。

本文為初稿,引用全文請參考這(PDF)
本文受訪者名單請參見這
本文的參考文獻

星期一, 11月 19, 2007

網站設計者在台灣-容易操作使用的網站(web usability)

設計人員期望網站容易操作使用
Symmetry
Symmetry,
uploaded by Sahaab.
本次受訪者普遍不甚重視版面的美觀,除了Diana表示故宮因為本身具有博物館的藝術性質,在設計上不論對外包廠商或是內部團隊仍有所講究,其他受訪者則大多僅要求版面簡單大方、清晰有理(Emma、Issac),版面風格設計上只在設計之初請廠商協助(Jason、Bert),事後即使使用上有問題,亦無再特別地修改,單位裡面也沒有美工專業人員。一方面可能是因為學術單位性質,設計人員認為最重要的是把要傳遞的訊息傳遞出去(Charlie),另一方面是因為美感本來就是見仁見志的問題(Gary)。Chen et al.(2005)指出簡單清晰的介面較容易被多數的使用者接受,介面的美觀與否的確不是非常迫切的問題。另外,使用者由於時間的限制或是本身作業的複雜程度,也並非一次完成心目中的作業(Rieh, 2004),清楚明確的內容及介面反而能讓使用者能夠專心在搜尋及瀏覽資訊,有利於使用者重返回先前的搜尋進度,持續進行資訊尋求的動作。

但如果說網站內容繁多或是架構功能複雜,一定要考量到一般使用者可能在知識上的落差(Shneiderman, 2001),不要讓使用者獨自面對陌生的版面風格、資訊架構、功能服務,甚至是技術詞彙,感受與介面溝通的障礙,進而迷路(Jenkins, 2003;Hoscher & Strube, 2000)。可以多多參考其他相似的網站,讓使用者能依循先前相關的心智模式與網站互動(Norman & Draper, 1986),或是用引導或提醒的方式來提供服務,如:說明(online help)、以資料類別分割區塊、網站地圖等,至於如何實作則是資訊架構(IA)的課題。

本文為初稿,引用全文請參考這
本文受訪者名單請參見這
本文的參考文獻

相關連結:

星期二, 11月 13, 2007

網站設計者在台灣(web designers in Taiwan)-內容提供者

內容提供者掌握網站的優劣
大部分的設計者重視新聞性或即時性的資訊,希望藉由訊息的發佈與使用者分享,讓使用者更能了解組織的運作。設計者也都能瞭解內容的重要性,並認為需要維護網站內容的權威性及新穎性。這些要求皆符合Tombros(2005)在研究中所指出的資訊行為,亦即尋求資訊的過程中,內容(content)是使用者評估網頁的重要依據

但是如同Bert所言「自己單位的東西自己處理」,大多數的網站設計人員或是資訊人員並非真正的資訊生產者,組織內的其他部門才是真正資料的提供者,如果組織內部不能對網站經營有共同的遠景及態度,將容易導致網站架設完成之後,維護更新上的困難。如果組織內缺乏統合資訊內容提供者的機制,就更容易惡化網站內容過舊不實用的情形,出現如「教授已經離開了,或是一些歷史資料,都沒有更新」(Issac)、「網站連結不進去」(Emma)等降低網站權威性的實例。

一部分原因如同Diana的解釋:「現在都是靜態網頁的型式,不是很容易維護管理」,尤其內容提供者分散於各部門的情況下。如何有效整合更顯困難,所以在網站未來版本規畫上,許多設計者強調網站內容應用資料庫管理,並加入後端管理的機制,希望能由真正提供資料的同仁,直接管理內容的上線出版。像Alice所屬的單位就是如此,「[依同仁的]業務性質來更新網頁,大概有一半的同仁在做這件事」,確實增加網站管理的效應。但這並不是治本之法,就像Charlie所描述的,他認為即使他們的客戶有一個完整的後端管理,若不能專心在內容的維護上,又缺乏長久網站經營及社會責任的精神,那麼再多管理功能也是徒然。

本文為初稿,引用全文請參考這
本文受訪者名單請參見這
本文的參考文獻

相關連結:

星期六, 4月 21, 2007

網站設計人員所面對的使用者(Web master)

網站設計人員所面對的一般使用者,是一群多元多變的訴求對象,從業人員無法得知擁有什麼樣特質(例如:認知風格文化背景…)及需求的使用者會前來使用網站,除非本身網站有其特殊目的(例如:藝術性、實驗性),否則網站設計若要符合大眾的需求,便須要求「萬變」。綜合各種可能的技術與介面呈現方式,如使用CSS、JavaScript、PHP、資料庫(database)、xml,以滿足不同使用者不同脈絡下的使用行為。

除了要面對使用者的多樣性,Shneiderman(2001)指出網站設計人員還要處理技術多樣性(technology variety)及使用者知識的落差(gaps in user knowledge)兩個面向的問題。技術多樣性指的是:在使用者端應用接受訊息時多重規格的設備,例如:顯示器的大小(從1024×768到手持式資訊設備)、網路頻寬、使用的軟體版本、中央處理器的速率等等,皆會影響使用者對網站可用性(usablility)的感受及接受資料的程度。如何讓設計的網站適用於各種技術之中,是設計人員的必須思考的問題。

不論使用者擁有什麼樣的網路知識和專業知識、或什麼樣的心智模式,面對初次使用的系統或網站,使用者應該都會感受到與介面溝通的障礙,因為面對的是全新的版面風格、資訊架構、功能服務,這些即可視為使用者知識的落差或是使用者經驗落差(user experience gaps),設計人員必須扮演銜接兩者之間落差的角色,以免出現如資訊架構上使用者與設計者雙方之心智模式不能對焦的狀況(Gullikson et al., 1999)。另外,可以與Hillier(2005) 彙整各研究後的結論對照,因應網站需要的作業(task)之不同,自然而然就應用不同類型的使用者介面(user interface elements)及網站結構(site structure),網站架設本身也會受到網站開發人員之文化背景的影響。釐清使用者需求性的動作(purposeful action)與網站目的(site purpose)兩者的關係成了網站設計成功的必要條件。

針對以上困難,以往各研究都多少在結論中提出建議給設計人員參考,一些實際的作法像是Chen et al.(2005)針對不同認知風格的使用者,設計一個可彈性(flexible)的網站目錄介面;除了強調說明(online help)、線上教學(tutorial)的方式。Baecker (2000)認為可利用層級的架構(level-structured),讓使用者自行設定介面的複雜程度及功能的廣度,幫助使用者適應全新的介面。Research Libraries Group聯合目錄改造計畫中採用與Google類似的搜尋介面,以符合使用者對網路上搜尋介面的心智模式(Proffitt, 2005)。另外,有許多研究者指出資訊架構中命名(lebling)、導覽系統(navigation system)及選單系統之廣度與深度(breath and depth of menu systems)的重要性,提醒設計人員在網站設計過程納入考量(Robins & Kelsey, 2002;Lazar et al., 2003;Wang et al.,2000)等等。更多的建議是針對網站介面設計上應該注意的準則,例如:蕭佳祥在他論文中的整理(民92,頁24-61),文末提供了一份面面俱到的評估表。

從廣泛的文化角度來看,除了語言/翻譯/編碼(coding)的問題(Callahan, 2005; Hillier, 2003),圖像元素(graphical elements,包含文化美學、圖示、色彩)及資訊的結構與內容(structuring and content of information,包含格式、版面、內容)都是介面設計上值得設計人員細究的地方(Callahan, 2005)。

以上各研究所指出的論點都是希望使用者介面能更貼近使用者的需求及行為。如同下圖二所強調的:在設計的循環過程中,設計者將構想付諸於系統,其中有一部分構想是來自於使用者,如對使用者進行可用性測試(usability survey)。這些理念都是源自於「以使用者為中心」(user-centered)的設計概念,一個遠離使用者的系統是無法滿足使用者的。

Preece(1998)在她書中對以使用者為中心的設計原理作了以下幾點說明:
  1. 專注於使用者與使用者的需求,並且在設計過程中,以和使用者相關的議題為中心,而不是以技術上的考量為主。
  2. 實行作業分析(task analysis)以收集使用者所需執行的作業,以及關於作業環境之相關資訊的詳細資料,如此設計人員才能究整地了解使用者的需求。除了一般的需求分析 外,作業分析也是必要的,因為它強調的是系統需要「什麼」功能(functionaliy),而不是強調「如何」去提供這些功能。
  3. 以使用者為對象,實行初期的測試與評估,以確保系統的設計符合使用者的需求。
  4. 重複多次循環式的設計(iterative design),即實行「設計→與使用者進行測試→再設計」。
相關文章:網路使用者行為-實體互動層面(physical perspective)
     網路使用者行為-情境因素(situational factor)
參考書目(Reference)

星期日, 12月 03, 2006

【開卷周報】電子版上線(open book PDF)


【開卷周報】(2006/12/2)
引用自中時部落格-開卷
在網路上排版一直是個難題,目前雖有由W3C制訂出CSS(Cascading Style Sheets)來協助機器顯示字型、顏色於網站介面,但以傳統出版發展的角度來看,依舊是小巫見大巫,離「圖文並茂」還是有一段距離。

傳統媒體,尤其是報紙,在轉型至網路平台時,必定會在版面設計與原媒體風格有所落差,台灣的聯合報體系中時體系自由時報皆是如此,原本的風格的不在,原始的精神也就有所折扣,目前只看到紐約時報這個佳例,想必他們是經過一番波折。

將原紙本資料數位化不失為初步的解決方法,既能把訊息透過網路傳播出去,又能維持版面上的風格與專輯式的編輯。今天看到開到中時的開卷在首度開放了PDF電子版,是個不錯、便利網民的服務。

星期四, 9月 28, 2006

淺論文化與網站設計(Culture and website)


骨牌效應
引用自 Arbor Scientific
資訊行為在網路環境裡,文化層面一直缺乏較完整的陳述,直到我看到這篇Mathew Hillier寫的The role of cultural context in multilingual website usability,我瞬間改觀。

作者是從語言的角度切入,旁徵博引,說明語言是如何影響網站設計、可用性等。從最簡單翻譯來看,會遇到的問題有:
  • 字詞所表達的意義(Agreement regarding the meaning of words)
  • 專有名詞、術語、俚語或是縮寫上的表達(Agreement on terminology, particularly for words of a technical nature and agreed actions regarding slang and abbreviations)
  • 片語其中所背後隱含的涵意(Phrases and meanings, which cannot be translate)
  • 文字的方向(The direction of the text)
  • 日期、時間、姓名的格式(Formats of such things as dates, times and names)
  • 字詞慣用的拼法(Choice of spelling convention)
再者,許多研究也指出在學習語言的過程同時也摻雜了社會脈絡的影響,文化會影響我們使用語言的方式,對文字(片語)的詮譯…。Matsumoto等人在語言與文化上的研究同樣指出:
people exhibit different personalities and emphasize different issues and opinions, depending upon which of their two languages that they were operating in at the time. These studies demonstrate the important role that language plays in everyday experience, and more importantly, the intertwining of language and the cultural context in which language is learnt.
Hofstede(1994)認為文化(一種泛稱)是人類心智運作(human mental programming)的概念。主要由三項要素組成,人性(human nature),是由全人類共同傳承;文化(culture),是在群體間共享,個體會彼此學習;最後則是個性(personality),只針對個人,但也會被學習與傳承。人性雖是共通價值,但需要藉由文化加以塑型,呈現出來。文化影響我們有意志的行為,但其影響就像呼吸一樣自然不自覺。因此本文作者認為每個人以文化作為注視世界之本,就像載上一層濾鏡片一樣。

在人機介面互動(human computer interaction)與可用性(usablility)方面,因為和網頁互動可視為溝通的動作,研究顯示使用者對介面的接收與喜好也是透過文化濾鏡,而網站架設本身也是如此,會受到網站開發人員之文化背景的影響。另一方面,因為網站需要的作業(task)之不同,自然而然就應用不同類型的使用者介面(user interface elements)及網站結構(site structure)。釐清使用者需求性的動作(purposeful action)與網站需求兩者的關係成了網站設計成功的必要條件。

Hillier結論:
在設計網站時,如果我們忽略了語言所包含的文化脈絡,我們即會面臨降低網站可用性的風險(If we ignore the cultural context of the language when designing the website, we run the risk of having site with reduced levels of usability)。

當我們架設一特定語言的網站時,我們也應該保證網站本身是依循該語言的文化規範(When we produce a website in a given language, we should also ensure that the website conforms to the norms of the culture in which that language is based)。

星期四, 8月 31, 2006

The Abstract of Don't make me think


書名:Don't make me think:如何設計好網站

基本上,這是一本講概念的書,不在討論程式碼或技術層面,
反而較著重於使用者和設計者之間的問題。雖說此書早已紅翻全球,但在閱讀完後,得到不少想法,故做了摘要。全書強調兩點,是對於一個網站所必要的:

1. 讓使用者立即明白該站之用途(使用不需思考)
2. 內容簡明,文字精要(設計者可自圓其說)
盡量無贅字:開場白和歡迎用詞都該死?

而在書中各章節則以此兩點為中心,延伸出許多問題討論。
針對第一點,要產生不需思考的成品需有:

1. 明顯文字標題

標題輕重有別
同類資料,其色系和型態也應相同
巢狀階層顯示 eg:報紙正副主題編排

2. 樣式鮮明者

減少背景干擾版面 過度擁擠也不好

其中有一點要特別強調,對設計者而言,創新和特色是重要的,
但對使用者來說,使用的慣例才是重要之處。
不明確的創新通常會造成使用者不便,得不償失。

對使用者來說:

1. 不會仔細看,僅僅掃瞄過去
2. 只求Satisficing(將就)
3. 不探其原理

接下來的部份在於討論,清楚明確的指標,和自我管理檢測的部份
。本書以在大賣場找尋電鋸為例,說明使用者進入網站尋找資料的多種方式。
一般分為:有特定目標者 -----自行瀏覽 OR 直接搜尋
對一般使用者來說,固定導覽和You are here 指標列都是很重要的,特別是固定導覽,大致分成:

1. 網站名稱&ICON(每頁都有最佳)
2. 回到首頁
3. 各部份功能
例外:
首頁:形式或內容可稍微修改
填表單頁:精簡版即可

而You are here 指標列則在告訴使用者現正所在位置,一般置於網頁最上方。
舉例如下:

Yahoo!奇摩:
分類首頁 > 圖書出版 > 圖書館 > 國家圖書館
About.com(是的,就是西參的那個):
You are here: About > Style > Shoes

關於You are here這個主題,http://uxnet.org/http://user-experience.org/ 有更深入的說明,可參考之。

在自我測試方面,也是以下面兩點為主要考量:

1. 這個網站的重點為何?(遠景)
2. 使用者該從何開始使用?

本書提供不少檢測法,例如:後車厢測試法

Step1 隨便選擇網站其中一頁,並列印出
Step2 將紙張拿到手臂距離外,不能完全看清楚
Step3 儘快找出清單下的每一個項目

清單:
1. 網站名稱 2. icon
3. 分區與子分區
4. 局部導覽列
5. You are here 標示
6. 搜尋列

而在提供方法之餘,也舉出好幾個範例來說明。
後面部份有講到網站設計團隊討論的策略和使用性測試等實用問題。
並特別用一章節講述網站的Accessibility(親和性),這對於現在提倡的無障礙網站有一點關聯, 有兩位研究員,讓十六位盲人測試網站,而將他們的觀察所得寫成一篇文章。
http://redish.net/content/papers/interactions.html
在本書最末列了一張書單,針對書的特性介紹給讀者,很多臺灣都有代理,可以多利用圖書館借來看。

總而言之,看了本書,說不定可以改變某種程度上的想法。
共免之。

星期五, 8月 18, 2006

Shock!「北門-淡大」公車漲價了!兼淺論網站設計

今天去淡水一程,回來時想說省錢,坐公車,沒想到今年7月1日漲價了!一共是三段票,要價36元,跟做捷運差不多了 Orz。
北門-淡大(淡江大學)中興巴士經營的公車路線,原本是從台北車站到淡水最便宜的大眾交通工具,我大學時代經常在車上睡覺晃著頭搖到淡大,如今此情此景已成往事。
----
回到家後,查了一下漲價資訊,發現中興巴士的網站設計漂亮,但滿不好用的(usability),呈現內容區塊太小,常常需要麻煩使用者使用捲軸。另一個問題是國內網站常見的問題,沒有給予獨立資訊固定連結,例如:「淡大-北門」的路線為一獨立資訊,除了應給與獨立頁面,也應該賦與(有意義的)固定連結,使其在網路空間被搜尋的到,並持續存在。每一個結點充分發揮自我描述的特質可視為網頁的基本精神。
因此我給了「悠遊網」比較高的評價,雖然這個網站並非每個版面精美,偶有粗糙之處。以下是悠遊網對自己的介紹:全方位的大眾運輸資訊服務網站,查詢公車客運路網、火車時刻、捷運資訊、飛機航班、藍色公路搭船資訊的好幫手…。沒想到台灣有這麼一個用心經營的優質網站!

星期四, 5月 04, 2006

German<->English Dictionary


上禮拜一不小心看到兩個人在使用。雖然僅是匆匆一瞥,就讓我非常喜愛,印象深刻。
其中一個應該是在做德文課的作業,另一個是在圖書館自修德文。能在這麼短的時間遇到兩個人,顯見這個網站的內容及可用性(usability)受到大家肯定。

連結

星期一, 5月 01, 2006

20分之一秒決定網站生死

在最新一期的Behaviour and Information Technology(Mar-Apr 2006)中,Lindgaard等研究者指出僅20分之一秒使用者就能判斷喜不喜歡第一次看到的網站,真的!(原篇名:Attention web designers: You have 50 milliseconds to make a good first impression!)
這跟我使用網站的經驗還滿符合的,我一直不喜歡大家愛用的Yahoo!奇摩,從第一眼我就討厭,即使它的服務跟以前相比好很多。
---  ---  ---  ---
這是從經濟日報看到的消息。(原來他們會報導這類的消息!)