網頁設計師的使命是創(chuàng)建引人入勝的用戶體驗，幫助網站訪問者完成任務并增加轉化次數(shù)。在這個過程中，他們往往只關注美學，走捷徑，最終依賴各種常見的設計模式和趨勢。這樣做的危險在于，它們可能會受到流行趨勢的影響，因此，由于趨勢被不適當?shù)夭渴穑虼藭霈F(xiàn)常見的用戶體驗錯誤。

當涉及到網絡，人們不想學的東西，他們想要做的事情。網絡上有很多例子，設計師選擇只關注視覺吸引力，這樣做會犧牲可用性。他們認為推動設計的“哇哇時刻”本身就足以吸引用戶。但令人遺憾的是，用戶很難理解用戶界面，使用該網站時遇到了真正的困難，并且該網站的跳出率飆升。

常見的用戶體驗錯誤驅使人們離開。

設計師應盡其所能避免常見的用戶體驗錯誤，并將障礙放入用戶的路徑。

讓我們來看看一些常見的UX錯誤。

網頁設計常見的UX錯誤1：大型固定標題

在網站上可以看到越來越多的高粘性標題。“品牌塊”和導航菜單具有固定的位置并占用大量空間。它們保持粘在瀏覽器窗口的頂部（“粘性標題”），并且經常在內容滾動時阻止內容。

大品牌網站上的一些標題高度超過150像素。他們的價值在哪里？固定元素（例如粘性標題）可以帶來真正的好處，但是網頁設計者應該小心使用它們 - 需要考慮幾個重要的UX問題。

大胖頭棒是一個主要的UX錯誤。

這個網站上的粘性標題超過160像素高，占據(jù)了很多可視區(qū)域。

粘性導航頭可能太舒服了

如果已經決定使用粘性導航標題，則最好與用戶一起測試。過度使用帶有內容的粘性導航標題是一個常見的UX錯誤。使用固定的標題，訪問者仍然可以輕松瀏覽。未能找到合適的平衡可能會為主要內容留下少量空間，并為訪客留下令人窒息，幽閉恐怖的網站體驗。

有時候CSS有一個簡單的解決方法：通過使粘性標題略微透明，人們仍然可以在滾動時通過它看到內容，這使得內容區(qū)域感覺更加豐富。

網站上的大型粘性導航是最常見的UX錯誤之一。

這個網站的粘性標題高度超過180像素！在某些筆記本電腦上，這超過了整個頁面高度的30％：用戶體驗不佳，這是可以避免的。

不考慮移動設備上粘滯的Nav Header問題

有些人可能正在使用大型高分辨率計算機顯示器，其中粘性導航頭可以加速交互，但移動設備呢？毫無疑問，大量網站訪問者將通過移動設備訪問該網站，因此固定標頭可能不是最好的主意。幸運的是，響應式設計技術可以為不同的平臺設計不同的解決方案，并堅持使用針對桌面瀏覽器的粘性導航標題。

Web設計人員常見的UX錯誤。

在這種情況下，標題導航可以說是高分辨率屏幕的正確解決方案，因為它可以實現(xiàn)更高效的導航。在較小分辨率的屏幕上，標題也是固定的，但占用了相當大的空間。移動設備上粘性導航標題的絕佳替代品是永遠存在的漢堡菜單。雖然這種模式不是一個普遍的問題解決者，但它確實釋放了大量的空間。

網頁設計常見的UX錯誤2：薄，輕字體

如今，輕薄的字體在眾多移動應用和網站上無處不在。隨著屏幕技術的進步和渲染的改進，很多設計師都在使用它們，因為它們優(yōu)雅，干凈，時尚。但是，薄字體會導致可用性問題，從而妨礙用戶體驗。

網站上所有文本的目標都是清晰易讀的，薄型會嚴重影響可讀性。并非所有訪問者都會在顯示器上查看呈現(xiàn)薄型的網站。 

最重要的是，文字必須清晰易讀。如果用戶無法閱讀您應用中的文字，那么排版的美妙程度并不重要。

Apple人機界面指南

