某個輕鬆的午後，我開啟購物 app 準備採購。結帳當下，跳出一個不明所以的空白視窗。身為一個曾經因重整網站而造成重複刷卡的受害者，「敵不動我不動」是我下意識的反應。終於，在數秒後，跳出「付款成功」字樣，我開心的點了「OK」後，又再度跳出一個「付款成功」視窗，一度讓我以為又被刷了兩次........
身為網站從業人員，深諳彈出視窗的優勢與劣勢，但提示也Pop-up、通知也Pop-up、警告也Pop-up，有時我不禁思考，彈出視窗是否被濫用了呢？
這篇文章總結了我們過去的一些經驗，向大家介紹彈出視窗的種類，以及應該在什麼情境下正確的使用他們，才不會像菜市場的大聲公一樣，把使用者炸得措手不及。
認識 Pop-up
Pop-up 指的是畫面中的「彈出視窗」，大多數時候，Pop-up 的出現不會特別取得使用者的允許，而是「啪」的一聲就跳出來了，可想而知是挺驚擾人的一種存在。
雖然多數的設計師入行時都充滿著著理想，想要創造一個友善、乾淨、好用且舒適的網站UI空間給使用者，但當面對現實的冷酷與金主的霸凌，彈出視窗還是冒出來了，因為對於吸引目光、促銷與廣告這個用途來說，它粗暴、但是有效！
⎮補充：Popup V.S. Pop-ups
Pop up - 動詞，單純指「彈出」的動作。
Pop-up - 名詞與形容詞，文字表現上須包含連字符，URL中寫做Popup，因常被寫作Popup。
常見的 Pop-up 的種類與應用
一、Entry Pop-up
第一種，Entry Pop-up ，顧名思義，在進入網站後就立刻彈出，並蓋住網站的內容，可以用來提供促銷折扣，或者公告重要訊息，是許多網站常用的行銷手法。
這類型的 Pop-up 也被使用在惡名昭彰的「蓋版式廣告」上。斗大的廣告海報與聳動的標題，有時還伴隨自動播放的影音，與那個永遠按不到的關閉按鈕，讓你想躲都躲不掉。
二、Form Pop-up
對網站的成長而言，除了瀏覽次數外，「真人的互動、訂閱或註冊」也是一項重要的指標。
為了收集到更多訂閱戶，使用精美的照片或簡單的CTA作為彈出視窗內容，都有不錯的效果。輸入Email獲得優惠或訂閱最新資訊就是其中最常見的招數，取得聯繫方式之後，即使使用者此後不再手動搜尋網站內容，經營者也可以主動將最新消息推送到使用者手裡。
⎮補充：CTA，Call to action，行動呼籲。通常是短言、文字、或圖片，呼籲使用者對當前畫面做出行動，例如：立刻下載、馬上報名。
三、Interaction Pop-up
此類視窗的主要功能是在你拿不定主意時，即時的出現給你一把推力。
傳統上，網站只能被動地等待消費者做決定，但這幾年流行的聊天式客服視窗反轉了這樣的角色設定。藉由積極的詢問，主動與顧客建立連結。更由於AI智慧客服的流行，消費者可以用簡單的問句換來AI的建議或引導，避免冗長的 email 回應與等待。就像您賣場中的天才銷售員一樣，在現場來回穿梭的引導客戶到它有興趣的產品前面。
四、Timed Pop-up
通常會在網站被閒置數分鐘後出現，提醒你「文章還在這裡喔！（順便放一些廣告）」。
「Timed pop-up」以瀏覽時間為觸發機制，瀏覽購物網站與瀏覽3000字文章所需的時間因人而異，快速閱讀完成並不表示造訪者對這篇文章感興趣，閱讀衣服的資訊半個小時也不代表一定會買，因此使用Timed pop-up需要經營者根據自內容協調最適合的時機點。
其他類型 Pop-up 與列表整理
「Scroll Pop-up」
已經看完文章才出現的「感謝您對本網站的喜愛，歡迎訂閱支持」的類型即是「Scroll Pop-up」，以使用者瀏覽網站的長度、廣度為觸發機制，希望能把對網站內容有興趣的使用者留下來。
「Click-Active Pop-up」
隨手將黑色豆腐頭加入購物車後，網頁跳出「猜你喜歡：有快充但貴500元的黑色豆腐頭」，這樣的彈出視窗屬於「Click-Active Pop-up」，被動觸發類型，需要使用者親自點下某一個按鍵才會彈出。
「Exit-intent Pop-up」
在使用者游標接近「X或上一頁」時，「今天半價，確定不下單嗎？」的視窗就會出現，此種類型屬於「Exit-intent Pop-up」，像一位想要力往狂瀾的前任，總感覺被情緒勒索。
結論
諸如此類彈跳式視窗的類型及應用方式還有很多，每一個網頁、每一間公司、每一種消費模式適合的組合也不一樣。
若你想知道自己的單位、行號、網站適合什麼組合，或是已對網頁的設計抱有想像，歡迎與我們聯絡，夏木樂 品牌網頁設計專家，我們的官網，沒有Pop-up！
