• 不優(yōu)先考慮可訪問性。
• 忘記了響應(yīng)式設(shè)計的重要性。
• 為了美觀而犧牲用戶體驗。
• 不投資定制開發(fā)。
• 使用不產(chǎn)生轉(zhuǎn)化的功能。
• 網(wǎng)站缺乏層次感。
• 網(wǎng)站導(dǎo)航不清晰。
• 沒有有效地傳達(dá)您的業(yè)務(wù)目的。

1. 不優(yōu)先考慮可訪問性。

網(wǎng)站在建設(shè)前沒有充分考慮目標(biāo)客戶群，例如：客戶群，客戶年齡、職業(yè)、訪問終端等因素，單單從個人經(jīng)驗出發(fā)去設(shè)計網(wǎng)站，很容易把用戶可訪問性弱化。

• 顏色對比度不足
• 圖像或圖形的替代文本缺失或不當(dāng)
• 視覺焦點指示器不足或缺失
• 缺少可訪問的名稱或標(biāo)簽

讓我們更深入地研究其中的每一個網(wǎng)站設(shè)計細(xì)節(jié)。

色彩對比不足

顏色對比是一個經(jīng)常被忽視的可訪問性錯誤。 這種錯誤經(jīng)常發(fā)生，因為公司制作的網(wǎng)站以其品牌調(diào)色板為特色——通常在創(chuàng)建時并沒有考慮到無障礙設(shè)計。

“當(dāng)網(wǎng)站上使用的顏色組合在背景色和前景色之間缺乏足夠的色彩對比度時，文本和圖標(biāo)可能難以感知，超過 80% 的主頁存在顏色對比度問題！”

缺少或不合適的替代文字

使用屏幕閱讀器的網(wǎng)站訪問者依靠 圖像替代文本 來描述圖像或圖形傳達(dá)的內(nèi)容。 如果它丟失或沒有充分描述圖像，您將隔離需要它來細(xì)讀您網(wǎng)站的讀者。

圖片是您網(wǎng)站內(nèi)容的一部分，因此以與傳統(tǒng)網(wǎng)站副本相同的方式來思考它們很重要：通過在您的頁面上包含圖片來傳達(dá)什么信息？ 確保您使用的替代文字傳達(dá)相同的含義。

視覺焦點指示器不足或缺失

如果沒有視覺焦點指示器，訪問者將無法充分發(fā)揮您網(wǎng)站的潛力，重要的是要清楚地指示頁面上的哪個元素具有當(dāng)前焦點，以便使用鍵盤導(dǎo)航并可以看到屏幕的用戶確切地知道他們在頁面上的位置以及與活性元素。

缺少可訪問的名稱或標(biāo)簽

如果您的站點以視覺方式傳達(dá)信息，請注意那些使用輔助技術(shù)的站點。在設(shè)計以視覺方式傳達(dá)信息的頁面和組件時，應(yīng)該使用輔助技術(shù)的可訪問標(biāo)簽來傳達(dá)相同的信息。

“例如，網(wǎng)頁設(shè)計的一個普遍趨勢是卡片組件在每張卡片的底部都有一個‘閱讀更多’按鈕或鏈接。 每個按鈕與哪個項目相關(guān)聯(lián)的信息通過設(shè)計以視覺方式傳達(dá)，但是對于屏幕閱讀器來說，如果這些按鈕缺少具有相關(guān)詳細(xì)信息的可訪問標(biāo)簽，通常很難區(qū)分這些按鈕，例如“閱讀更多關(guān)于營銷中心”。

2. 忘記了響應(yīng)式設(shè)計的重要性。

2022 年第二季度，移動設(shè)備占全球網(wǎng)站流量的58% 以上——這甚至不包括平板電腦。 如果您的網(wǎng)站在移動設(shè)備上不像在桌面設(shè)備上那樣易于瀏覽，您就有可能讓訪問者感到沮喪并增加跳出率 。

現(xiàn)在的用戶比以往任何時候都更多地通過多種設(shè)備訪問網(wǎng)站； 手機(jī)、平板電腦、筆記本電腦，甚至電視。 如果我們的內(nèi)容在其中任何一個上看起來很差，訪問者就會失去信任并點擊/點擊離開該網(wǎng)站。

3.為了美觀而犧牲用戶體驗。

