2011年3月1日 星期二

Web Marketing Association WebAwards 最佳網站獎

美國網路行銷學會(Web Marketing Association, WMA)自1997年開始每年公布全球各個行業的最佳網站。

2010年是第14屆,96個行業的最佳網站得主已經揭曉,WMA的評審會針對下列七項指標進行評估,每項指標給予0-10分,並會持續觀察網站長達14週。
  • Design
  • Ease of use
  • Copywriting
  • Interactivity
  • Use of technology
  • Innovation
  • Content

2010年教育類的Outstanding Website為:

  1. Englishtown, Inc. Englishtown
  2. HowStuffWorks.com Do you know HowStuffWorks.com?
  3. Market United Murdoch University Brand Campaign
  4. Maryland Public Television/Bean Creative Math By Design
  5. Media Explorer Limited ENABLE website by CBH of HKU
  6. Microsoft Microsoft Student Experience
  7. Nobel Web AB Honeywell-Nobel Initiative

2010年2月22日 星期一

每週進度與投影片下載

  1. 2/23/2011
    課程導覽
    A Book about Design

  2. 3/2/2011
    資訊結構概論

  3. 3/9/2011
    使用者需求與行為
  4. 3/16/2011
    組織系統

  5. 3/23/2011
    標示系統

  6. 3/30/2011
    導覽系統
    繳交作業1:組織系統(分析三個相同主題網站之組織與系統)

  7. 4/6/2011
    溫書假


  8. 4/13/2011
    搜尋系統


  9. 4/20/2011
    控制詞彙與Metadata

  10. 4/27/2011

    資訊結構之過程與方法論:Strategy


  11. 5/4/2011
    期中考
    資訊結構之過程與方法論:Implementation

  12. 5/11/2011
    資訊結構之過程與方法論:Documentation

  13. 5/18/2011
    Web Accessibility

  14. 5/25/2011
    Children Web Sites

  15. 6/1/2011


  16. 6/8/2011
    期末專題口頭報告

  17. 6/15/2011
    繳交書面報告

18. 6/22/2011

2008年3月20日 星期四

連結標示的例子

今天上課講到「連結標示」(Contextual Link)時有提到新聞網站的內文超連結,投影片上沒有舉例,覺得大家認為都很OK,請看下面這個例子。

請點報導的超連結到台視新聞網站,在網站上「一起」是clickable的,在把游標移過去前,先想想您可能會連到什麼內容,然後再把游標移過去,看看和您想的一不一樣?!

疑課業壓力大輔大男生跳樓亡著紅衣留遺書向父母道歉台視新聞 - Taiwan
就算不能盡如人意,還是得放寬心,昨天晚間,輔仁大學發生一起學生跳樓自殺案件。

2008年3月12日 星期三

Web2 0網站: 地圖日記實現矽谷創業夢

江佩蓉(2008, 3月)。Web2 0新傳奇 地圖日記實現矽谷創業夢 。30雜誌,3月號。

今天看到的新聞,提供大家參考,興許明年我貼的就是您的故事喔!

2008年3月3日 星期一

2007年7月4日 星期三

資訊結構是什麼?

“Information architect” 這個詞是「資訊焦慮」的作者Richard Saul Wurman 在1975年提出來的,但是一直到近年來國外才有人自稱為資訊結構師(information architect)。

資訊結構(information architecture)是一個新領域,也才只有幾年的時間而已,但是其未來的需求與成長是可以預見。因為網站這個新媒體的蓬勃發展,整理大量資訊的需求也愈來愈殷切。資訊結構是以圖書館學與人機互動為基礎,所發展出來的一門學問。(Van Dijck, 2003, 8)
資訊結構是網站設計的新領域。資訊結構和視覺設計或程式設計是不一樣的,因為資訊結構關心的不只是網站的外觀,也不是網站的功能(functionality)。

資訊結構的目的是建立好用、滿足站主也滿足使用者需求的網站。資訊結構不是美工,也不是程式,而是溝通。

好的資訊結構是簡單、清楚、優雅,是很容易使用的網站。
不好的資訊結構是迂迴的、不一致的、複雜的,是很難用的網站。

2007年7月3日 星期二

資訊結構師(Information Architect)做什麼?

資訊結構師的主要工作是組織網站資訊,讓使用者可以找到想要的資訊,可以完成任務。讓使用者更高興,買更多的東西,在網站停留更多的時間,讓公司賺更多的錢。


資訊結構師要做的事有:

  • 使用者研究(User research):使用者想在網站上做什麼事?完成什麼樣的任務?
  • 定義內容(content)和功能(functionality):什麼樣的內容和功能可以幫助使用者和組織達成其目的?
  • 發展組織架構(organization schemes):網站該如何組織?
  • 與視覺設計或美工設計人員,共同發展介面(interface)。
  • 監督網站的建置。


一般人認為資訊結構師要完成的成果之一是:網站地圖(sitemap)。網站地圖是網站的結構化概覽。在發展網站架構時,資訊結構師必須從各種組織方法中選擇,找出最能滿足使用者上網和組織建網目的的資訊架構。

