網(wǎng)頁頁腳可用性設(shè)計指南

時間：2023-09-08 04:12:01 | 來源：網(wǎng)站運營

時間：2023-09-08 04:12:01 來源：網(wǎng)站運營

網(wǎng)頁頁腳可用性設(shè)計指南：

網(wǎng)頁頁腳可用性設(shè)計指南

摘要： 頁腳幾乎可以在每個網(wǎng)頁的底部找到，并且通常采用多種形式，具體取決于網(wǎng)站上的內(nèi)容類型。

關(guān)鍵詞：可用性，導(dǎo)航，信息架構(gòu)

頁腳

定義：網(wǎng)站頁腳是位于網(wǎng)站每個頁面底部、主體內(nèi)容下方的區(qū)域。

“頁腳”一詞來自印刷界，其中“頁腳”是一個一致的設(shè)計元素，可以在文檔的所有頁面中看到。

1、用戶掃描或閱讀頁面后，要么找不到他們想要的內(nèi)容，要么需要更多信息。他們滾動到頁面底部并將頁腳用作：

1.1、第二次說服的機會 例如，也許用戶在閱讀了所有詳細信息后決定不注冊銀行賬戶，但仍然對銀行機構(gòu)印象深刻并想成為客戶。頁腳是提醒或向潛在客戶介紹公司其他產(chǎn)品的好機會。

1.2、找不到想要的內(nèi)容

有時，用戶會轉(zhuǎn)向頁腳以獲取全局導(dǎo)航中可能不存在的選項。例如，那些有興趣申請工作的人可能會查看頁腳以獲取相關(guān)信息。

2、用戶有意滾動到頁腳以查找他們希望出現(xiàn)在那里的信息，例如聯(lián)系信息、有關(guān)公司的詳細信息、社交媒體帖子或鏈接，甚至發(fā)現(xiàn)網(wǎng)站上的新內(nèi)容或相關(guān)內(nèi)容。一些用戶甚至使用頁腳進行導(dǎo)航。

在這兩種情況下，無論頁腳中的內(nèi)容是什么，該頁腳都應(yīng)該是一致的、可預(yù)測的和易于發(fā)現(xiàn)的。在確定要提供哪種類型的頁腳以及要在頁腳中提供哪些內(nèi)容時，請考慮這些用例、您的網(wǎng)站目標(biāo)和頁腳目標(biāo)。

頁腳元素

以下是一些最常見的頁腳組件、示例以及使用它們的推薦情況：

• 實用鏈接
• 導(dǎo)航
• 次要鏈接
• 網(wǎng)站地圖
• 推薦或獎勵
• 組織內(nèi)的品牌
• 客戶參與（電子郵件通訊和社交媒體）

http://Uscreen.tv 包含多種類型的頁腳內(nèi)容，例如 (1) 次要任務(wù)內(nèi)容 (2) 實用程序內(nèi)容，以及 (3) 社交媒體鏈接。

實用鏈接

大多數(shù)網(wǎng)站至少傾向于在頁腳中包含實用導(dǎo)航，指向：

• 聯(lián)系信息：公司地址、電話號碼和實時聊天鏈接
• 客戶服務(wù)信息
• 隱私政策
• 使用條款

用戶通常會直接到頁腳查找聯(lián)系信息或查找獲得客戶支持的方式。無論您是否在頁面頂部有指向這些實用程序項目的鏈接，請始終將它們包含在頁腳中。

適合所有網(wǎng)站







Clarity Money 的頁腳通過包含指向使用條款和隱私政策的鏈接以及指向社交媒體帳戶







J. Crew 以指向其專用鏈接的形式提供聯(lián)系信息 客戶服務(wù) Twitter 帳戶、其電話號碼和支持電子郵件地址。

導(dǎo)航

導(dǎo)航是用戶訪問網(wǎng)站看到的第一件事和離開時看到的最后一件事——也就是說，它包含在頁面的頂部和底部。因此，頁腳可以包括全局導(dǎo)航。

