Easing函數

你是個前端設計師嗎？承認吧你就是要與一些語法的東西為伍。

俄羅斯一個高手把Easing函數全部都做成了開源範例，並且提供js、css、scss的語法讓你可以直接取用，真好這下子專業性直接提高一個擋次。

網址：http://easings.net/zh-tw
作者：https://github.com/ai

使用方式：

1. 直接選擇一個曲線進入內容，可以看到動態線條與動態，如果想再看一次，直接點選該曲線圖即可。
2. 然後下面就是可用的函式了，部份相關支援性也會有相對應的說明。

Read more

cubic-bezier，CSS動態編輯器

你經常需要使用CSS編程嗎？
http://cubic-bezier.com 這個工具網站可以協助你編譯最適合的動態預覽，直接輸出成CSS語法。

立刻看看這是什麼請直接按GO。

使用方式：

1. 直接在網頁上編輯，首先拉動曲線，其次調整一個做動時間，例如設定動態時間為0.5表示0.5秒，然後按下GO就可以預覽。
2. 按IMPORT輸入你自己的語法，再依樣進行編輯調整。

然後按EXPORT就可以得到語法了。

Read more

Zbugs，幫網站減肥的工具網站

Zbugs是一個替你的網站減肥的工具網站，使用的方式是針對css和javascript這種文字檔案做優化，說起來好像沒幫到什麼忙，但是若你的網站跟我一樣寫了總數5000行的css，而網站又是用在英語系國家的，你就會發現Zbugs這種網站多麼的有幫助了。把網站完成後，不妨試試看Zbugs可以幫你減肥多少吧。

放心！Zbugs只不過是去除無用的空格和跳行而已。

網站：Zbugs

使用方式：

1. 直接在首頁輸入您的網站網址，按下Speed up就會開始處理了。
2. 處理完後可以看到所有數據，按Download可以把處裡好的css和js檔案下載回來。
3. 下載時需要登入。

Read more

網站完成了嗎？讓DOM monster告訴你。

網站完成了嗎？讓DOM monster告訴你。
在瀏覽器上裝上這個"書籤工具"，隨時檢測目前網頁的完成度。

有時候我們以為網站已經完成了，雖然看起來都很正常，但可能藏有很多問題在，透過使用DOM monster可以隨時檢測一個網頁的潛在問題，檢測範圍包含Js,java,css,html和許多我們甚至不曾注意到的問題，讓DOM monster為你的工作立下一個全新的標準吧！(汗…)

這是DOM monster 檢測的結果，就連某個元件的語法字數太多都會有專業建議！

網址：http://mir.aculo.us/dom-monster/

使用方式：

1. 首先到http://mir.aculo.us/dom-monster/，在畫面中間看到DOM Monster!的咖啡色底字樣，用滑鼠拖動他到你的書籤列，放開後就完成了(僅僅只是把一個js連結變成你的書籤而已)。
2. 接著在瀏覽任意網頁時，按下這個書籤就會看到DOM monster給你的檢測報告囉，簡單吧。

評：這東西給老闆看到比較麻煩。

Read more