弹框【kuàng】设计经【jīng】常可见，比如我们在用滴滴打车的时【shí】候【hòu】，经常会看到弹窗【chuāng】提醒，比如说你【nǐ】迟到【dào】了，司机迟【chí】到【dào】了，支付完毕【bì】需要【yào】好评，这【zhè】些属于功能性弹窗，网站弹框有什么作用?下面就来看看吧。
网站弹框有什么作用
弹出框可以提升转化率
百闻不如一见，当【dāng】用户【hù】访问一个【gè】网站，这个网站有足够的【de】资【zī】源【yuán】，也提【tí】供性比【bǐ】价很高的产品，弹出框的【de】出现与转化率之间【jiān】呈正比关系。
有一个人做了实验，相同的网站，同时【shí】用【yòng】一百【bǎi】人做实验【yàn】，一个网站加入【rù】客服弹框，另一个【gè】网站则什么【me】也没【méi】加，结【jié】果【guǒ】是，带有弹【dàn】出框的【de】网站转化【huà】率比没有弹框的转【zhuǎn】化率高出了将【jiāng】近10%，十个点，对于网站来说，意义非同【tóng】凡响。
弹出框弹出的都是“重要”的信息
在电商网【wǎng】站【zhàn】，经常【cháng】会看到弹窗提【tí】醒的，包【bāo】括购买【mǎi】虚拟【nǐ】物品、进【jìn】行确定购买的时候，电商网站认为只需要适当的【de】提【tí】醒一【yī】下用户，所以弹窗就会强制而来，不管你是【shì】新【xīn】用户还是老用户，不管你【nǐ】在购【gòu】买过【guò】多少次类似的产品【pǐn】，关【guān】键时候，弹出框就【jiù】会不请自来。
因为这【zhè】是【shì】一些重要的【de】信息，需要对用户【hù】负责，所以有必要进【jìn】行提醒，就算用【yòng】户【hù】有时候不满意，但【dàn】是，善【shàn】意的忠告【gào】用户还是能够忍受的。
我们的【de】网站，是【shì】否有这样【yàng】的重【chóng】要信【xìn】息【xī】，需要不断的提醒【xǐng】用户【hù】呢?仔细想想【xiǎng】，肯【kěn】定是有的，不【bú】管是【shì】出于营销目的，还【hái】是对用户的善意忠告，使用弹出框，一定是要告诉用户这一【yī】点【diǎn】很重要，希望你看一下，虽然【rán】是打扰你了。
出于这个思维出【chū】发的弹出框，还是很能击中用户的注意力的，很多时候，网站【zhàn】优【yōu】化【huà】的大【dà】量内容都【dōu】是重复而【ér】繁琐【suǒ】，这是为了优【yōu】化而优化【huà】，目的是能【néng】够给【gěi】自己【jǐ】更多的展现机会。
而【ér】网站【zhàn】提供给【gěi】用户的，双方能够产生利益链【liàn】的只有很少【shǎo】的【de】一部分，甚至【zhì】几【jǐ】句【jù】话就可以解决，那么用【yòng】简短的词语，做出的弹出框，真的可以短时间【jiān】解决问【wèn】题【tí】。
弹出框的设计原则
一些网站【zhàn】弹出【chū】框之所以让人反感，是因【yīn】为严【yán】重干扰了用【yòng】户【hù】的正常体【tǐ】验，本身弹出框就是强【qiáng】加进去了【le】，在设计的时候，尽量避免惹用户不满，而是在【zài】最恰当的时机【jī】出现。
比如说【shuō】，网站【zhàn】首页【yè】没有，当【dāng】用户浏览网站【zhàn】，进入具体感兴趣【qù】的页面的时候，弹出框如【rú】期而至，因为用户急需了解，这【zhè】个【gè】弹出【chū】框可以冲淡用户的不满情绪。
网站建设在进行弹出框设计过程中，要考虑网站用户群和【hé】使【shǐ】用场景【jǐng】。以网站目【mù】标用【yòng】户群【qún】为例，如【rú】果【guǒ】网【wǎng】站的用户年龄偏大，弹出框【kuàng】采用浅色背景【jǐng】好一些，对【duì】于年轻【qīng】用户则采【cǎi】用深色【sè】的【de】背景，这样显得更加自然和时尚。
弹出框设计的最佳实践
不要为了跟随某【mǒu】个趋【qū】势，展现【xiàn】某种设【shè】计元素而使用【yòng】弹出框，它一定【dìng】要是功能性的【de】，不要浪【làng】费用户的【de】时间【jiān】，这样会降低用户对你的信任。
弹出框的设计应该和网【wǎng】站本身保持【chí】一致，无论【lùn】是风格还是【shì】素质上【shàng】。
确保弹出框是可交互，有响应的。
确保弹出框中的文案是简短而重点突出的。
不要【yào】使用被动的或者【zhě】过于生【shēng】硬的「是/否」式的行为召唤【huàn】文案，除非你的品【pǐn】牌个性本就如此【cǐ】。如果弹【dàn】出框中【zhōng】包含两【liǎng】个 CTA，请尽量【liàng】采用【yòng】积极【jí】的【de】方式来展现。
如果你在搜集用【yòng】户的联系信息【xī】，最【zuì】好只让他们提【tí】供电【diàn】子邮件地址。
确保弹出框的内容和对应的页面保持一致。
如果【guǒ】可以【yǐ】，尽量避免在首页上就使用弹出框。尽量让用户先适【shì】应所处的页【yè】面环境。这是 Google 所【suǒ】允许的【de】弹出【chū】框设【shè】计之一。
遵【zūn】循【xún】 Google 对于【yú】移【yí】动端网页【yè】的设计规则：不要【yào】有插页式的广告，不要设置首页【yè】弹出框。
不要让【ràng】移动端弹出框和桌面端的完【wán】全一样，有针对【duì】性【xìng】地【dì】进行设计。
总是使用简单统一的方式来关闭弹【dàn】出框，即在右上【shàng】角【jiǎo】设置一【yī】个【gè】X关【guān】闭按钮。
让所有的弹出框都在恰当的时候才弹出，比如关闭页面的时候。
设置频率规【guī】则【zé】，确保访客不会在每个页面或者【zhě】每次【cì】访问的时【shí】候都【dōu】会碰到弹【dàn】出框。
将弹【dàn】出框【kuàng】设置在正确的【de】位置，根据网站的状况和【hé】体验【yàn】的度量来进行判断。
如果你想让弹出框醒目，尽量让它出现在屏幕的正中心。
如果你想推送优惠信息，可以使用顶部悬浮式的弹出框。
如果你【nǐ】想【xiǎng】在用户浏览的时候【hòu】推【tuī】送信息【xī】，弹出框尽【jìn】量出现在屏幕的一侧。
根据用户类型细分来自定义弹出框信息。
计好模态弹框的参考原则
一：选择恰当的弹框类型和使用场景
随着移动端的【de】发展，弹框的【de】种【zhǒng】类和使用场景越【yuè】来越【yuè】丰富，任何一个弹【dàn】框都不【bú】应【yīng】该是随机出【chū】现【xiàn】的，那么我们【men】该如何判断什【shí】么情况下使用哪种弹框呢?
根据功能选择合适的弹框类型
弹框按照【zhào】功能可以分为【wéi】：系统提示【shì】、操【cāo】作反馈、用户【hù】引导【dǎo】、信【xìn】息输入、广告通知这【zhè】五【wǔ】大类。不【bú】同的弹框类型适合不【bú】同的设计方法，对用户【hù】的作用也相差甚远。设计师在工【gōng】作中需要根据目的【de】和场【chǎng】景【jǐng】选择合适的类型。下【xià】图展示的是5个【gè】不同【tóng】类型的弹框：
考虑使用场景正确引导
相【xiàng】同的弹框如果在不同场景【jǐng】下出现所达【dá】到【dào】的效【xiào】果截【jié】然不同，而在同【tóng】一条件下，结合场景上下文优【yōu】化内容【róng】，用户也会容易【yì】受引导内容的影响而进一步操作【zuò】。
二：避免过度干扰
必要、积极、有【yǒu】效【xiào】的弹框能够帮【bāng】助用户了解当前的状态、下一【yī】步【bù】的行为【wéi】、以及操作的后【hòu】果，但【dàn】过度出现或者错误【wù】的形式则【zé】会严重【chóng】干扰用户的操作，给用户带【dài】来困【kùn】扰。
合适的弹出方式
对于模态弹框【kuàng】来说，弹【dàn】出的方式有两种：自动弹出、用户主动操作【zuò】后弹出。很多【duō】系统【tǒng】类提示及广告【gào】通知会在【zài】用户打开APP或【huò】打【dǎ】开某【mǒu】个频道时【shí】自动弹【dàn】出，比如【rú】，打开【kāi】APP时弹出发现新版本的弹框，用户【hù】对这类弹框【kuàng】已经熟悉了，因此，适量的弹框不会引【yǐn】起用户反【fǎn】感。
还有【yǒu】一种弹框【kuàng】会在用户操作过程【chéng】中【zhōng】随时弹出，这【zhè】种弹框会对用户的【de】行为造成强干扰，只适用于【yú】系统级的提示【shì】或有非常【cháng】严【yán】重结果【guǒ】的行为。iPhone中在操作时会收到系统级的附【fù】近WiFi提示【shì】，普【pǔ】通产品不要【yào】轻易尝试这【zhè】种【zhǒng】弹出方式。
另外则是基于用户的【de】某些操【cāo】作【zuò】给予反馈【kuì】，这【zhè】种情况下是必要【yào】的弹框【kuàng】，需要【yào】基于当时用户【hù】的操作【zuò】设计好弹【dàn】框【kuàng】的内【nèi】容，帮助用户进一步操作。比如用户在填写后的【de】表单中点击【jī】退出，弹框提示用户【hù】退出行为会造成的结果，让【ràng】用户有【yǒu】控制感。
版权所有：深圳市网商在线科技有限公司
友情链接:
