不知道大家有沒有試過載入一個網頁或啟動一個程式時,因為載入時間長,令自己不想再瀏覽這個網頁或使用這個程式?設計員和站長若果無法縮短載入時間,這次介紹的免費資源—— Loading.io 就是一個替代的解決方法,最近Blowhk閒聊網也增添了一個載入動畫,令載入時間看起來沒那麼長,也順著找到這個網站,所以便寫下這篇文章,設計員和站長不妨試試使用一些載入動畫,使載入時段不會那麼無聊,以免用戶忍受不了而離開。
Loading.io提供數百個載入圖標(Spinner),有付費,也有免費,不同圖標會有不同授權*,用戶也可以上傳自己的圖標或者自行輸入文字來製作載入時所用的圖標。除了載入圖標,Loading.io也有提供圖標(icon),不過全部都要付費,另外還有進度條、圖案(pattern),很多很多資源可以免費使用,有興趣的朋友可以去看看。
網站連結:https://loading.io/
自製圖標:https://loading.io/animation/icon/
文字載入動畫:https://loading.io/animation/text/
載入動畫下載:https://loading.io/spinner/
進度條:https://loading.io/progress/
圖案(pattern):https://loading.io/pattern/
CSS Loader:https://loading.io/css/
*授權概覽:https://loading.io/tos/
自製圖標
用戶能夠上傳自己的圖標,然後使用預設的動畫方式,例如squeeze,cycle,hit等等,有數十種可以選擇,除此以外,用戶更可以自選背景顏色、動畫倒播、速度、圖標大小等等,全部也可以調較,有提供兩種下載格式,Gif和PNGs(由PNG組成的一系列圖片),Gif是免費下載的,但是PNGs就要付費升級為會員。
示範圖片:
自製文字載入動畫
同樣,自製的文字載入動畫也可以調較背景、速度,大小,當然可以自定文字,支援英文四種字型,更有支援到中文,不過就沒有中文字型可以選擇。
文字大小、顏色也可以自己調較,最後當然是下載Gif檔案了。
下載時會顯示授權為CC0:
示範圖片:
下載載入動畫
如果不想花時間和精神去設計,可以到載入動畫圖庫裡面找自己喜歡的下載,裡面大多都是收費,每一個售價為$1.99美元,有少量是免費CC0授權的。
WordPress載入動畫
如果大家想在WordPress使用這些載入動畫,可以搭上Preloader這個插件,然後在插件設定頁,把圖片連結修改為你想用的Gif載入動畫就可以了。