等待圖示

常在網頁看到當網頁在讀取資料時，會先出現一個等待的圖示來告訴使用者網頁資料目前在讀取中，最常看到的像是 FaceBook 或 Plurk 網站在讀取資料時的等待圖示。ajaxload.info 就是專門提供該類圖示的免費網站，可線上自訂該圖示的顏色及背景色，並提供 GIF 格式檔案下載。

網頁在呈現之前是需要運算及傳輸時間的，如果可以在這個等待時間加入一個進度條，讓瀏覽者知道還要等多久，會是較理想的網頁設計，但進度條的準確度會受到很多條件的限制，因此，大部分的網頁都是提供一個等待圖示動畫，藉此提示瀏覽者，不需要有多餘的動作靜待網頁呈現。以往要加入此類的等待圖示動畫，我們會使用 Gif 圖檔，而現在我們可以更方便的使用 JavaScript 或是純 CSS 就能加入，Loaders 這個網站提供獨特且具有質感的 24個免費 loader ICON，每個均提供 REACT、HTML 及 CSS 原始碼，讓網頁設計使用 loader ICON可以更方便且有更多選擇。

網頁處理、運算、傳輸都需要時間，如果讓使用者乾等待，就容易產生當機的錯覺，因此，在這段時間產生一個提示訊息藉此告訴使用者耐心等待是有必要的，而現行網頁最常見的就是使用等待動畫圖示，負責處理到呈現這段時間的呈現，這個動畫可以使用 GIF 圖檔，也可以使用純 CSS 語法打造，24 PURE CSS3 PRELOADERS 這個網站展示了 24個純 CSS 等待動畫圖示，只需在網頁中引用該 CSS 檔案，就可輕易實現等待中使用動畫圖示來提示。

讀取網頁的速度常受網路頻寬與讀取資料的大小...等因素所限制，因此在設計網頁時，若資料量較大時，通常會加入一個資料讀取的進度條，來告訴使用者，目前在讀取資料的進度，不過要寫在網頁上寫資料讀取的進度條通常不是那麼容易，所以就使用一個等待圖示來代替。loadinfo 就是一個提供該類圖示的網站，可自訂前景及背景顏色及提供 16x16、24x24、48x48 等尺寸。

在瀏覽網頁的時候，常會看到 loading 動態圖示，尤其是在需要較長時間才能回應的操作上，像是線上影片的觀賞、資料量較大的網頁......等等。想要取得這樣的動態圖示，可以自己製作或是透過 cssload.net 這個免費的網站服務，除了可以利用其提供的 loading 圖示，還可以利用其所提供的工具來編輯該圖示，以取得由 CSS3 語法組成的動畫，來取代 Gif 的動態圖示的缺點，期達到最符合自己網站的要求。

瀏覽網頁之所以會覺得網站可能沒有回應，原因有可能出在網頁需要運算時間較久、網路傳輸速率較慢或的數據過多...等等，總之，在這之前如果適時地放上一個等待圖示或是加載中，請稍後...的字樣，都比讓用戶空等帶來的好，如果是要放等待動畫圖示，GIF 是個選擇，而另一選擇則是使用 CSS，Uiball.com 這個網站提供 24個以 CSS 打造的等動畫圖示，喜患的就可以直接複製其 html 與 css語法，直接放到想要顯示的位置即可。

若想美工自己的網頁，圖示肯定少不了，網路上有提供可下載圖示類的網頁素材網站也不少，像是 VistaIcons.com 提供豐富且風格一致的成套 ICO 圖示，且均附 PNG 檔案、Preloaders.net 線上產生動態圖示，可調整顏色、背景色、尺寸及動畫速度等 及 ajaxload.info 網頁資料讀取時的等待圖示 都是不錯的美供應用圖示。WebSiteIcons 所提供的圖示雖不多，卻是相當精美，且附上 PNG 圖檔，方便後續的編輯。

Preloaders.net 是一個提供了相當多且精緻的等待或下載(Loading) 的動態圖示免費樣板，只要選擇喜歡的圖示樣板，簡單的進行一些圖示的參數設定，像是圖示的顏色、背景色、尺寸大小及動畫速度...等等，就可以線上產生所選樣板圖標並下載。