20個關於頁面設計示例和想法的創意網站

無論是哪個行業, 關於頁面 是您將設計的第一頁之一。 畢竟,這是用戶在了解有關您的業務的更多信息時訪問的頁面。 “關於”頁麵包含有關您是誰以及您從事此業務的原因的基本信息。 儘管有些人可能會忽略此關於頁面,但您永遠不應該這樣做。 

相反,讓您的“關於”頁面精心設計並脫穎而出,這樣任何人都不會忽視它。 你很少有第二次機會給人留下好印象。 由於“關於”頁面是您對世界的介紹,因此您必須確保其設計、內容和所有視覺效果協調一致,以傳達有關您和您的業務的有趣故事。 目的是說服你的聽眾相信你。 



製作您的第一個網站? 嘗試無代碼網站構建器
您不需要編碼技能即可使用 Wix 等構建器創建網站。 該工具帶有 800 多個設計師模板,允許您從移動設備管理您的網站 > 單擊此處免費試用 Wix


是什麼讓關於頁面的創意和有效

有效的“關於”頁面通過更好地與訪問者建立聯繫,有助於提高轉化率。 因此,它應該以銷售為導向並解決訪問者的問題。 

沒有一個簡單而可靠的食譜適用於所有人。 但是,幾個關鍵要素可以提供幫助:

  • 使命——傳達您的業務目標; 您的訪問者想知道他們是否與您有相似的核心價值觀。 
  • 您的故事(背景)——傳達您的業務起源; 有時,它是一切開始的歷史和更吸引用戶的挑戰。
  • 您的產品/服務(利益)——總結您的產品,以幫助您的用戶了解您所做的事情與您的品牌價值之間的聯繫; 突出優點以及它們可以為用戶做些什麼。
  • 您的社交證明——展示客戶評論、客戶推薦、案例研究等可以確立您的地位。 

相關讀物

考慮到這些,您可以製作一個框架來構建一個引人入勝的關於頁面。 從這 20 個創意有效的關於頁面設計中汲取靈感:

1.Madebyband

樂隊樂隊
Madebyband 通過簡單的視覺效果巧妙地表現了自己。 

Madebyband 的關於頁面 對事情有不同的看法。 以“圖片說一千個詞”為動力,Madebyband 通過簡單的個人形像傳達其品牌的獨特個性。 在別緻的背景圖片上使用手工製作的字體說明了等待客戶的體驗。

白色空間完美地突出了每張圖片,實現了設計、色彩和視覺效果之間的平衡。 向下滾動可以看到他們的歷史,其中包含有關驅動他們的信息。 簡短而有力。 一個有價值的號召性用語 (CTA) 按鈕會跟他們聯繫。 

2。 Mailchimp

mailchimp
Mailchimp 在所有正確的平衡中突出其優勢。

Mailchimp的 關於頁面 通過展示其對小型企業的承諾,它充滿了必要的售前能力。 從創始人的故事開始,他們重申了他們對小企業的關注,並解釋了 Mailchimp 作為小企業主可用的昂貴電子郵件軟件的替代品的目的。  

About 頁面強調 Mailchimp 的企業公民意識,他們確認已投資超過 12 萬美元來幫助中小型組織通過 Big Change Starts Small 實現發展。 您可以感受到色彩豐富且製作精良的頁面背後的誠實和真誠。 

3.紫色,搖滾,剪刀

紫色石頭剪刀
Purple, Rock, Scissors 完美地平衡了動畫與靜態視覺效果。

確實是技術奇蹟, Purple, Rock, Scissors' 關於頁面 整個頁面都有有趣的動畫。 不要太多或太少,在運動和靜態視覺之間取得適當的平衡。 調色板簡單但對比鮮明。 視覺效果具有創意且引人注目。 

他們的價值觀以簡潔而有影響力的方式提出。 你會忍不住畫進去。他們所做的就是用簡單的文字藝術地呈現出來。 “關於”頁面的精美動畫散發出用各種技術和工具吸引觀眾的不同方式的故事蹟象。 “開始對話” CTA 按鈕有效地放置在底部,敦促您採取行動。    

