網頁設計案例分析：Pettrust寵物醫療用品網站首頁設計分析

網頁設計前，很多客戶都找來一大堆網站案例，讓我們去設計。的確，觀察別人網站，了解那些好看又使用的頁面是怎樣運作設計的，能幫我們找到靈感之餘，還能確定好網站定位和方向。但是有時蒐集了大量各式各樣的範本素材，有可能會讓人眼花繚亂，越看越不知道該怎樣設計。

今天，小編將和大家一起說說，確定範文素材後，要如何分析才能為自家網站所用。本文將以「Pettrust寵物醫療用品網站」作為本次的網頁設計案例分析，有興趣的朋友就往下看吧!

網頁設計案例分析：Pettrust寵物醫療用品網站首頁設計分析

網頁設計案例分析

♎ 建立視覺目標

網站首頁，就好像店面的大門，傳遞給消費者「我是誰」的意思。

Pettrust網站設計首頁以健康寵物為首圖，容易讓用戶聯想到寵物、正向、安心等關鍵字或感受。品牌醫療對象雖然是「動物」，但是受眾目標是「寵物主人」，因此在建立品牌形象時，除了展現出「我是專業的寵物醫療專家」外，還給用戶帶來如寵物般溫暖的信賴感。

♎ 基礎色調簡單

為避免用戶眼花繚亂、模糊醫療專業形象，Pettrust的主色調採用明亮而不刺眼的橘色，以區別於其他醫療類網站。(市面上絕大多數醫療類網站都是選擇藍色、綠色等冷色系，以給人專業與權威的感覺)這主要是因為Pettrust網站是以寵物、照顧為品牌形象，考慮暖色系既可展現出寵物活潑的一面，同時也給用戶傳遞一種溫馨的溫暖。

輔助色方面，主要以白色和透明度低的淺藕為主，讓整個界面呈現出乾淨的感覺，同時也避免以繽紛熱鬧的視覺效果設計網站，容易讓用戶分神，無法將實現集中於界面的重點上。

♎ 空間適時留白

Pettrust網站設計適時使用留白，讓用戶的眼睛有喘息的空間，以及足夠的時間好好消化資訊。

在最上方的目錄區，Pettrust讓目錄選單一整排清晰展開，中間沒有被其他元素打斷，使各選項之間有種「屬於同一層級」的關係感。第二、三項旁邊出現小箭頭標誌，可讓用戶直覺知道「這裏有其他子目錄可供瀏覽」，當游標滑過去時會特別停頓留意。

在最右的語言選單中，延續目錄選單的字體，但中間留白大於每個選項簡的留白，可讓用戶知道此區域並不屬於目錄群，再加上地圖圖案，方便用戶選擇自己熟悉的語言。