但是,建立網站地圖不應該是資訊結構師最重要的工作,因為資訊結構不只是maps和diagrams,而是組織資訊並向團隊或上級長官溝通。因為資訊結構師擁有使用者和組織目標的深層知識,必須與程式設計師、視覺設計人員、內容作者等,密切合作,所以溝通技巧是很重要的。
所以,資訊結構師的大部份產出(deliverables)是溝通資訊,maps 和diagrams只是溝通工具而已,不可本末倒置。因為資訊結構師在網站設計團隊(web design team)中扮演重要的溝通角色,所以傾聽(listen)是必要能力。

使用者經驗(User experience)

使用者經驗是使用者訪問網站當時的感覺與想法的加總。如果是正向的訪問經驗,感覺應該很有成就感、很滿足。不好的使用經驗會驅使訪客快快離開網站,殘留的沮喪和生氣感受會讓訪客不再回到這個網站。資訊結構師要關心使用者經驗。在網站設計團隊的討論中,資訊結構師要站使用者這邊,為網站預設的客群發聲。訪問一個網站時感覺是不是愉快,取決於很多因素。包括視覺設計(look and feel)、內容(文字和圖片)、功能性(能做什麼)、和績效(速度)。但是,如果訪客找不到想找的東西或無法完成他想做的事,上面所舉的每一項要素都無法讓訪客留下正向的使用經驗。訪客最常抱怨的是,「我想不到我想找的東西」。人們對網站的認知,大半來自於是否可以達成其上網的目的。所以,好的資訊結構是網站成功的關鍵。要將使用者的任務和目的設計到網站中,資訊結構師要做的第一件事是真切地了解網站的使用者是誰,他想要上網做什麼。所有的設計決策都源自了解訪客。對使用者目標的理解與對組織目標的理解之間,必須取得平衡。通常,組織要的,可能和使用者要的是不一樣的。例如:組織希望蒐集個人資訊,個人卻想要保護個人隱私。資訊結構師的挑戰,就是怎麼樣同時關照兩方的需求。

流程與任務(Flow and tasks)

資訊結構師設計網站,而不只是網頁。訪客對網站的訪問經驗,不是由一個網頁決定的,而是由所訪問過的所有網頁來共同決定。網站中的每一個網頁都必須很好(beautiful)、很好用(easy to use)、內容很豐富(rich in content);但是如果這些網頁沒有連貫沒有條理,那麼整體的訪問經驗還是很糟糕的。

流程(Flow)連結網頁,支援任務(tasks)。任務是訪客上網打算完成的一系列動作(actions),例如發email、買書、或研究某個主題。大部份的任務需要資訊結構師設計一個流程,讓訪客可以循序逛過幾個螢幕後完成任務。任務流程是經過設計的。這就是為什麼我們必須以使用者的立場來思考訪客上站來要做什麼,然後我們才能為訪客設計流程。任務可以很複雜,可以再細分成幾個小任務(sub-tasks)。例如:發email這個簡單的任務,還可能包括一個小任務—拼字檢查(spell check)。如果網站只設計給一個人使用,只做一件事,要設計一個完美的網站就很容易。但是網站的使用者通常包括各種不同類型的使用者,所以必須能夠支援多重任務(multiple tasks)和小任務(sub-tasks)。設計流程來支援最重要的任務,不是一件簡單的事。

產出(Deliverables)

資訊結構師要提供的研究方法(methodologies)和產出(deliverables)是一長串的清單,而且這個清單還不斷地增加。其中最重要的是對網站內容和組織的描述,通常是以網站的型式呈現;以及功能性的描述,說明網站的運作方式。內容和組織的清單(List of content and organization)資訊結構師通常必須負責研擬一份網站內容及其結構的清單,而且通常是以網站地圖(sitemap)和內容表(content table)的方式呈現。

網站地圖和內容表是兩種不同的網站內容呈現方式,各有優缺點。網站地圖可以清楚地展現網頁結構;內容表則可以呈現長串的網頁內容,而且可以提供更多詳細的資訊。

現實生活中的資訊結構
早期的網站設計就像是設計真實生活中的商店櫥窗(shop window)。逛網站的感覺就像在逛街。想像網站首頁就像商店的櫥窗展示,模擬現實生活中的資訊結構和設計。
然而,網站比商店櫥窗的展示,需要更多的組織;因為逛網站比逛街辛苦多了。逛網站唯一有的互動就是clicking,眼睛看到的就只是15吋或17吋的螢幕畫面,而且每click一次,還得等數秒鐘讓網頁下載。


功能性描述(Description of functionality)
功能性描述和任務流程(task flows)是要說明網站是如何運作的,個別的網頁間是如何連結運作,訪客上網可以執行什麼任務。呈現的方式可以有很多種,包括scenarios和流程圖(flow chart)。


Wire frames
Wireframes就像是使用者介面的草圖,展現介面設計(interface design),只是少了視覺設計(visual design)。Wireframe在一個頁面展示按鈕(buttons)、連結(links)、內容(content)和其他的介面項目,同時顯示各項目之間的關係。Wireframes是由資訊結構師和視覺設計師共同發展出來的成果。Wireframe很有用,因為它讓看的人可以關注使用者介面的結構,反複修改,而無需浪費時間修改視覺設計。