4. 末日樹

末日樹
DoomTree 採用創新設計。 

DoomTree 的關於頁面 是一種別緻和創新的方式來告知觀眾他們是誰。 以全體工作人員的精彩照片為特色,它告訴你這些朋友不是作為一個樂隊而是作為一個團體聚集在一起為這個唱片公司創作音樂的。 每個船員的照片都經過藝術突出和信息豐富。 

CTA 位於正確的位置,配色方案描繪了對業務的專業旋轉。 DoomTree 的 About 頁面巧妙地使用了音頻和視覺效果,敦促您進一步探索。  

5。 莫茲

MOZ
Moz 以高度可視化的時間線吸引用戶。

Moz 決定設計他們的 關於頁面,以充滿活力的時光機主題為中心。 Moz 通過時間線展示了其豐富的歷史,通過簡單的幾何放置片段展示。 這些里程碑整齊地分開,由清晰的標題、簡短的解釋和簡單易讀的圖形分隔。

他們謙虛地將成功歸功於資金這一事實證明了 Moz 的謙遜和誠實,這引起了大多數人的共鳴。 流程以他們將來打算去的地方結束; 這是無縫的,因此易於消化。 

6.大卡特爾

大卡特爾
大卡特爾在他們坦誠的員工照片中展示了不同的個性。

大卡特爾的關於頁面 足以概括這家公司是為了幫助你 在線銷售. Big Cartel 提供了一個在線平台來構建和管理您的在線商店。 “對於藝術家來說,藝術家之作是一個朗朗上口的標語。 您立即知道 Big Cartel 就是關於您和您的產品的。 

包含視頻有助於更好地解釋。 我特別喜歡向下滾動時顯示的坦率員工照片,這為“關於”頁面提供了一種令人耳目一新的不同方式; 它們不是上演的 ID 徽章類型,而是獨特且個性化的,從而增加了參與度。 

7. 安東和艾琳

安東和艾琳
Anton & Irene 將視差滾動效果提升到了一個新的水平。

或許,目前我看到的最有特色的就是這個 Anton & Irene 關於頁面. 將鼠標懸停在兩個人上會帶來令人愉悅的不同姿勢。 作為一家設計機構,他們對巧妙而獨特的動畫的使用雖然簡單,但功能強大。 當您向下滾動時,您會看到人類分開並顯示相關信息; 這包括他們所做的項目。 

最後,您會看到他們在白雪皚皚的背景下擊劍的圖像。 這並不意味著安東和艾琳在彼此的脖子上,而是更像是在挑戰彼此更高的高度。 大膽的色彩與古怪的視覺效果形成鮮明對比,Anton & Irene 提高了標準。 

8.新穎性

當下
NOWNESS 採用更橫向的方法設計。

新穎性 關於頁面設計選擇了黑白的方法,描繪了一種相當沉悶和專業的基調。 由於它們都是關於全球藝術和文化的,因此該頁面以一段視頻作為核心。 它們不是讓您向下滾動,而是提供了一種更水平的方法,您可以在其中通過選項卡來操縱相關信息,這令人耳目一新。 

NOWNESS 為他們的獎項設立了一個標籤,證明了其強大的市場地位。 簡單而全面,足以通過以視頻為中心的美學展示他們的策展專業知識,“關於”頁面設計精良,帶有可見的“成為會員”CTA 按鈕。 

9. 古米西格

口香糖
Gummisig 明顯展示了對設計的承諾和熱情。 

我覺得 Gummisig 的關於頁面 同類中的一種。 帶有分隔部分以突出顯示點的大文本很有影響力。 他以第三人稱講話開始了他的投資組合。 然後他改變並談論他的背景,原則和價值觀。 當他自信地提到他的客戶時,他以一種不自吹自擂的方式這樣做,這是值得稱讚的。 

