網(wǎng)站建設(shè)中如何利用彈窗設(shè)計(jì)提高網(wǎng)站的轉(zhuǎn)化發(fā)布者：本站     時間：2021-02-28 10:02:14

彈窗，對很多人都并不陌生，無論是網(wǎng)站設(shè)計(jì)還是APP設(shè)計(jì)，我們經(jīng)常都會看到它的身影。雖然彈窗設(shè)計(jì)一直被評為「史上最糟糕的設(shè)計(jì)體驗(yàn)」，但不可否認(rèn)它對網(wǎng)站傳遞品牌、產(chǎn)品/服務(wù)、活動等的貢獻(xiàn)。如何利用彈窗設(shè)計(jì)提高網(wǎng)站的轉(zhuǎn)化？這就需要看設(shè)計(jì)師如何布局彈窗設(shè)計(jì)，讓它不影響網(wǎng)站用戶體驗(yàn)的前提下，讓用戶更容易接受并操作。

為什么說彈窗設(shè)計(jì)是「史上最糟糕的用戶體驗(yàn)」？

彈窗設(shè)計(jì)是網(wǎng)站交互與用戶操作的核心樞紐，也是用戶處理「即使任務(wù)」的重要載體，但由于它的出現(xiàn)會中斷用戶當(dāng)前操作，容易引起用戶對此的不滿，因此彈窗設(shè)計(jì)也被戲稱為「史上最糟糕的用戶體驗(yàn)」。

雖然彈窗設(shè)計(jì)的類型有很多，但從交互形式上的區(qū)分大致可分為兩種：模態(tài)彈窗和非模態(tài)彈窗。

· 模態(tài)彈窗：常見種類主要對話框（Dialog），警示框（Alter），浮層（Popover/Popup）和操作欄（Actionbar）等。由于它具有需要即時處理的特性，因此層級往往會比較高，也比較容易吸引用戶的注意，同時也會降低用戶的操作體驗(yàn)。

· 非模態(tài)彈窗：常見的種類有Hud/Toast，提示欄和Snackbar等。非模態(tài)彈窗屬于一種輕量級的反饋機(jī)制，從出現(xiàn)到停留，再到消失的時間都非常短暫，甚至短到用戶幾乎不需要對它做出反映，因此從特征上，非模態(tài)彈窗與模特彈窗可以說是截然不同的。

彈窗設(shè)計(jì)的基本原則有哪些？

如果你不想你的彈窗影響用戶的操作，但同時又需要彈窗幫你與用戶實(shí)現(xiàn)有效通話，那么你的彈窗設(shè)計(jì)必須設(shè)計(jì)得恰到好處，讓它幫用戶快速地實(shí)現(xiàn)目標(biāo)。

彈窗設(shè)計(jì)基本原則一：減少干擾

由于突然出現(xiàn)的彈窗會強(qiáng)迫用戶停止目前的操作，轉(zhuǎn)而專注彈窗的內(nèi)容，因此如果正常情況下，盡量減少使用彈窗，以免引起用戶的反感。

彈窗設(shè)計(jì)基本原則二：使用用戶熟悉的語言

彈窗應(yīng)該盡量使用用戶熟悉的語言，而不是系統(tǒng)特有的專有名詞。注意內(nèi)容細(xì)節(jié)要清晰，如果彈窗是讓用戶刪除某些條目，應(yīng)全部列出來。另外，語氣上應(yīng)使用表述清晰的問題或陳述，盡量避免使用含有歉意、模棱兩可或反問式。

彈窗設(shè)計(jì)原則三：講究極簡

別嘗試將太多內(nèi)容擠在彈窗內(nèi)，彈窗的界面應(yīng)保持干凈和簡約，同時彈窗所提供的所有信息應(yīng)對用戶有價值并與之相關(guān)。

彈窗設(shè)計(jì)原則四：選擇合適的彈窗種類

彈窗大致分為兩大類，一類是吸引用戶關(guān)注，強(qiáng)制用戶與之交互后才能繼續(xù)的模態(tài)彈窗。這類彈窗一般只在特別重要的交互操作中才須使用，如刪除帳戶，同意協(xié)議等，其它情況下使用，需要考慮它對用戶體驗(yàn)的影響。

另一類是非模態(tài)彈窗，通常用戶點(diǎn)擊或輕觸周圍便可關(guān)閉。這類彈窗對用戶體驗(yàn)的影響相對較少，因此也是最常使用的彈窗類型。

彈窗設(shè)計(jì)原則五：視覺一致性

為了避免影響用戶的正常操作，彈窗出現(xiàn)時頁面背景通常會稍微變暗，一來可以讓用戶的注意力轉(zhuǎn)移到彈窗上，二來讓用戶知道后面的內(nèi)容是不可用的。但調(diào)節(jié)背景明暗度是需要注意，太暗會讓用戶沒法看清背景內(nèi)容，太淺則會讓用戶誤以為頁面仍可繼續(xù)操作，甚至無法將視線聚焦在彈窗上。

另外彈窗應(yīng)提供關(guān)閉按鈕，同時避免在彈窗內(nèi)啟動小彈窗，避免增加網(wǎng)站操作的復(fù)雜性。

雖然彈窗會影響網(wǎng)站的用戶體驗(yàn)，但它對防止用戶流失、促進(jìn)商品與內(nèi)容轉(zhuǎn)化等都起到積極作用。當(dāng)然，要真正留住用戶更多地依靠產(chǎn)品內(nèi)容本身的質(zhì)量與吸引力，那具體要怎樣做呢？

● 利益引誘：通過福利發(fā)放、商品優(yōu)惠等利益刺激手段，吸引用戶繼續(xù)完成對內(nèi)容/商品的消費(fèi)，從而降低用戶流失。

○ 操作警告：提醒用戶退出頁面可能帶來的影響和后果，讓用戶判斷當(dāng)前的退出是否正確，同時運(yùn)用一些「挑釁」得手段，盡可能降低用戶流失的風(fēng)險。

● 增加說服力：圍繞商品和內(nèi)容的性價比、口碑、受歡迎程度等進(jìn)行展示說明，以此證明商品的質(zhì)量與真實(shí)性，吸引用戶的了解。

○ 巧妙的頁面設(shè)計(jì)：主要通過視覺上的設(shè)計(jì)手段、掩眼法阻止用戶流失。

● 引導(dǎo)至其他頁面：當(dāng)用戶想退出時，不妨轉(zhuǎn)移方向?qū)⒂脩粢龑?dǎo)到她感興趣的地方，這同樣是阻止用戶流失的好方法。