<label id="2a06w"><tt id="2a06w"></tt></label><label id="2a06w"><tt id="2a06w"><em id="2a06w"></em></tt></label><menu id="2a06w"></menu>
  • <dfn id="2a06w"><var id="2a06w"><label id="2a06w"></label></var></dfn>
    <sup id="2a06w"><button id="2a06w"><em id="2a06w"></em></button></sup>
    <dfn id="2a06w"><var id="2a06w"></var></dfn>
    <dfn id="2a06w"></dfn>
  • <dfn id="2a06w"><code id="2a06w"><ins id="2a06w"></ins></code></dfn>
  • <small id="2a06w"><samp id="2a06w"></samp></small>
  • <dfn id="2a06w"><table id="2a06w"><center id="2a06w"></center></table></dfn>
    <label id="2a06w"><tt id="2a06w"><em id="2a06w"></em></tt></label>
    <strike id="2a06w"><form id="2a06w"></form></strike>
    <menu id="2a06w"><tt id="2a06w"></tt></menu>

    將想法與焦點(diǎn)和您一起共享

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

    彈窗,對(duì)很多人都并不陌生,無論是網(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)站用戶體驗(yàn)的前提下,讓用戶更容易接受并操作。

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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



    選擇我們,優(yōu)質(zhì)服務(wù),不容錯(cuò)過
    1. 優(yōu)秀的網(wǎng)絡(luò)資源,強(qiáng)大的網(wǎng)站優(yōu)化技術(shù),穩(wěn)定的網(wǎng)站和速度保證
    2. 15年上海網(wǎng)站建設(shè)經(jīng)驗(yàn),優(yōu)秀的技術(shù)和設(shè)計(jì)水平,更放心
    3. 全程省心服務(wù),不必?fù)?dān)心自己不懂網(wǎng)絡(luò),更省心。
    ------------------------------------------------------------
    24小時(shí)聯(lián)系電話:021-58370032
    關(guān)鍵詞標(biāo)簽:上海網(wǎng)站建設(shè) 上海網(wǎng)站制作 網(wǎng)站優(yōu)化 小程序開發(fā)
    99人妻中文字幕视频在,亚洲无码视频在线免费看,久久国产乱子伦免费精品,日本中文字幕色视频网站
    <label id="2a06w"><tt id="2a06w"></tt></label><label id="2a06w"><tt id="2a06w"><em id="2a06w"></em></tt></label><menu id="2a06w"></menu>
  • <dfn id="2a06w"><var id="2a06w"><label id="2a06w"></label></var></dfn>
    <sup id="2a06w"><button id="2a06w"><em id="2a06w"></em></button></sup>
    <dfn id="2a06w"><var id="2a06w"></var></dfn>
    <dfn id="2a06w"></dfn>
  • <dfn id="2a06w"><code id="2a06w"><ins id="2a06w"></ins></code></dfn>
  • <small id="2a06w"><samp id="2a06w"></samp></small>
  • <dfn id="2a06w"><table id="2a06w"><center id="2a06w"></center></table></dfn>
    <label id="2a06w"><tt id="2a06w"><em id="2a06w"></em></tt></label>
    <strike id="2a06w"><form id="2a06w"></form></strike>
    <menu id="2a06w"><tt id="2a06w"></tt></menu>