他通過油畫背景使用自然色彩,以描繪寧靜的灰色調色板,這是一種非常巧妙的色彩搭配。 “關於”頁面顯示了他對設計的熱情、自由奔放的舉止、深入的承諾,以及他平易近人。 

10. 庫羅阿祖爾

庫羅阿祖爾
Couro Azul 提供時尚的設計和迷人的視覺享受。

導航時 Couro Azul 的關於頁面,你不禁敬畏。 第一眼就足以吸引你,渴望更多。 “關於”頁面開頭的簡單動畫給您一種非常豪華和優雅的感覺,並告訴您這家家族企業的歷史可以追溯到幾年前。

當您向下滾動時,您開始了解它們的作用。 起源、歷史、價值觀和承諾都清晰地展示出來,我覺得整個體驗很迷人。 生態卓越證書證明了他們對業務的認真,並充分說明了他們的價值觀。 總體而言,引人入勝的設計確實帶來了視覺上的愉悅。 

11。 Wix

Wix
Wix 在其專業設計的關於頁面中以時尚的方式展示自己。

Wix 的關於頁面 在空白使用方面令人欽佩。 內容居中放置,有大量空白區域以突出顯示文本。 雖然這很好地平衡了視覺和環境,但它也創造了專業的外觀和感覺。 Wix 的時間線顯示在水平線上,便於閱讀和使用。 

About 頁面設計時尚,視覺效果簡潔明快,排版時尚,體現了 Wix 作為首選的網站構建工具。 

12. EB 珍珠

eb珍珠
EB Pearls 優雅地管理著一個全面的關於頁面。

EB Pearls 關於頁面 是一個全面而精心設計的關於頁面的榜樣。 雖然整體設計並不少見,但他們使用簡潔的字體與乾淨柔和的調色板的方式值得注意。 EB Pearls 通過一個可見的 CTA 按鈕簡單明了地介紹自己。

向下滾動時,您將了解他們的客戶和成就。 然後,他們會帶您去了解他們並分享他們的信仰和原則。 白色空間和淺色視覺效果的使用營造出優雅和舒緩的效果。 做得太好了。

13. 魔術勺

魔術勺
Magic Spoon 在直觀易懂的比較圖表中表現出色。

乍一看, Magic Spoon 的關於頁面 贏得了我的笑容。 我特別喜歡他們以一個相關的問題開始他們的“關於”頁面 - “還記得童年無憂無慮的日子,當你對吃大量營養不良的穀物感到內疚時?” 任何人都會知道 Magic Spoon 是關於健康穀物的。 

Magic Spoon 觸動了許多人的心弦,巧妙地附上了與知名品牌的對比圖; 這張圖表清晰易讀,不會破壞大腦。 此外,有趣和明亮的色彩為觀眾創造了更難忘的體驗。 向他們致敬! 

14. 瑪麗·弗雷奧

瑪麗·福萊奧
Marie Forleo 在她的“關於”頁面上使用了一個長格式的字母。 

最讓我印象深刻的是 瑪麗·弗里歐 在給觀眾的一封信中開始她的“關於”頁面。 她介紹了自己並有趣地講述了她的故事。 有足夠的空白讓眼睛看起來很舒服,她用圖像分解了文字。 

然後,她使用相關圖像作為她的社交證明。 當你向下滾動閱讀她的自傳時,你會很高興閱讀“這將我帶到你身邊”; 這是將焦點帶回讀者的恰當方式。 畢竟,一切都是為了觀眾,不是嗎?

15。 Giphy

giphy
Giphy 在其關於頁面上將動畫提升到了一個新的水平。

Giphy的關於頁面 都是關於動畫的。 畢竟,動畫就是他們所做的。 在“關於”頁面的開頭,你會看到一個關於 Gilphy 的簡短介紹,然後是一個超級可愛但功能強大的類似增強現實的 GIF,它似乎帶你踏上頁面之旅,設計非常巧妙。

