Godzilla. 2018-07-17 網(wǎng)站建設(shè)

上海建網(wǎng)站的公司：彈窗的正確使用法

建網(wǎng)站中的彈框是一種交互方式，用作提醒，做決定或者解決某個(gè)任務(wù)。彈框一般包含一個(gè)蒙版，一個(gè)主體及一個(gè)關(guān)閉入口，常見于網(wǎng)頁及移動(dòng)端。其好處是讓用戶更聚焦，且不用離開當(dāng)前頁面，更快更容易完成任務(wù)。由于彈框與當(dāng)下流行的卡片式設(shè)計(jì)在表現(xiàn)形式上十分接近，同時(shí)彈框也逐漸承載了更多功能性需求，不再是簡單的內(nèi)容堆砌，因此彈框設(shè)計(jì)也被越來越多上海建網(wǎng)站的公司的設(shè)計(jì)師關(guān)注。

　　什么是彈框？

　　上海建網(wǎng)站的公司簡單來說，彈框是網(wǎng)頁/app與用戶進(jìn)行交互的一個(gè)浮層。它主要有兩個(gè)功能：信息傳遞和用戶反饋。根據(jù)交互模式的不同，彈框主要可以分為兩種：模態(tài)彈框和非模態(tài)彈框。

　　模態(tài)彈框是指當(dāng)該彈框出現(xiàn)在用戶操作視野內(nèi)時(shí)，用戶必須對(duì)其作出回應(yīng)，否則無法繼續(xù)其他操作行為。這類彈框的優(yōu)缺點(diǎn)很明顯：它可以快速獲取用戶的視覺焦點(diǎn)，但它會(huì)打斷用戶的正常操作。模態(tài)彈框是重量性反饋機(jī)制的一種，經(jīng)常被放在頁面的正中間，所以上海網(wǎng)站建設(shè)公司建議將模態(tài)彈框用在重要操作提示上（用戶比較容易接受）。常見的模態(tài)彈框有對(duì)話框、警示框、動(dòng)作欄等。

　　上海建網(wǎng)站的公司認(rèn)為與模態(tài)彈框相比，非模態(tài)彈框的特點(diǎn)在于它不強(qiáng)制用戶與其進(jìn)行交互，這類彈框在頁面停留一段時(shí)間后會(huì)自動(dòng)消失或一直停留在頁面的側(cè)邊。非模態(tài)彈框?qū)儆谑禽p量級(jí)的反饋機(jī)制，不會(huì)對(duì)用戶造成干擾。當(dāng)然，由于它并不顯眼，在吸引用戶注意上沒有那么有效。一些不那么重要的消息提醒與通知等建議使用非模態(tài)彈框。常見的非模態(tài)彈窗有提示欄、snackbar等。

　　為什么要在網(wǎng)站中使用彈框？

　　1. 抓人眼球，傳遞重要信息

　　上海建網(wǎng)站的公司了解到越來越多的用戶難以集中注意力閱讀網(wǎng)頁，而彈框這種特殊的方式可以快速吸引用戶的注意，幫助傳遞網(wǎng)站的核心信息；

　　2. 保持網(wǎng)站簡潔

　　極簡主義時(shí)的網(wǎng)站設(shè)計(jì)最是賞心悅目。如果你在保證網(wǎng)站界面的簡潔的同時(shí)多給用戶提供一些相關(guān)信息，彈框設(shè)計(jì)就是一個(gè)不錯(cuò)的選擇；

　　3. 提高網(wǎng)站轉(zhuǎn)化率

　　對(duì)彈窗設(shè)計(jì)能否幫助提高網(wǎng)站轉(zhuǎn)化率進(jìn)行了相關(guān)調(diào)查研究。研究結(jié)果發(fā)現(xiàn)，使用彈框設(shè)計(jì)平均可以帶來3%的轉(zhuǎn)化率，而如果彈框設(shè)計(jì)得非常優(yōu)秀，網(wǎng)站的轉(zhuǎn)化率甚至可以達(dá)到9%。

　　上海建網(wǎng)站的公司分享彈窗設(shè)計(jì)應(yīng)遵循的18條準(zhǔn)則：

　　1.不要為了使用彈框而使用彈框，如果你用一個(gè)毫無意義的彈框打斷了用戶的正常瀏覽，他們可能會(huì)直接退出離開；

　　2. 彈框的設(shè)計(jì)應(yīng)與當(dāng)前頁面上的其他元素保持一致（比如風(fēng)格、配色等）；

　　3. 確保彈框是可交互、有響應(yīng)的；

　　4. 彈框的文本應(yīng)簡明扼要；

　　5. 不要在彈框的CTA按鈕中使用"是/否"式的生硬文案，除非你的品牌特質(zhì)本就如此。還有，如果彈框包含兩個(gè)CTA按鈕，最好以正面積極的方式呈現(xiàn)出來，且應(yīng)有所偏向（你希望用戶點(diǎn)擊哪一個(gè)按鈕）；

　　6. 如果你想通過彈框收集用戶聯(lián)絡(luò)信息，最好只讓用戶填寫"郵件地址"；

　　7. 確保彈框的內(nèi)容與當(dāng)前頁面內(nèi)容是相關(guān)的；

　　8. 盡量避免在首頁上就使用彈框，給用戶一些緩沖適應(yīng)的時(shí)間。當(dāng)然，這也有例外，諸如隱私政策這樣的彈框出現(xiàn)在首頁是被允許的；

　　9. 如果你準(zhǔn)備在移動(dòng)端設(shè)計(jì)彈框，記?。翰灰叽绯蟮哪B(tài)彈框，不要在首頁設(shè)置彈框；

　　10. PC端和移動(dòng)端的彈框并一定要完全一樣，你可以進(jìn)行針對(duì)性地調(diào)整；

　　11. 讓彈框退出更加簡單，比如用戶點(diǎn)擊彈框外區(qū)域即可退出，或是在彈框的右上方放置一個(gè)醒目的"×"按鈕；