2009年3月22日 星期日

[課堂心得]3/17資訊結構與網頁設計-標示系統

clickshop-icons-preview
圖片來自JJying的圖示網站

每次看到不同圖示或是一些網站的標記時,真的很快就能瞭解他的意思嗎?
究竟這些標示是用來建立網頁設計者與使用者間的橋樑還是阻隔呢?
這就是我們今天的主題「標示系統(Labeling Systems)」,本週大綱如下
  • What Labeling is and why it’s important重要性
  • Common types of labels類型
  • Guidelines for developing labels注意事項
  • Developing labels設計
------------------------------------------------------------------------------
Lebel我們又常稱為標籤,這裡翻標示,其實都一樣,就是要為了「告知使用者他要的內容在哪裡」
老師一開始舉了幾個例子跟我們解釋「Label的一致性
例如一些Search Bar在要求使用輸入檢索詞之後的點選字樣都不一樣「Go, Search, QuickSearch等」
或是名不符實,明明就是進階查詢卻標示快速查詢,等
都是對使用者經驗不夠瞭解,產生的一些問題,累積起來以後「難用」的概念就會浮現

另外網站(動態)的標示系統又與一般圖書(靜態)的標示不相同,圖書有一些頁碼、右緣標title、左緣標chapter名等,因此我們接著將主要探討網站的標示系統
Lebal的重要性(why so serious?)
  • 必須使用拜訪者看得懂的語言(要能溝通)
  • 反映網站內容(content)
  • 建立新的標示概念產生互動
在許多網站上我們可以看內容的編排或是版面設計都會產生一些疑惑或猶豫
這表示已經產生「溝通障礙」,例如對名稱意義的不瞭解(像是專業術語)
因此建設網頁的標示系統的理念究竟是給使用者?還是給管理者用?應該十分明確!
Label的類型(哪些算是標示系統阿?)
  • 超連結多寡或顏色:碰到wiki的內文超連結,你喜歡嗎?有爭議喔
  • 標題:既能幫助瀏覽,也能幫助搜尋(包括標示、編號、縮排等)
  • 導覽系統的標示:圖示與文字能不能一致呢?如標籤資料夾,使用者懂嗎(我還真猜不透你呀)
  • 索引詞標示:包括關鍵字、詮釋資料、分類架構等(這些平時看不到,search時才派上用場);另外就是網頁設計的基本功之一,Title、Description、關鍵字能不能填好,反映在搜尋引擎找不找得到!
  • 圖示(icon)標示:這個算是躲在前面的四個之中,圖示一定不能混淆概念,否則反效果
Label的設計(哪些需要注意呀?)
  • 種類越少越好:眼花撩亂的首頁大家都很常見,真的能夠幫助瞭解整個網站的全貌嗎?
  • 整體一致性:讓人可以預測,不需要另外拿本使用手冊來學習
  • 破壞一致性的慣犯:語意不通(看不懂)、語法有誤(有的動詞有的放名詞)、呈現方式差(顏色字型)、顆粒度(大小類並排)、範圍怪怪、對象槁錯(不瞭解使用者看不看得懂)
因此在Lableing或是架網站時,也先選擇一些好的藍圖(標竿)來模仿!像是一些網站或是索引典
Label的建置(步驟)
  • 內容分析:datum的部分
  • 作者分析:source的處理
  • 組織方式:怎麼擺?怎麼整理?Top-down、Card Sorting(使用者導向)、Search log(看經驗累積)
  • 微調與潤飾:網站是動態的,還是要慢慢修正一些不夠理想或不夠方便之處
------------------------------------下課-------------------------------------
謝謝收看(感覺很偷懶...)

沒有留言: