
對我來說,做網站最大的挑戰是如何讓訪客在進入網站後以最短時間獲取最大量的資訊,說起來容易,做起來卻很困難,尤其在訊息流動快速的現代,可能網站晚個幾秒鐘打開,訪客就會提前跳出、關閉瀏覽器分頁,因此設法在一個畫面中安排好想提供給訪客的訊息就變得很重要。
每個網站不同,沒有一個共同的解決之道,通常需要經過長時間測試,才能調整至最理想的效果。如果你想要在網站中快速曝光某個訊息,那麼在網站放上類似訊息列功能可能可以獲得最好的吸睛效果。

IntroBar 是我前一段時間在國外網站上發現的免費工具,類似於之前介紹的 HelloBar 功能,透過 JavaScript 程式碼,可以快速在網站裡加入置頂訊息列,方便讓站長來發佈通知或獲取更多點擊,例如你可能希望透過它來宣傳某個網址、社群網站等等,還能讓我們自訂顯示的訊息列顏色,讓 IntroBar 與你網站有更緊密的結合。
這項功能完全免費,只要申請註冊帳戶就能使用。網站也提供了一些 IntroBar 應用於各大網站的使用範例讓我們參考,如果你想為網站上方加入訊息列,但又不想自己寫程式的話,IntroBar 是個可以考慮的選擇。
網站名稱:IntroBar
網站鏈結:https://introbar.com/
使用教學
STEP 1
開啟 IntroBar 網站後,直接從下方來測試 IntroBar 應用在不同網站的效果。點選首頁的「Register Now」橘色按鈕,依序填入姓名、Email、網站網址及密碼就能註冊取得一個免費帳戶。

STEP 2
註冊後登入 IntroBar 控制台,會有一段簡單的操作指引。我們可以直接從下方選擇現有的 IntroBar 工具列設計,或者點選「Custom」來客製化一個新的。

在 IntroBar 設定頁面裡輸入要顯示的訊息標題、內容,可以加入超鏈結,讓我們在顯示訊息時能引導使用者到某篇文章或網站,別忘了從下方選擇訊息列的背景和文字顏色設計,可以盡量選擇與自己網站相關的配色,看起來才不會太過突兀。

STEP 3
建立好自己的 IntroBar 後,點選「Preview」來預覽一下效果吧!這時候訊息列會顯示於控制台上方,讓我們看看是不是自己需要的,我利用 IntroBar 設計了一個網站歡迎訊息,看起來相當顯眼。

STEP 4
最後,點選網站左側「Installation Instructions」,就會出現 JavaScript 程式碼。將這段程式碼完整複製,貼到網站的 </body> 標籤以前,即可在網站加入訊息列。

值得一試的三個理由:
- 只要一段 JavaScript 程式碼即可在網站加入置頂訊息列
- 可自訂顯示標題、文字、顏色及加入鏈結
- 支援中文,且無使用流量限制