關鍵應用
用EMail訂閱文章 用RSS訂閱文章 搜尋文章
˄

CSS Gradient Animator 利用 CSS 做出色彩漸層動畫

在網頁中使用動畫,通常都能吸引到用戶的目光,所以時常可以看到有些網站利用一些 gif 的動畫小圖示,放在希望能引起用戶注意的區塊中,CSS Gradient Animator 是一個以 CSS 語法來產生色彩漸層動畫為主的網站,使用的方式相當簡單,只要利用其設計好的介面點選所要的漸層顏色、漸層角度、滾動角度及動畫的速度等參數,設定好的漸層色彩效果,可以利用 Preview 功能,立即顯示在該瀏覽器的背景,且能自動幫產生相關的 CSS 語法,讓你方便應用到網頁中。
ContentPhoto3105

繼續閱讀»»»

littlesnippets.net 免費取得 CSS、JavaScript 動畫效果程式碼

寫網頁時難免會有需要一些動畫效果,例如當滑鼠指標在按鈕、圖片、功能表上或離開時,或是希望做出具有專業水準個人檔案、新聞、產品卡時,如果是初學者想要從無到有,可能需要花費較長時間,要是可以參考別人已做出的效果,取得其程式碼再來修改成自己想要的效果,這樣才能事半功倍。littlesnippets 這個網站提供按鈕、圖片、Logo、News Card、Menu、Profile Card ....等各式各樣的 CSS + JQuery 效果,且每個都有效果展示,更提供 HTML、CSS、JQuery 完整的範例程式碼,用戶只需取得這些程式碼,稍加修改,就可以在自己網頁呈現,相當方便。
 
ContentPhoto3091

繼續閱讀»»»

Blend-CSS 漸層色彩 CSS 語法產生器

網頁有需要使用色彩漸層來布置時,有些人會使用圖片來避開因不同瀏覽器對 CSS 支援各有不同的問題,但也有網站採主要瀏覽器才支援的 CSS 語法來支應,Blend-CSS 是一個可以線上產生漸層色彩的 CSS 語法產生器,操作方法非常直覺,透過設計好的左、右可選不同色彩的介面,直接就可混合成漸層色彩,且可直接預覽,滿意後,就可複製其產出的 CSS 語法,放到網頁要應用的地方,相當方便。
ContentPhoto3076

繼續閱讀»»»

只需加入 instant.page 網站所提供的一小段程式碼,就能讓網頁載入更快更即時

不論是用戶還是站長,對網頁的載入速度應該只會要求更快更即時,但如果原因是出現在網路環境的延遲,有甚麼方法可以克服呢?instant.page 這個網站提供了一段免費且 Open Source (MIT license) 的 JavaScript 程式碼,讓網站擁有者,在網頁的原始碼 </body>之前加入即可的簡單方法,就能在用戶點擊之前預先加載頁面內的鏈結,使其達到後續網頁載入更快更即時的目的,至於它可以更快更即時的載入網頁原理,根據網站提供的說明是利用滑鼠停留在要點擊的鏈結 URL 上,到用戶真正按下去,這個中間的時間差來預先加載頁面,而這個時間平均超過 300毫秒( 0.3秒),各位可以利用該網站所做的測試按鈕,進行測試,而至於網路速度對銷售型的網站影響又是如何呢?該網站也有提到說亞馬遜公司和其他人有發現 100毫秒的延遲會佔銷售額的 1%,可見得影響還是有的,想要讓用戶有更好的瀏覽體驗嗎?可以試試。
 
ContentPhoto3066

繼續閱讀»»»

Tables Generator 視覺化操作的表格產生器

HTML 這種標記式語言雖不複雜也不難學,但對一個初學者而言,要學的東西還真是不少,其中網頁常見的 Table tag 其製作說容易也容易,但如果太複雜,還是需要一些時間的調整,Tables Generator 這個線上的表格產生器,可產生 LaTeX Tables、HTML Tables、Text Tables、Markdown Tables、MediaWiki Tables 等各類型的表格,全部視覺化的操作,馬上可預覽效果,雖不一定能全部套用,但產生後再去修改所提供的 HTML 與 CSS 框架樣式語法,也絕對比你從頭自己來的快,另外,如果有 CSV 檔案,也可直接匯入成表格。
ContentPhoto3003

繼續閱讀»»»

如何利用 Google Chrome 內建的 Audits 功能來測試網站網路、效能、SEO?

有自己架設網站的朋友們,應該都很關注網站的整體效能,包含網路速度、執行效能、SEO、如何改進等等,想要取得這樣的一份報告不難,現在就讓內建在 Google Chrome 瀏覽器內的「開發人員工具」來幫你進行測試,完成測試後,將會產出報告與分數及改進作法,工擬進行網站的調整,該工具也有 Chrome 的擴充功能可以使用,名稱為 「Lighthouse」,可自行下載應用。
ContentPhoto2958

繼續閱讀»»»

搜尋文章