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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

另一類(lèi)是非模態(tài)彈窗，通常用戶(hù)點(diǎn)擊或輕觸周?chē)憧申P(guān)閉。這類(lèi)彈窗對(duì)用戶(hù)體驗(yàn)的影響相對(duì)較少，因此也是最常使用的彈窗類(lèi)型。

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

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

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

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

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

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

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

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

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