網站頁腳是網頁中最常打折的基礎知識之一。
網站頁腳的位置位於頁面底部，這使得許多組織認為他們在那裡發佈的內容會被忽視，或者它根本不那麼重要。
幾年前可能確實如此，當時頁腳大多是版權聲明。 但是現代網站設計有更多的頁面底部可能性。 您永遠不應該忽視網站頁腳。
最好的網站設計需要最好的網頁頁腳設計。 雖然它可能看起來像是一個小功能，但它對網站的性能和成功至關重要。 為什麼會這樣，本文將進一步討論。
我們還將介紹最佳頁腳示例。
頁腳標記網頁的結尾。 用戶無法再向下滾動，因為沒有更多內容可查看。
向下導航到頁腳的使用者通常會查找更多資訊。 研究表明，訪問者通常會完整地查看網站，以接收所需的資訊。
在這種情況下，網站頁腳可能會通過提供指向特殊或補充內容的連結來提供説明。 頁腳中包含的基本資訊使網站具有專業的外觀，因為它始終可用。
要欣賞出色的網頁頁腳設計的價值，瞭解其用途非常重要。 網站頁腳是您網站中您可以真正與訪問者互動的部分。 例如，它可以用作號召性用語（CTA），以鼓勵人們註冊您提供的某項服務。
網站頁腳還有助於使用者在您的網站上查找他們可能感興趣的任何文章。 尋找您的聯繫資訊的訪問者會在這裡找到它。
頁腳必須在視覺上與網站的其餘部分保持一致，具有清晰的字體和乾淨，直接的設計。 包括網站架構、聯繫資訊、社交媒體圖示和連接。 不要忘記隱私政策和服務條款。
根據 Chartbeat的一項調查，使用者花在向下滾動普通網站上的時間比你想像的要多。
此外，在根據特定目標優化網站頁腳架構的同時，一些公司的轉化率已提高50%。 當 Smart Insights 測試更易於導航的頁腳時，他們發現每位客戶的收入增加了 16%。
由於網站擁有者擔心使用者會錯過某些內容，因此他們經常使頁腳內容過載。 但是，這種內容過度和缺乏邏輯結構會產生相反的效果，導致訪問者簡單地離開這些網站。
以下是您應該特別注意網站頁腳設計的一些原因：
- 您可以將其用作輔助號召性用語。
- 它提高了轉化率。
- 它鼓勵參與。
- 您可以使用它來推廣您的社交媒體帳戶，增強您的品牌，並強調其他重要資訊。
- 它提供了方向。
您網站的頁腳不應該只是一個包羅萬象的。 它應迅速為主要和次要導航提供基本要素和重要資訊。
基本上，網站的主要導航介面是主功能表。 它位於主頁和其他頁面的頂部，連結到最重要的網站頁面。 輔助導航通常向下到頁腳！
在開發和構建網站時，很容易忘記確保您的網站導航簡單是多麼重要。
“返回頂部”按鈕非常重要。 如果您沒有「返回頂部」按鈕，網站頁腳將説明您的訪問者快速查看整個網站。
您的訪問者可能不瞭解您的網站有多長，並且必須一直滾動到頂部才能發現某些內容很煩人。
盡可能確保您的網站頁腳包含您網站的所有不同功能。 這使得訪問您的網站變得簡單快捷，從而降低了訪問者退出的可能性。
在頁腳中加入指向其他頁面的連結可以鼓勵訪問者瀏覽您的網站並發現新事物。 它將提高您的訪客保留率。
您的網站結構
不適合主導航欄的網站頁面應位於頁腳中。 這鼓勵人們調查可能難以在網站上找到的頁面。
頁腳可能包括「聯繫我們」頁面、隱私政策、運輸和處理、購物車、圖片庫、服務頁面以及其他相關網站頁面。
組織連結
對類似的頁腳項目進行分組有助於組織連結和資訊。 考慮在列（或行）中包含聯繫人、鏈接、服務、社交媒體圖示以及最熱門頁面中的部分內容。
將每個部分放在標題下，以便每個元素都易於查看和訪問。
Google網路抓取工具在掃描網站時考慮的變數之一是相關連結的數量。 內聯連結為訪問者提供了更好的結構，以幫助他們弄清楚您的網站在說什麼。
在網站頁腳設計中設置導航連結可以説明您的網站在有機搜尋引擎結果中獲得動力並改善其SEO。
版權、隱私政策和使用條款
保護您的知識產權至關重要。 如果您的網站的獨特產品，服務，建議和公司資訊都對公眾可見，那麼保護其中的每一部分至關重要。
您可以寫下版權聲明或使用版權符號，並包括版權擁有者的姓名。 每年更新一次，以包括當前年份。
聯繫方式
訪問者希望在標題的右上角看到聯繫資訊。 您還應該在頁腳的底部中心包含基本資訊，例如聯繫人連結。
聯繫人連結不是電子郵件連結，而是指向帶有聯繫表單的聯繫人頁面的連結。 使用聯繫表單而不是電子郵件地址有許多優點。
- 表單提交可以在 Analytics（分析）中作為目標完成情況輕鬆跟蹤。
- 表單會觸發對訪問者的自動回復電子郵件，從而提供進一步的互動機會。
- 行銷自動化和其他系統可以連結到表單。
- 根據答案，表單可以提出具體問題，並直接提交給已識別的人員。
電子郵件連結經常會吸引垃圾郵件。 所以要小心。
帶有本地區號的聯繫電話和實際位址可向Google表明您是本地商家。 此外，添加您的上班時間 – 工作日，公眾假期和週末。
在處理大量資訊時，簡單的網頁設計至關重要。 通過乾淨的功能、充足的空間和邏輯組織，保持頁腳不複雜。
近年來，出現了一種被稱為「胖頁腳」的可用性趨勢，這需要包括比通常的傳統功能更多的功能，從導航開始。
過去在頁眉導航的「巨型功能表」下拉清單中的連結現在經常出現在頁腳中。 但是，請注意，連結集合不是太大，以至於訪問者無法快速掃描，或者您已經將太多分散注意力的資訊打包到其中。
以下是您的網站頁腳設計中需要考慮的其他幾個方面。
保持品牌的顏色和色調一致
在整個網站和網站頁腳設計中使用您的品牌顏色。 您可以使用不同的顏色元素來強調特定區域，但要將訪問者的注意力放在他們可以從您的網站獲得的內容上。
合併圖形元素
沒有什麼比在任何網站上看一面堅固的文字牆更令人反感的了 – 無論頁腳與否。 對於地圖或電話號碼等內容，您可以使用小的標誌性元素，但也會提供懸停狀態，其中包含“拼寫出來”的資訊。
為了增加創意頁腳設計和視覺天賦，請添加徽標或圖形元素。 包括社交圖示，以便您的訪問者可以選擇在圖示所代表的任何社交媒體平台上進行連接。
針對搜尋引擎進行優化
您可能知道您網站的頁腳設計在整個網站中都可見。 因此，您也知道這是促進關鍵字搜尋引擎優化的理想時機。
在您的網站上有一個或兩個主要關鍵字就足夠了。 但是，您不想將關鍵字塞入頁腳的每個角落。
用熱門詞使網站內容過載被稱為關鍵字堆砌 – Google認為這是垃圾郵件，並嚴重懲罰沉迷於這種做法的網站。
考慮對比度和可讀性
頁腳中的資訊通常採用非常小的文字。 這需要仔細考慮文本和背景元素之間的顏色、重量和對比度。 每個單詞都必須是可讀的。
選擇具有對比的顏色，例如帶有黑色文本的明亮背景。 避免花哨或精緻的字體。
建立分層結構
頁腳與網站的其餘部分非常相似，應按重要性順序進行構建。 最重要的信息應該是最突出的。
如果網站頁腳空間太擁擠，子頁腳可能是一個極好的位置。 您還可以使用此空間來突出獎項，或者只是將其用作娛樂物品的地方。
不要為每個連結加下劃線
很大比例的網站在頁腳中仍然有帶下劃線的連結。 這種過時的技術不適合當前網站和嚴重的頁腳設計錯誤。
注意物體過多
雖然使用可視元件和標頭是個好主意，但在剛好足夠和太多之間有一條細線。 僅在絕對必要且用於特定目的時才使用這些內容，並最大限度地利用可用空間。
使網站內容和網站頁腳保持最新有助於您保持與客戶的信任。 最新資訊還有助於功能變數名稱權威的發展。
頁腳是改善用戶體驗和搜尋引擎優化（SEO）的好地方。 網站頁腳需要很少的網頁設計資源，但可以顯著影響使用者瀏覽網站的方式。
讓我們看一下下面的一些高效的網站頁腳設計示例。
1. 阿斯特拉
讓您的網站被駭客入侵絕對是超級壓力。 高度敏感的數據落入壞人之手的風險很大。 Astra的軟體為公司和任何維護網站的人提供了強大的網路攻擊防禦。
在精彩的圖像，來自其一位客戶的認可以及導致它的通風結構之後，該網站的頁腳以其單一的海軍藍色標誌著一個完整的停止。
這種線性設計與網頁設計的其餘部分形成鮮明對比，使其成為正確的停止點，具有一組一致的列，指向網站其餘部分的內聯連結以及乾淨的社交網路塊。
2. 阿維克·克萊德
道德服裝製造商Avec Clyde選擇了一個基本的網站頁腳來補充其乾淨的在線商店設計。 雖然網站的主要導航技術是屏幕頂部的固定功能表，但網站頁腳允許使用者查看他們可能正在尋找的其他重要事實。
他們提供了一個指向其大小部分的連結，這是一個很好的觸摸，並連接到他們的常見問題解答頁面。
它謹慎而謙虛，允許使用者專注於頁面的其餘部分，同時仍然提供基本資訊。
“讓我們成為朋友”的顯微複印件非常吸引人，強調了他們悠閒的態度。
3. 阿沃
數據和分析對於説明公司實現其主要功能至關重要。 Avo為組織和操作公司的所有關鍵數據提供了一個強大的平臺。
立即吸引您注意頁腳的是他們的號召性用語「預訂演示」。用於輸入電子郵件位址的空格位於其正下方，用於開始對話。
它們使事情變得簡單，並且不會使用太多的內聯頁腳連結來混亂其佈局。 水平瀏覽螢幕區域會將您的目光直接吸引到右側的社交網路圖示上。
4. 阿卡茲
網站頁腳的一個不尋常的設計：Awwwards頁腳分為兩個部分。 第一個強化了網站的品牌原則和許多獎項。 它還包括消費者要遵循的最關鍵環節。
頁腳的第二部分包含指向所有重要資訊頁面的連結，例如隱私政策、常見問題解答和條款。
這種方法很棒，因為它是顯示廣泛功能的網站頁腳示例之一。 它既不是網站中主要致力於重要但無法訪問的資訊的部分，也不是專門用於重定向的部分。 儘管如此，它仍然可以同時完成這兩項任務。
5. 貝卡鬆弛
Becca Slack是一位內容製作人，作家和喜劇演員，在她的單頁網站上有一個時尚而寬敞的頁腳。 這是她展示作品和電影的完美結束。
邀請潛在的合作者或招聘人員通過頁腳中的表格與她聯繫。 在頁腳的底部有一個小小的Twitter圖示，漂浮在她的版權資訊上方。
在她整潔的電子郵件表單下方，藍色白色的“提交”按鈕跳出來，鼓勵訪問者聯繫Becca。 頁腳左側是她的聯繫方式 – 電子郵件地址和電話號碼。
6. 全新的學校
Brand New School不僅僅是一家設計公司，一家製作公司或一家廣告公司。 這是一家尖端的創意公司。 他們的網站說明瞭一切。
該網站設計完美，並呼應了他們的宣言“我們是活著成為原創的創作者”。 雖然主網站非常忙於許多動畫，但頁腳本身很簡單，佈局精美。
7. 黃銅指標
當您流覽品牌代理機構Brass Hands的網站時，您將享受流暢的用戶體驗。 對於懸停突出顯示的專案以及其他設計技巧，沒有什麼是不合時宜或不和諧的。 整個網頁設計具有奇妙的連貫感。
這個頁腳是黃銅手登錄頁面的整潔和平的結尾，簡單的聲明“讓我們一起工作”和與他們的社交媒體的聯繫。
8. 分支設計
這個設計業務的主頁 Clade Design 以其獨特的創造力脫穎而出，具有衝突的形狀，有趣的微交互和歡快的調色板。
背景波是此設計中反覆出現的形狀。 類似的藍色波浪出現在頁面底部，作為設計頂部的完美書尾。
這個網站頁腳的例子是一個簡單的研究。 它只有幾個鏈接，左側是「聯繫我們」號召性用語按鈕，右側是簡短的社交網路符號塊。 憑藉乾淨的結構和明確的號召性用語，這款頁腳與設計的其餘部分完美融合。
9. 設計
Designies作為連接設計師和客戶的平台，永遠不會讓使用者失望他們獨特的外觀。 它通過用招聘廣告填充它來佔用幾乎所有的空間。
向下滾動到頁腳時，空間會很好地簡化。 頁腳中的深粉紅色與深灰色和黑白空間形成鮮明對比。
當訪問者向下滾動到最後一部分時，主頂部導航會淡出，將藍色的「訂閱我們的時事通訊」號召性用語按鈕留在醒目的粉紅色塊中間。 通過刪除功能表，焦點將吸引到 CTA 按鈕。
熱連結將接管作為主導航，並且很容易找到一個連結，該連結將訪問者導航到頁面的其他部分。
10. 小提琴手
Fiddler的網站是關於人工智慧和數據研究的。 該網站很簡單，佈局合理，右側有一個聰明的動畫。 四處移動的細膩圖像與技術資訊形成了鮮明的對比。
然後是頁腳，其中包含網站體系結構的簡單摘要。
如何將資訊整齊地排列在列中，並將眼睛移動到右側的“我們正在招聘”連結，這真是太好了。 這是一個夢幻般的視覺鉤子，直接通向他們的工作板。
11. 流基
您可以從 Flowbase 克隆 10 多個不同的頁腳佈局。 它們提供了各種UI工具組以及您可以合併到Webflow設計中的其他功能。
Flowbase 頁腳以清晰、易讀、間距適中的列形式呈現了大量資訊。 設計超級簡單，賞心悅目。
12. 騷擾
Harasat，一個高品質的食品分銷商，創建了一個專業的，沒有多餘的裝飾的網站頁腳。 參觀者可以輕鬆看到這個品牌是做什麼的。 一切都完全一致。 Harasat僅使用三種顏色包含所有相關信息：深灰色作為背景，淺灰色和白色。
每個細節都經過精心考慮。 鼓勵訪問者按下列出的位置以查看其聯繫資訊。
文本上有一個很酷的懸停效果，當你的游標在它上面時，它會改變顏色。 這種低調的細節有助於頁腳乾淨，專業的外觀，並使其看起來不雜亂。
13. Hi5
Hi5是關於與他人的積極互動和團隊建設。 這個有趣的應用程式允許團隊成員互相表揚，溝通並提供反饋。 每個頁面設計都通過有趣的顏色和圖像反映了這種樂觀的態度。
更改的頁面設計也存在於頁腳中。 每個頁面都有不同的頁腳和不同的連結。 下面的那個位於網站的“關於”部分，具有最多的聯繫連結。
這是我們網站頁腳中的一個突出例子！
頁腳的左側堆疊了按鈕，允許您通過Apple App Store，Google Play，WhatsApp和其他地方下載程式。 深藍色使這些按鈕突出顯示，使其成為頁腳的焦點。
Hi5 使用頁腳右側顯示公司資訊，例如全球辦公位址，並在底部顯示一行社交網路按鈕。
14.霍莉·奧奇利
這個自稱「奇特的紙張和奇怪的商品」品牌與我們的其他網站頁腳示例不同。 您可以輕鬆轉到「關於」頁面以瞭解更多資訊。 Holly Oddly在這裡簡要介紹了她自己和品牌。 這些內容為網站增添了個人風格，讓訪問者在加強其品牌的同時感到放心。
她還使用了與網站其他部分相同的配色方案，具有懸停效果，當您將滑鼠懸停在文本上時，它會將文本變成粉紅色。 她的CTA有很好的觸感。 在淺灰色中，你會看到「加入我的秘密社團」——邀請訪客提交他們的電子郵件位址。
15. 全息圖
Hologram為公司提供了將其技術與蜂窩網路集成所需的工具。 這家公司和他們製造的SIM卡允許企業連接他們的技術，無論是工業設備上的感測器，電動滑板車還是無人機。
此頁腳與頁眉完美互補，是我們整個系列中最小的頁腳設計。
頁腳中的內聯連結提供指向術語和隱私的導航。 “支援”按鈕的動態顏色與構成整個頁腳的統一深藍色條帶形成鮮明對比。
16. 3號屋
這家餐廳的網站頁腳包含訪客可能需要的所有必要資訊。 借助Google地圖和實時聯繫人小部件，可以輕鬆到達3號房屋。 這些細微的細微差別表明他們已經考慮了消費者的需求，並願意與他們溝通。
該網站的主功能表錨定在屏幕頂部，這意味著儘管底部沒有網站地圖，但訪問者可以簡單地瀏覽他們的頁面。
最後，網站的調色板延伸到頁腳，使其與設計的其餘部分融為一體。
17.洛拉佩特
Lola Pate是一家生活方式企業，非常注重美學。 這增強了他們的品牌，並鼓勵網站用戶點擊並以更大的格式瀏覽他們的產品照片。
該公司還在其兩層頁腳中包含了最終的CTA，敦促遊客“加入我們的部落”。這種刻意的行動，加上引人入勝的微抄本，肯定會吸引人們加入他們的郵件清單。 發貨和退貨頁面也在頁腳中向下連結。
18. 精明
Savvy 為組織創建低代碼自定義工具和應用，導致其頁腳的佈局展示了它們完成的所有工作。
精明的網站頁腳設計是超級小的。 頁面最底部只有一個薄框，左側有Savvy徽標。
還有一個較小的盒子，最右邊有圓角，帶有紫色和藍色的“開始使用”號召性用語按鈕。 您會在網站正文中多次看到相同的按鈕。
19. 思考32
專業的營銷機構很棒。 他們像鐳射一樣的專注可以説明像Think32這樣的組織真正從競爭中脫穎而出。
Think32總部位於澳大利亞，是一家牙科營銷機構。 牙科圖像被低估了，包括頁腳在內的整體設計散發著任何高績效機構都會歡迎的那種當前風格化。
登陸頁面以一個非常挑釁的白色藍色氣泡打開，標題為「我為什麼要付錢給那些人進行行銷？
當您進入頁腳時，該網站將進入嚴肅的業務，並且設計精美。 號召性用語位於頁腳的正前方中央，電子郵件聯繫表單旁邊有一個淺粉色的「訂閱」按鈕，可引起人們對它的注意。
標題“為不斷增長的牙科診所進行深思熟慮的行銷”包含在左側區域，總結了該機構的理念並強調了其能力。
20.無用的寶藏
這家在線藝術商店的網站頁腳結合了現代外觀和經典的打字機風格。 很明顯，Useless Treasures擁有經過深思熟慮的原創品牌標識 – 特別是當與玫瑰內動畫嘴唇的不尋常圖像相結合時，可以給遊客一個吻！
並不是說嘴唇與頁腳設計有任何關係，但它們確實會引導您進入頁腳中下一個有趣的方面。
訪問者還可以在他們集成到頁腳中的拍打蝴蝶gif中看到這一點，這增加了一個有趣的元素，讓您想再看一眼。
無用的寶藏確保為他們的頁腳選擇最重要的資訊。 它包括運輸資訊，退貨政策，付款方式徽標和社交圖示。
21. 向量計算機
許多設計師更喜歡使用安全的方法創建基於向量的圖像，這很好。 看到像Vectornator這樣的軟體初創公司以獨特的視角進入市場是很有趣的。
當您向下滾動到頁腳時，頂部導航會逐漸消失，顯示將您帶向正確方向的內聯連結。
這是那些優秀的網站頁腳設計克制的例子之一;特別是與網站上有趣，色彩鮮豔的元素相比。 它說明了為什麼一些最好的頁腳是最簡單的。
儘管網站頁腳位於網頁設計的最底部，但它們應該是您作為設計師和網站擁有者最關心的問題。
頁腳通過其組織良好的鏈接結構，社交媒體圖示塊，新聞通訊註冊以及其他額外可能性佔據了很多空間。
與其表示網站的結束，他們應該鼓勵訪問者更深入地挖掘，瞭解更多資訊並與公司互動。
網站的頁腳揭示了很多東西，告知訪問者您是誰。 頁腳甚至可能是客戶旅程的第一步。