Apple指的是移動應用程序，但同樣的原則適用于網站。易讀性是強制性的，不是可選的良好可用性。如果內容不可讀，那么將內容放在網站上是沒有意義的。

精簡字體也是移動設計中常見的UX錯誤。

移動網站上的輕薄字體示例會對可讀性產生負面影響。

以下是在使用thin類型之前需要考慮的一些常見UX錯誤：

使用輕薄字體，因為它是時尚的

字體不僅應該看起來不錯，而且應該清晰易讀。為了獲得適當?shù)膶Ρ榷群鸵鬃x性，設計師應力求在設計中實現(xiàn)最佳組合：尺寸，重量和顏色。

最好在各種設備和屏幕尺寸上測試網站，以確保所有網站文字都清晰可辨。

這導致我們下一個常見的UX錯誤：

不測試所有主要設備上的文本易讀性

對于許多設計師昂貴，精細調整的顯示器而言，輕薄型可能看起來很好，但是經常在更便宜，不合標準的顯示器上看到我們設計的普通用戶也必須考慮。最佳做法是檢查字體在所有主要設備上的外觀：臺式電腦，筆記本電腦，平板電腦和智能手機。

例如，在測試移動設計時，讓參與者在白天使用移動設備上的網站 - 現(xiàn)實世界的用戶并不總是擁有完美的瀏覽和照明條件。如果在網站上使用瘦字體，則可以采用一種簡單的方法來適應移動用戶：在移動設備上指定較粗的字體以提高可讀性。

網站的用戶體驗問題。

舊版Apple Music網站上的低對比度文本。

網頁設計常見的UX錯誤3：低對比度文本

在現(xiàn)代用戶界面設計中，使用低色彩對比元素也變得時髦。它源于極簡主義的設計趨勢，因為通過降低某些區(qū)域的對比度，設計將顯得“極簡主義”。設計師無法削減需要呈現(xiàn)的信息的復雜性，因此他們在設計中扮演低對比度。

我們已經介紹了很薄的字體，但是存在一個更大的缺陷：由于糟糕的可讀性而嚴重阻礙用戶體驗的低字形輕字體的組合。設計師應該盡一切可能避免這種可用性陷阱。

正文副本中的低文本對比度

Cool Springs Financial在其網站上使用了一個薄的Helvetica變體用于正文。雖然它看起來很優(yōu)雅，并且有助于美觀的用戶界面，但很難在幾個平臺上閱讀。雖然低對比度不一定是壞的，但它會使文本難以閱讀，從而對網站的可用性產生負面影響。

UX趨勢低對比度文本的示例。

網站上的小而薄的低對比度正文文本使其難以閱讀。

不測試文本對比度

在網絡上有一個名為Colorable的對比度檢查的漂亮工具，可以幫助設計師根據(jù)Web內容可訪問性指南設置正確的文本對比度。一旦設計師知道他們正在使用正確的文本對比，他們可以調整其網站上的其他顏色，并進行快速的多個設備/用戶測試，以確保文本可讀。

網頁設計常見的UX錯誤第4號：滾動劫持

在網絡上獲得支持的另一個高風險趨勢是“滾動劫持”。實現(xiàn)此趨勢的網站控制頁面滾動（通常使用JavaScript）。當人們遇到它時，他們不再控制頁面滾動并且無法預測其行為，這很容易導致混亂和沮喪。這是一個冒險的實驗，可能會損害網站的可用性，最糟糕的是，會導致“ 計算機風靡”。

一些網站可以通過滾動劫持逃脫，但這并不意味著每個人都可以。例如，許多網頁設計師使用滾動劫持，視差效果和各種產品的高分辨率圖像來關注Apple的網站。Apple擁有其目標市場，獨特的概念以及其網站的獨家內容。由于每個站點都有獨特的問題，因此它也必須為這些問題量身定制獨特的解決方案

不與真實用戶一起測試

借用時尚創(chuàng)意或UI模式時，最好在真實用戶身上測試網站原型，以避免UX問題。簡單的可用性測試將揭示滾動劫持的實現(xiàn)是否可行。如果不進行測試，設計人員無法知道滾動劫持是否有效，并且做出假設通常代價高昂。