無標題文件

網頁設計網頁tab(標籤)使用注意事項

發佈者:SEO香港優化專家 - Web Design

網站設計

我們小組討論的話題是tab(標籤)在使用時的禁忌

在討論的開始,大家很快產生了六個感興趣的話題:

  • 如何處理海量的tab?
  • 在瀏覽器中關掉tab之後應該發生的行為?
  • 不同tab下內容的相互關係
  • 多層tab的使用
  • Tab和SEO的關係
  • 使用多個tab工作時快速回到注意力的焦點

由於時間有限,我們討論的話題最終集中在一個點上:如何處理海量的tab?經過大家的熱烈討論,現在將一些想法以及對應的示例總結如下,還請各路英雄好漢指正。

首先回顧一下Tab的歷史。這裡的tab,是一類交互元素的統稱,既包括在web設計中的導航,也包括在瀏覽器等桌面軟件中的使用。被稱為tab的交互元素一般有如下兩個特性:

 

  • 同時具有動作和狀態兩個含義。tab之所以流行,一個原因就是因為它既方便操作,同時又能夠讓用戶清楚地知道自己目前在哪個位置(tab)
  • 從信息架構的角度來看,tab之間的內容一般是不交叉的。並且tab之間的關係應該是平等的,沒有相互隸屬的關係。

所以從廣義來講,絕大多數導航菜單其實都可以歸結為tab。

在網頁設計中tab的使用一般認為是Amazon開了先河。相信大家很多人都讀過LukeW的經典回顧文章:The History of Amazon’s Tab Navigation(中文版請猛擊這裡)。從這篇文章中我們可以看到,Amazon的導航從最初只有兩個tab:Book和Music,演化到2000年最多的時候有兩排tab。很顯然,當tab數量增多的時候,tab這種交互方式遇到了一些困難。

網頁寄存

 

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 lixiangni 的頭像
    lixiangni

    lixiangni

    lixiangni 發表在 痞客邦 留言(0) 人氣()