良好網站設計的 9 條原則

猜猜此刻世界上有多少個網站。 無論您的回答是什麼，我們都可以向您保證，這個數字已經超過 20 億！ 那是兩個後跟九個零！

但是，您可能會震驚地發現 10 個站點中有 9 個處於非活動狀態！ 這意味著它們沒有持續更新，幾乎沒有用戶流量，當然，也不會將人們轉變為他們的業務。

被警告; 最終達到 90% 非常容易，這就是我們為您製作這篇精彩文章的原因！ 下面我們將討論每個網站都需要排名前 10% 的九大設計價值（或原則），更重要的是……轉換！

1. 使視覺吸引力與您的業務目標保持一致

在瀏覽網頁時，您很可能遇到過設計不佳的網站。 讓您感到困惑、沮喪、不開心或只是無聊的網站類型！

例如，請參閱以下示例：

第一個站點擁有太多明亮和主要的顏色。 紫色、紅色和藍色都與實際網站內容髮生衝突和減損。 總體而言，這種設計在眼睛上令人不安，並證明缺乏專業性。

它表明對其用戶缺乏了解，並會導致不滿意的訪問者不想返回！

將前一個設計與下一個站點進行比較時，視覺效果完全不同！ 該網站缺乏任何顏色或尺寸，無法為查看者提供視覺層次結構。

沒有任何跡象表明應該關注哪些內容。 這種設計給人的印像是網站正在翻新，可能會讓用戶感到無聊和困惑。

那麼如何設計您的網站來避免這種情況呢？

這些步驟是促進網站視覺設計的結構。 它們不是絕對的，但在構建您的網站時是有用的指導方針。 只要符合您的業務目標，請隨時嘗試不同的顏色和样式。

在設計、佈局方面，您的內容可能非常棘手。 為了幫助我們制定了一些關於人類感知的基本法則，這些法則將幫助您創建您的網站。

A. 視覺層次

該定律規定，網站上的對象（或橫幅、花彩、海報、紙張）的尺寸越大，它被認為越重要，因此它會引起更多的關注。 反之亦然。

明亮的顏色也是如此。 一個物體在網站上出現的越亮，它所擁有的焦點就越多。 使用深色來襯托簡單的淺色背景也可以達到同樣的效果。

Instagram 在他們的網站上完美地實施了這項法律。

引起您注意的第一件事是品牌名稱“Instagram”，黑色和時尚字體與純白色背景相映成趣。 這也告訴你這個品牌是關於創造力的。

下一個引起您注意的元素是左側 iPhone 上的大圖片。 由於它的大小和綠色，它不僅能吸引你的注意力，還能讓你安心。

下一個引起您注意的元素是上面寫有“使用 Facebook 登錄”的藍色按鈕。 他們本可以輕鬆地將“註冊”按鈕放在那裡，但他們沒有。

這是因為如果您知道您不必填寫表格並使用您的 Facebook 憑據直接登錄，這也將緩解您忙碌不安的頭腦。

與 Instagram 一樣，您可以使用此法則根據網站內容的重要性來調整其大小。 這樣，訪問者將專注於您希望他們關注的特定 CTA 或信息。 並以這種方式提高您的轉化率！

B. 黃金比例

黃金比例是一種自古就有的設計手法，至今仍為現代設計師所使用！ 這個原則是經過時間考驗的，也是一個值得遵循的可靠規則。

使用一些我們不會涉及的複雜數學，我們得出以下黃金比例的圖像：

您之前可能已經看過這張圖片，並且想知道為什麼它與您網站的設計和佈局有關？ 下面我們將黃金比例覆蓋在一些精心設計的網站上。

您可能已經註意到，這些網站都是按照黃金比例（或螺旋形）排列的。 渴望知道為什麼？ 好吧，事實證明這種模式可以自然地出現在蕨類植物、花卉、貝殼甚至颶風中！

心理學家和建築師認為，按照這種模式設計的任何東西都會讓我們的大腦感到愉悅。

因此，在開發您的網站大綱時，您可以按照此方法達到相同的視覺效果。

C. 三分法

在您的網站上添加圖像時，這是一個更容易實施的原則。 以下示例顯示，在為您的網站選擇照片時，圖像應符合相交線，因為這是眼睛最有可能看到的地方。