向下滾動時,您會看到各種動畫 插圖 充滿活力和創造力; 這展示了他們的專業知識。 Giphy 通過這些不同的動畫效果巧妙地講述了他們的故事。

16 500px

500px
500px 採用不同尋常的方法,但仍保持專業性。 

500px 是給攝影師的。 因此,“關於”頁面有許多令人驚嘆的圖像也就不足為奇了。 當您登陸“關於”頁面時,一張高質量的圖片會顯示一條狗正在質疑地看著您。 就好像狗在問它如何能幫助你(我臉上帶著微笑)。 幽默和古怪將總結頁面。 

文本保持在最低限度,但足以傳達關鍵點。 您會注意到分解的文本便於閱讀。 突出他們的不同之處對於吸引觀眾注意他們的獲勝點至關重要,這是一個聰明的舉動。

17. Lovebug 益生菌

愛虫益生菌
LoveBug Probiotics 使用強大的標語來增加參與度。 

標語“全家益生菌”概括了一切 關於 LoveBug 益生菌. 看到不同年齡段的孩子和可愛的嬰兒回首的可愛形象,足以拉動您的心弦,進一步探索這家公司。 你建立了良好的第一印象,尤其是當你讀到媽媽開始創業時(媽媽總是把孩子的最大利益放在心上)。 

藍色和白色調色板散發出更健康的外觀。 頁面上的每個元素都有一個很好的理由。 在底部,當您有揮之不去的問題時,詳細的常見問題解答會有所幫助。 相關的 CTA 敦促您探索他們的產品。

18. 查塔努加複興基金

查塔努加文藝復興
查塔努加文藝復興運動採用更傳統但更有影響力的設計。 

查塔努加文藝復興 在其“關於我們”頁面上採用更傳統的方法。 在介紹了自己之後,他們通過解釋他們的目的和提及已經在船上的家喻戶曉的品牌來吸引觀眾的注意力; 這會自動鼓勵讀者找出促使這些大牌註冊的原因。

查塔努加地區的精美照片旨在吸引讀者的注意力。 有一個設計巧妙的團隊作品集,您可以在其中單擊縮略圖來閱讀它們中的每一個。 最後但並非最不重要的一點是,它們以如何幫助您結束,這很聰明。 重新關注觀眾是保持讀者註意力停留和進一步探索的最佳方式。 

19.鉛G2

鉛G2
LeadG2 在正確的地方有效地使用 CTA。

LeadG2 的關於頁面 簡單而直接的目標。 他們從簡短的介紹開始,然後深入探討使他們在競爭中脫穎而出的原因。 兩個 CTA 按鈕都是可見的,並位於中心以加強強調。 向下滾動將帶您踏上了解他們團隊的旅程。 雖然有些人可能會發現低質量的紫色背景,但這都是相對的。

分享他們的文化和認證是與觀眾更好地聯繫的明智之舉。 有足夠的空白空間,平衡良好的顏色創造了突出關鍵點所需的平衡。 將鼠標懸停在 CTA 上會產生“移出”效果,促使您單擊它們。

20.馬里昂

馬里昂
Marion 完美平衡了所有必需品。

Marion 的“關於”頁面 巧妙地使用顏色,產生有影響力但易於眼睛的效果。 在高質量的背景圖像上使用文本非常適合開始介紹。 然後它們過渡到白色背景,以獲得更強烈但令人愉悅的對比。

Marion 決定首先關注他們的獎項,以幫助您更長時間地保持注意力。 然後,他們展示他們的專業知識和獨特的賣點,以保持您的興趣。 在底部,他們包含了一個聯繫表格,以敦促您採取下一個所需的步驟。 

建立您的創意關於頁面

請記住,您的“關於”頁面建立了您與潛在客戶的第一次親密聯繫。 因此,請查看以上 20 個關於頁面設計的創意網站,以幫助您在設計頁面時展現您的創意和藝術天性。 

閱讀更多

作者照片

文章 Pui Mun h