在過去幾年中流行起來的網(wǎng)站設(shè)計錯誤之一是將美學(xué)置于功能之上。 隨著互聯(lián)網(wǎng)變得飽和，隨著多年來新媒體和設(shè)計的大規(guī)模爆炸，卓越幾乎是成功的必要條件。 不幸的是，這已經(jīng)以過度使用設(shè)計和圖形元素而告終，這些設(shè)計和圖形元素提升了用戶的感官，但卻缺乏或感覺與網(wǎng)站的真正目的脫節(jié)。

4. 不投資定制設(shè)計。

走在市中心，您經(jīng)過一家服裝店，櫥窗陳列富有創(chuàng)意，極具視覺吸引力。 它展示了各種打折的服裝，并通過背景和引人入勝的文案講述了一個故事。 然后，你路過一家商店，櫥窗里的人體模特上只有幾件衣服——什么都沒有引起你的注意。

將您的網(wǎng)站視為企業(yè)的互聯(lián)網(wǎng)店面。 它應(yīng)該反映您的品牌，并且對您的公司來說是獨一無二的。 最重要的網(wǎng)站設(shè)計錯誤之一是選擇千篇一律的模板，建議企業(yè)優(yōu)先考慮定制網(wǎng)站建設(shè)。

5. 使用不產(chǎn)生轉(zhuǎn)化的功能。

另一個常見的錯誤是使用低效的特征。 無論一個元素在視覺上多么吸引人，請記住，首要任務(wù)是您網(wǎng)站的有效性。無數(shù)研究表明，用戶并不經(jīng)常與輪播交互，尤其是在交互成本高的移動設(shè)備上。

6.缺乏層次感。

您是否曾經(jīng)訪問過某個網(wǎng)站，卻發(fā)現(xiàn)自己不確定應(yīng)該將注意力集中在哪里？ 如果是這樣，您可能會登陸一個缺乏層次結(jié)構(gòu)的網(wǎng)站。在您的網(wǎng)站上訂購具有美學(xué)吸引力，但它也很實用。解決這個問題并不簡單，尤其是當(dāng)您的公司擁有具有不同目標(biāo)的廣泛受眾時。 但是，您最好這樣做，因為這個問題會極大地影響用戶對您網(wǎng)站的體驗。

7.導(dǎo)航不清晰。

清晰的導(dǎo)航可以減少訪問者登陸您網(wǎng)站時的摩擦體驗，這就是為什么不清晰的導(dǎo)航如此困境的原因。隨著越來越多的企業(yè)進(jìn)入數(shù)字世界，網(wǎng)站上的內(nèi)容變得更加擁擠和復(fù)雜， 擁有清晰的導(dǎo)航在您的多個接觸點和用戶旅程中和一致性將確保從第一位訪問者到倡導(dǎo)者的平穩(wěn)過渡。

8. 沒有有效地傳達(dá)您的商業(yè)目的。

當(dāng)訪問者登陸您的網(wǎng)站時，他們應(yīng)該能夠清楚地了解您公司的業(yè)務(wù)。 如果那張照片甚至有點模糊？ 您猜對了——訪問者可能會放棄您的網(wǎng)站。

您的網(wǎng)站應(yīng)該提高您企業(yè)的信譽(yù)。 如果它不能傳達(dá)您的業(yè)務(wù)目的并確認(rèn)訪問者他們在正確的位置，則可能需要重新設(shè)計網(wǎng)站。

如何修復(fù)常見的網(wǎng)站設(shè)計錯誤

現(xiàn)在我們已經(jīng)了解了最常見的網(wǎng)站設(shè)計錯誤，讓我們討論如何解決這些錯誤。 別擔(dān)心：意識是成功的一半。 現(xiàn)在您知道要避免什么，您可以開始創(chuàng)建一個以網(wǎng)站設(shè)計最佳實踐為特色的網(wǎng)站。

1. 將可訪問性放在首位。

網(wǎng)站可訪問性意味著讓每個人都可以訪問網(wǎng)站及其上的信息，因此在設(shè)計網(wǎng)站時做到正確至關(guān)重要。

2. 確保您的網(wǎng)站具有響應(yīng)式設(shè)計。

通過響應(yīng)式網(wǎng)頁設(shè)計 ，您可以放心，無論訪問者如何訪問您的網(wǎng)站，他們都將獲得無縫體驗。

3. 平衡審美情趣與無縫用戶體驗。

我們知道當(dāng)網(wǎng)站將美學(xué)放在首位而功能放在第二位時會發(fā)生什么。 在一個成功的網(wǎng)站上，可以在視覺吸引力與無縫用戶體驗之間取得平衡，使訪問者可以瀏覽頁面并找到他們正在尋找的內(nèi)容。