為了確保您的圖像遵循三分法，在窗格中放置兩條平行的水平和垂直線，在圖像上形成一個由九個正方形組成的網格。

使用此網格作為指導編輯您的圖像，使照片中最吸引人的部分與相交線對齊（由下圖中的紅色圓圈標記）。

您也可以將您的聯繫電話或關鍵字放在十字路口。 向您的網站添加圖像時，請始終記住少即是多。

確保有足夠的圖片來吸引您的用戶並展示您的服務，但不要過度擁擠頁面。 正如比爾巴斯所說：“簡約是現代優雅的靈魂。”

D. 相似性法則

即使你從未聽說過這個詞，它也是你的潛意識很清楚的一個原則，因為我們的大腦被連接起來將相似的物體組合在一起。 以下是軟件開發商 Slack 實施該法律的方式：

紅色橫線突出顯示的是 Slacks 的三個品牌。 正如你所看到的，它們都被放在同一個大小的盒子裡，並且均勻地對齊和間隔開。

通過對這些項目進行分組，Slack 讓用戶很容易理解這個內容是一個投資組合塊，並確保他們網站的其他元素之間沒有混淆。

2.讓您的網站加載更快

正如標題所示，您的內容必須快速加載才能讓訪問者留在您的網站上。 快速加載站點需要成為任何設備的標準，無論是台式機、手機還是平板電腦。

具體來說，您的內容“首屏”（滾動前）應在被點擊或輸入瀏覽器的 3 秒（最大）內加載。

專門從事網絡託管評估的公司 HostingTribunal 也參與進來，報告稱，對於一家每天產生 100,000 美元收入的在線商店來說，延遲 1 秒可能會導致每年損失 250 萬美元的收入。

快是要付出代價的！ 因此，如果您想知道“我怎樣才能讓我的網站更快？”； 老實說，這是一個需要另外一篇文章的主題。

隨著互聯網連接和電信的不斷改進，您的網站訪問者的注意力和耐心正在下降。 如上所述，如果您的網站跟不上，那麼您的利潤將直線下降！

3. 讓您的網站易於定位

雖然不像您可能已經猜到的那樣直接涉及您網站的內容，但您的網站需要可以使用 Google（或任何其他搜索引擎）進行定位。

因此，假設您有一個銷售或推廣摩托車的網站，當有人在 Google 上搜索“摩托車”或任何與查詢相關的內容時，您的頁面需要在 SERP（搜索引擎結果頁面）的前 5 名中排名。

這使人們可以輕鬆找到您的網站並建立良好的印象，前提是它的設計考慮了我們的提示並且易於使用。 給訪客留下好印象可以在社交媒體上獲得正面評價或推薦給家人或朋友。

好的媒體將導致自然流量激增、更多利潤和更多時間花在您的網站上。

在這種情況下，一個完美的平行線將是一家實體店。 如果您正在尋找維修，您不太可能超越搜索引擎結果的第一頁。

當涉及到增加網站可見度的內容類型時，必須輕鬆找到指向社交媒體的鏈接。

社交可以包括 Facebook、Twitter、LinkedIn 和 Instagram 頁面，因為截至 2019 年，當前的社交媒體用戶已達到 35 億。

這意味著您的業務或內容需要擁有活躍的社交媒體帳戶，因為您的許多潛在潛在客戶/客戶會在那裡找到您。 因此，如果您的網站鏈接到您的社交網站，反之亦然，它只會帶來更多的訪問者（以及更多的潛在客戶）。

如果您想了解使您的網站在谷歌中排名靠前的技術，請閱讀這篇文章，如果這不能滿足您的願望，請嘗試 HootSuite 的這篇文章。

4. 遵守正式指南、隱私法規和網絡安全

為了保護您的業務和客戶數據免受此類攻擊，世界各地的政府都實施了正式的指導方針和法規。 其中包括 GDPR（通用數據保護條例），涉及所有個人的數據保護和隱私。

雖然我們不會在本文中解釋整個法規，但這裡的要點是，如果您的網站要求客戶共享個人數據，例如聯繫方式、姓名或信用卡詳細信息，那麼它必須是安全的。

