9個有效的主頁設計示例

已發表: 2020-10-11

設計一個在其他網站的海洋中脫穎而出的主頁,所有這些都在爭奪至少一部分目標受眾,這可能是一件棘手的事情。 您希望您的設計能夠說明您作為一個品牌的身份、您試圖傳達的信息以及您的立場。 當然,您希望它看起來不錯。

為了給您一些靈感並幫助您入門,我們編制了一個列表,其中包含九個簡單有效的主頁設計示例。 希望他們能為您自己的主頁提供一些想法,並使您自己的設計過程更容易。

用你的關鍵信息打開

您主頁的英雄部分是您最有價值的房地產。 這是人們登陸您的網站時首先看到的內容,這是您立即吸引他們興趣的機會。

一個很好的方法是打開你的主要觀點。 例如,Forms on Fire 會立即打開他們的銷售信息,毫無疑問他們提供什麼。 他們的核心價值在這裡體現:他們通過數字化表格使工作更容易。

資料來源:formsonfire.com

並為您的英雄添加其他內容

除了用大字體寫出的一個關鍵信息,在你的英雄身上脫穎而出,你還可以在其中添加一些額外的副本。 這取決於您從事的業務類型,您首先要考慮您的目標受眾可能會如何對更多的銷售文案做出反應。

例如,Freshbooks 在其英雄部分添加了另外兩句話,加深了他們的標語並添加了一些更有力的詞:簡單、快速、安全

資料來源:freshbooks.com

選擇突出的顏色

您選擇在設計中使用的顏色可能比您想像的要重要得多。 不同的顏色會引發不同的情緒,你可能會在不知不覺中發出錯誤的信息。

您的配色方案可以充分說明您作為一個品牌的身份:鮮豔的色彩會說明您的俏皮和輕鬆的態度,黑白網站可能會反映您時尚的一面,綠色可以讓人們知道您是一個環保品牌,並且很快。

這是 Pixelgrade 的一個例子,它選擇了一種非常豐富多彩的方法——這種設計肯定會吸引你的注意力,在這種情況下,它還展示了你可以用他們的產品做的不同事情。

資料來源:pixelgrade.com

用數字來說明你的觀點

有時,數字勝於雄辯。 因此,與其詳細說明您與多少客戶合作過,不如使用實際數據來說明這一點。

你還應該讓這些數字脫穎而出——使用更大的字體,使用對比色,將它們放在頁面的顯眼部分。

My Company Works 展示了他們在硬數字方面的經驗,這非常有效——畢竟,吹噓大約 60 000 多個客戶並不是真正的吹噓,而更像是一種聲明。

資料來源:mycompanyworks.com

使用自定義插圖

除了主頁上的數字和文字外,還應該涉及某種視覺效果。 您可以使用視頻、圖像、動畫或插圖。 只要您選擇的是完全定制的並與您的品牌標識保持一致,您就不會出錯。

我們在這裡強調自定義一詞,因為您不想使用其他人已經展示的視覺效果。 它不會讓你脫穎而出,它不會讓你被認出來,而且它肯定不會像原創的東西那樣與你的品牌故事相匹配。

Evernote 的主頁上有一些非常簡單的圖形——但它們完美地說明了要點,它們與頁面的其餘部分設計一致,而且它們並不會分散副本本身的注意力。

資料來源:evernote.com

或者展示一點產品

您還可以使用將在您的主頁上顯示實際產品的屏幕截圖(或近似屏幕截圖)。 您可以通過演示視頻達到相同的目的,但知道不是每個人都會對視頻感興趣或有時間觀看,您仍然可以一次性展示產品並獲得一些漂亮的視覺效果。

Mint 在主頁上使用他們應用程序的圖像——這些圖像是定制的,很好地融入了整體設計,而且他們顯然做了基本的工作來展示產品是什麼以及它如何在日常生活中幫助人們。

資料來源:mint.com

吹噓你的成就

雖然這種策略肯定不會在每個行業都奏效,也肯定不會吸引所有類型的受眾,但有時吹噓自己最大的成就可以帶來一大堆新客戶。

但是,請注意如何展示這一點。 你不希望一切都與你有關。 您希望您的頂級合同或頂級功能表明您做得很好並且您可以幫助查看您頁面的人 -而不是您令人難以置信且昂貴並且不與任何人一起工作。

Jill Konrath 使用徽標來做到這一點——她網站的英雄部分有一排大的出版名稱徽標,它立即告訴您她曾出現在一些非常重要的雜誌和論文中。 而且它不會太突兀,也不會太直接。 有用。

資料來源:jillkonrath.com

選擇強大的 CTA

任何東西都可以是 CTA。 你可以讓它變短,你可以讓它很長,或者你可以讓它變得可預測。 所有那些“聯繫方式”、“點擊這裡”等等——它們可能會在一段時間後變得有點平凡。

此外,如果可能,CTA 還應該旨在提供某種價值。 如果您要求某人訂閱您的時事通訊,肯定有比“註冊”更好的表達方式——當然,這取決於您的目標受眾。 很多網站都使用各種“很棒的內容”。 它確實有效。

例如,Startup Resources 有一個很好的 CTA。 它封裝了品牌的所有內容:加入他們的 2,000 多名企業家的電子郵件列表,並獲得每週精選的有用工具的電子郵件,您可以嘗試這些工具。

來源:startupresources.io

讓它成為你自己的

最後,你應該從這篇文章中得到的主要建議是你的主頁必須是你自己的。 即使您不遵守我們上面列出的任何建議,即使這些想法都不吸引您——那完全可以。

設計一個符合您想要的主頁,以及您認為您的觀眾會欣賞的主頁。 讓它展示你作為一個品牌和品牌背後的一群人的真實身份。

為了說明這一點,這里以 Ahrefs 為例。 他們結合了我們所說的一些元素:偉大的 CTA、冷酷的數字、產品截圖、吹牛的權利——但他們的主頁實際上遠不止這些。 這是他們品牌的反映,這就是為什麼它運作得如此出色的原因。

資料來源:ahrefs.com

總結一下

看看我們列出的一些設計理念,然後開始勾勒出您自己的主頁設計。 請記住,這將是一項永遠在進行的工作——您將永遠有更多的想法,並希望讓它變得更好。 在您覺得頁面有效、與您的品牌和目標受眾一致的地方切斷自己,然後將其拿出來進行試駕。

Digiprove 密封件This content has been Digiproved © 2020 Tribulant Software