4. 用心設(shè)計網(wǎng)站，不要吝嗇發(fā)揮創(chuàng)意。

僅僅因為您看到許多具有特定設(shè)計或布局的網(wǎng)站并不意味著您的網(wǎng)站也需要如此。“真正有意識地考慮應(yīng)該在這個非常有價值的地方放置什么？或者，您可以決定完全改變您網(wǎng)站的布局，這樣它就不會在導(dǎo)航下方顯示圖像。 超過 70% 的企業(yè)投資于設(shè)計 ，以幫助他們的公司從競爭對手中脫穎而出，所以不要害怕做一些在你的行業(yè)中沒有其他人做的事情。

5. 不要隱藏?zé)o法轉(zhuǎn)化的特征信息。

如果您知道某項功能不會轉(zhuǎn)化或訪問者對其不屑一顧，請確保您沒有在其上隱藏關(guān)鍵信息。 （或者更好的是，完全放棄它。）如果您公司的網(wǎng)站具有輪播功能，請務(wù)必考慮最佳做法。關(guān)于輪播體驗的一些可以改進(jìn)的地方是使用高度可見的控件、限制幻燈片的數(shù)量以及將最重要的信息放在首位，除了第一張幻燈片之外，不應(yīng)隱藏任何重要內(nèi)容，因此如果用戶不與組件交互，他們一定會獲得完整的體驗。

6. 確保您的站點具有層次結(jié)構(gòu)。

如果沒有層次結(jié)構(gòu)，您的網(wǎng)站就會讓人不知所措、混亂且難以理解。 然而，有了層次結(jié)構(gòu)，訪問者就清楚地知道在哪里看和讀什么。 幸運的是，您可以通過一些快速修復(fù)來在您的網(wǎng)站上實施層次結(jié)構(gòu)。 要獲得一些想法，您應(yīng)該研究一些網(wǎng)站設(shè)計服務(wù)。一定要使用 HTML 標(biāo)題標(biāo)簽和每個標(biāo)簽的大小來向用戶傳達(dá)每行文本的相對重要性，為了避免這些錯誤，關(guān)注這三個主要屬性至關(guān)重要：比例（使用大小差異）、平衡（分配視覺元素）和構(gòu)圖（組織元素）。 應(yīng)用格式塔原則，尤其是接近度 ，來生成一個有凝聚力的結(jié)構(gòu)。”

7. 確保您網(wǎng)站的導(dǎo)航直觀。

如果您的網(wǎng)站導(dǎo)航有問題，您可能會在網(wǎng)站的跳出率中看到這一點。 將高效導(dǎo)航視為無縫用戶體驗的必備條件。

直觀的導(dǎo)航可確保流暢的用戶體驗并支持用戶的旅程，提供輕松的信息發(fā)現(xiàn)或返回特定點的方式，為了保證這一點，團(tuán)隊?wèi)?yīng)該定義導(dǎo)航級別（最好不超過三個）以及不同級別的頁面如何鏈接回其父級別。 此外，驗證正確的標(biāo)簽，讓任何用戶都能輕松理解并確認(rèn)導(dǎo)航在不同的屏幕尺寸上工作，因為它們的行為可能不同。

8. 確保通過網(wǎng)站設(shè)計和文案傳達(dá)您的商業(yè)目的。

您將使用引人注目的文案和視覺元素來實現(xiàn)這一目標(biāo)。 在開始之前，問問自己您網(wǎng)站的目的是什么。 您是否正在創(chuàng)建一個電子商務(wù)網(wǎng)站 ，訪問者可以從您的公司購買商品？ 或者您網(wǎng)站的主要目標(biāo)是告知您的團(tuán)隊提供哪些服務(wù)？ 弄清楚您網(wǎng)站的使命是什么。 您添加到站點的每個功能和副本都應(yīng)該有助于實現(xiàn)該目的。 您可能需要為您的企業(yè)使用 IT 服務(wù)， 以最大限度地提高您的受眾參與度。

避免常見的網(wǎng)站設(shè)計錯誤以提高網(wǎng)站可信度

通過避免常見的網(wǎng)站設(shè)計錯誤，您將提高網(wǎng)站的可信度，并為訪問者提供他們想要再次訪問的體驗。

網(wǎng)站設(shè)計是一項專業(yè)團(tuán)隊協(xié)同配合的工作，需要有一種循環(huán)方法，以確保團(tuán)隊、企業(yè)和用戶之間的良好互動性，沒有比測試和迭代更好的方法了，包括用戶研究和可用性測試，以確保您的網(wǎng)站朝著正確的方向發(fā)展。