如果您想知道您當前的網站是否符合 GDPR，您可以輕鬆地對其進行檢查。 畢竟，小心總比後悔好！

一種流行且可訪問的保護您的方法是投資 SSL 證書。 SSL 代表安全套接字層，是瀏覽器和託管您網站的服務器之間的任何網絡連接的保鏢。

他們想要你所擁有的。 不要給他們或讓他們拿走！

5.添加社會證明，如推薦信

最初是一項網絡內容創新，現在已成為行業標準。 為了使自己在競爭中脫穎而出並證明您的網站值得信賴，您需要確保在您的網站上包含有信譽的推薦信。

從尊貴的客戶那裡炫耀您的推薦信的最佳方式是引人入勝且易於瀏覽的方式。 雖然這可能意味著要求某人為您設計見證塊，但這是建立信任並向訪問者保證您的網站和服務的真實性和質量的好方法。

我的意思是，即使在成為新手機殼之前，您也可能會快速瀏覽評論！

6. 確保可訪問性

在開發您的網站時，您可能會想要使用閃爍或閃爍的按鈕，甚至採用高對比度的配色方案來將人們的注意力引導到所需的元素上。

但是，請小心，因為此功能可能會讓您真正頭痛，並且任何患有癲癇發作或畏光的人都無法觀看。

全世界約有七分之一的人患有偏頭痛。

-偏頭痛信託

這相當於大約 10.3 億人（大約），據美國眼科學會報導： 大約 80% 的偏頭痛患者是畏光的！

那是 80% 的人乍一看可能會被您的網站拒之門外。 因此，雖然這些明亮的特徵可能會引起沒有患有這種疾病的人的注意，但對於那些患有這種疾病的人來說可能會非常痛苦！

因此，在開發您的網站時要聰明並適度使用這些色彩密集型功能。

7.關注可用性

上述術語指的是網站的用戶友好程度，並涉及以下元素：網站訪問者瀏覽您的網站的難易程度、您的查詢或號召性用語 (CTA) 按鈕的可見度以及用戶找到所需信息或查詢的速度有多快.

網站的可用性因您提供的內容和您的總體業務目標而異。 例如，博客在可用性方面會有所不同，比如在線商店。

雖然所有這些列表點都是必不可少的，但響應能力是上面列出的關鍵點。 超過 50 億用戶通過智能手機瀏覽互聯網，網站的這一方面永遠不會得到足夠的重視。

8. 確保您的網站具有可擴展性

想像一下您在網上商店銷售定制設計的 T 卹。 隨著新一季《權力的遊戲》目前正在播出，您的網站已經獲得了大量流量，用戶都希望從最近發布的劇集中訂購最新設計和報價。

現在假設這個示例網站無法跟上這種湧入並崩潰。 在數百次（如果不是數千次）購買中，您的用戶會在他們的屏幕上收到一條錯誤消息。

您的客戶群會發瘋（這是輕描淡寫）！ 他們中的許多人可能會將您的店面報告為騙局並轉向您的競爭對手。 更不用說，現在在您的網站和社交媒體頁面上留下的負面評論！

為了始終確保您的訪問者和潛在客戶擁有流暢的體驗，請優化您以處理繁忙的流量。

如果您還沒有優化您的網站不是為了大流量，那麼您就是在賣空自己。

9. 確保易於維護

您極不可能堅持使用十多年前提出的相同設計。 如果你是，那麼可能是時候升級了。

現在我們不建議您在這裡進行大修。 相反，您可能想在這里或那裡調整一個元素，以防止客戶感到無聊。 這種變化可以小到將您的徽標稍微向左移動、更新圖片或更改按鈕的形狀。

如果您使用的是 WordPress 或 Joomla 等內容管理系統 (CMS)，則此更​​改沒有問題。 您需要做的就是登錄您的 CMS 並根據需要編輯您的網站。

當您在定制設計的網站中工作時，您希望與開發人員交流以下三項主要內容：

為了您的方便，這裡列出了我們在本文中描述的網站原則：

如前所述，此列表僅作為指導。 這些原則是一些簡單但必不可少的技巧，可為您提供有關如何創建網站的基本概述。

隨著時間的推移，隨著人們的偏好和需求發生變化，新的設計原則將會落實到位，但現在，盡情享受設計全新網站的過程吧！