模態框是一個漂亮的小功能，可讓您在網站頂部顯示不同的消息，被吹捧為非常有用。有些人甚至聲稱它們的幫助足以完全取代我們都非常討厭的橫幅廣告。但是網頁設計中的模態是用戶體驗災難嗎？
如果您不熟悉該術語，模態是當訪問者單擊超鏈接或懸停圖像時出現的對話窗口。
假設您想收集現場訂閱者，或者您希望訪問者注冊免費贈品。在這種情況下，您可以使用模態。
然而，許多網頁設計師——以及一些網站訪問者——反對在網頁設計中使用模式。主要論點是它會影響用戶體驗。但是網頁設計中的模態是用戶體驗災難嗎？請仔細閱讀，找出答案。
 
模態是做什么的？模態框通常在網頁上顯示為彈出窗口，請求訪問者采取行動。大多數情況下，它們會在單擊頁面元素后出現。
也稱為燈箱，模式隔離頁面的主要內容。在重新評估頁面之前，用戶必須完成模式請求的操作或關閉它。
網頁設計師使用模態來吸引訪問者的注意力。由于無法訪問其他頁面內容，因此訪問者必須與模式交互。
 
UX中模態的缺點雖然 UX 中的模態有不同的缺點，但它們都歸結為一個缺點——中斷。當模態出現時，它們會打斷用戶正在做的任何事情。
與常規彈出窗口不同，用戶不能簡單地忽略模式并繼續瀏覽。因此，模態需要立即關注。 
用戶可能感興趣并決定與模態交互。但是，如果模態的內容與頁面的內容不同，用戶可能會在與模態交互后忘記他們在做什么。
此外，有時模式需要與頁面上的信息相關的操作。例如，假設用戶想要在采取行動之前查看信息。在這種情況下，他們將不得不關閉模式，因為主頁無法訪問。
統計數據顯示，高達82% 的用戶不喜歡彈窗。大多數網站訪問者并不了解網頁設計的技術細節。因此，他們將無法區分常規彈出窗口和模式。
畢竟，模態框是一種彈出窗口。一些用戶可能會認為模式更糟糕，因為它們會使頁面的主要內容變暗，使其無法訪問。
此外，人們希望訪問一個網站并立即獲得他們想要的東西。因此，時間很重要。因此，需要花費時間的操作的模態可能會使網站失去訪問者。
有了所有這些缺點，您就可以理解為什么許多網頁設計師說模態是網頁設計中的 UX 災難。
 
模態在 UX 中有用嗎？在某些情況下，模態很有幫助，它們可以改善用戶體驗。許多網頁設計師都對模式的有用性發誓，不難理解為什么。
首先，模態可以幫助簡化網站的內容。例如，如果您的網站相對復雜，包含大量內容和元素，用戶可以立即退出頁面。
您可以使用模態來解釋頁面上的內容，以免用戶感到困惑。當用戶單擊后退按鈕時，模式可能會顯示。模態可以突出頁面上最關鍵的內容，并告訴用戶下一步該做什么。
其次，如果您必須吸引用戶的注意力，模式是非常寶貴的。例如，您可能想要顯示警告或傳遞用戶在繼續瀏覽之前必須知道的任何重要信息。
如前所述，用戶可以輕松忽略彈出窗口，尤其是當它在新窗口中打開時。但是，對于模態框，用戶在繼續之前必須至少查看內容。
第三，模態可以使網頁更易于導航?？紤]到缺點，這聽起來很諷刺，但如果實施得當，那就是真的。您可以將一些元素設置為顯示為模式，而不是在網頁上打包不同的元素。
例如，您可以擁有一個僅包含文本的頁面以提高可讀性。然后，用戶可以單擊以查看圖像和視頻等視覺元素作為模態。
 
如何正確使用模態正確使用模態是確保它們不會對 UX 產生負面影響的關鍵。以下是一些可以使用模態的理想情況：
1. 顯示警告
使用模態來給用戶重要的警告是理想的，特別是如果他們的后續行動有嚴重的后果。
例如，當用戶單擊刪除按鈕時，大多數網站都會顯示模式。刪除總是至關重要的，因為在大多數情況下，它是不可逆的。
一個實際的例子是一個電子商務網站，用戶選擇從他們的購物車中刪除商品。您可以使用模式在刪除之前要求用戶確認。
2.輸入或收集信息
模態在提示用戶輸入信息方面是有效的。有時，用戶必須在繼續瀏覽之前輸入特定的詳細信息。
一個實際的例子是用戶想要提交評論的評論網站。在提交評論之前，您可以使用模態請求用戶名和其他必要信息。
3. 簡化導航
如前所述，模態可以簡化復雜的網站。此外，它將幫助用戶更好地導航，這是用戶體驗的提升。
一個實際的例子是一個有很多故事和更新的新聞網站。您可以使用模式突出顯示當天的熱門新聞故事，以便用戶可以一鍵訪問網頁。
 
模態是用戶體驗中的災難嗎？總之，模式會影響網站的用戶體驗，因為訪問者必須與它們交互。但是它并不總是必須是負面影響。
錯誤使用時，Modal 會成為網頁設計中的 UX 災難。但是，如果您遵循良好的做法，模式可以改善您網站的用戶體驗。
通常，僅在必要時使用模態，并且不會讓用戶感到沮喪。