適合頁面較長的網(wǎng)站，尤其是在頁面底部無法使用全局導(dǎo)航時。







United Healthcare 使用頁腳導(dǎo)航：顯示在頂部和頁腳中。

次要鏈接

次要鏈接的一些示例包括：

• 申請工作
• 內(nèi)容創(chuàng)作者任務(wù)
• 投資者信息
• 查找產(chǎn)品或服務(wù)的文檔或規(guī)格
• 訪問媒體資料和其他公關(guān)信息
• 尋找附屬公司

Dwell 雜志的頁腳包括次要任務(wù)的鏈接

網(wǎng)站地圖

網(wǎng)站地圖公開了主要導(dǎo)航類別的較低級別的子類別。它有助于：

• 暴露在全球?qū)Ш綄用娌幻黠@的潛在主題
• 提高對網(wǎng)站主要內(nèi)容的認(rèn)識
• 提醒用戶公司的產(chǎn)品

站點地圖頁腳組件不包括完整的站點地圖，除非該站點的頁面很少。除此之外，頁腳可能會變得笨拙且難以使用。

適合大型站點。







CNN 的頁腳包含指向頂級導(dǎo)航和低級類別的鏈接。

推薦或獎勵

在建立權(quán)威和信譽時，在頁腳突出榮譽可能是一個很好的策略。然而，展示過多的推薦和獎勵也可能給客戶帶來危險信號，給人的印象是公司需要展示推薦，因為它不成熟或穩(wěn)定。

適合初創(chuàng)公司或品牌知名度較低的公司。

組織內(nèi)的品牌

在頁腳中包含子公司和品牌列表也很有幫助，以加強對組織投資組合下的其他品牌或公司的認(rèn)識，并幫助用戶找到他們的方式。

適合擁有許多子公司或合作品牌的大型跨國組織。

客戶參與

用戶通常會直接到頁腳查找優(yōu)惠券和促銷等信息，或者只是了解公司的銷售和產(chǎn)品發(fā)布的最新信息。因此，頁腳可以包含允許客戶與公司保持互動的信息——社交媒體鏈接（或至少是公司社交媒體帳戶的鏈接）和郵件列表提示。

適合所有類型的網(wǎng)站。

頁腳變化

無限滾動和迷你頁腳

內(nèi)容不斷加載，因此每個頁面的底部都不一致，因此沒有頁腳部分。但是，頁腳中的內(nèi)容（通常是實用程序?qū)Ш芥溄樱┰谟覀?cè)欄或更大的擴展全局導(dǎo)航中顯示為“迷你頁腳”。







http://LinkedIn.com，通常在其他位置提供頁腳內(nèi)容，例如在右欄的底部。

上下文頁腳

對于具有多個受眾的網(wǎng)站，上下文頁腳可以顯示可能尚未進入全局導(dǎo)航但對某些用戶仍然至關(guān)重要的內(nèi)容。

常見的頁腳陷阱

1、多于兩級的信息層次結(jié)構(gòu)

解決方案：考慮重新排列內(nèi)容的優(yōu)先級，僅顯示指向一級和二級類別的鏈接，而不是整個網(wǎng)站。

2、頁腳中的鏈接名稱不明確

解決方案：團隊?wèi)?yīng)該盡量遵守傳統(tǒng)的、明確的條款。

3、結(jié)構(gòu)或信息層次不明確

• 解決方案： 通過使用指示視覺層次結(jié)構(gòu)的分組或其他視覺設(shè)計模式，清楚地傳達頁腳中項目的信息層次結(jié)構(gòu)。

4、隱藏或難以辨認(rèn)的頁腳

有時，公司選擇為頁腳鏈接使用小字體，以容納所有鏈接或減少鏈接分散注意力。更糟糕的是，出于美觀的目的，某些網(wǎng)站可能會完全隱藏頁腳。







http://Reserved.com

• 解決方案：使用清晰的字體大小和字體顏色并避免使用裝飾性字體。最重要的是，不要隱藏或折疊頁腳——人們希望它在那里。