這是一門寧願不要學到的技巧，因為廣告banner很容易修修改改，尤其是flash banner，每次改幾乎都會動到影格，三不五時就會覺得要重做之類的感覺，一整個就是無底洞深淵，但是現在活動網站這麼多，廣告平台也很多，所以這樣的經驗與技巧還是需要傳承的，我只能說希望大家以後可以漸漸不需要用到這篇了。
JPG靜態圖片Banner
banner壓K密技 通常圖片型banner大概都會抓到40K～50K左右，jpg壓K還蠻容易，通常做完可以用photoshop輸出，預設集的地方可以選擇輸出JPEG高中低，或者可以調整品質的百分比，比例越低畫質越模糊，然後再用jpegmini，可以將jpg最佳化到最小size，我個人會用imageoptim。imageoptim不只可以壓jpg還可以壓gif與png，所以可以一次性將所有的圖片檔案都最小化，還蠻不錯的，最重要的是imageoptim是免費的，不過mac only喔。
Facebook本身有文字不得超過20%的限制，所以設計完草稿記得到網格工具檢查是否有符合20%的規範。
GIF動態圖片Banner
GIF Banner的K數限制也是在40K~50K左右，通常大概可以做3~4個場景的動態，如果場景不多，可以盡量用256色來製作，但是如果要壓K，通常就只能從256色開始減少，比方說換成128色或64色，再來混色的百分比也可以往下調整，要注意banner輸出的結果會不會看起來很馬賽克，畢竟顏色少混色又低，結果就是會像馬賽克磁磚的感覺，不過個人覺得比jpg模糊好看一點，最後一樣可以用imageoptim在最佳化一次，大概可以少個0.5%以上，不會影響到動態的GIF，可以安心使用。
Flash動態swf Banner
製作Flash Banner有三個重點：壓K、埋code、墊檔圖。說到Flash Banner，應該是很多設計師最煩惱、最討厭、最不想做的一個種類，三不五時就會遇到可能要重做的下場。目前Flash cc 2015僅支援action script 3，但大部分廣告平台都只支援action script 2，也就是說如果你要做Flash Banner，最好的Flash軟體一定不是最新版，再來Flash僅能支援降低一個版本，所以目前最好製作Flash banner的版本，我個人會覺得是Flash CS6，同時支援action script2 與action script 3，而且版本也夠低，不同版本的Flash做出來的檔案大小其實不太一樣，印象中我有聽過好像用CS4做出來的檔案最小，不過因為我沒有這麼老的版本所以沒辦法比較。
再來元件的部分，當然會先用Photoshop處理每ㄧ卡的畫面，畢竟要先跟客戶過稿，Photoshop在修圖上也比較優勢，所以會先在Photoshop處理完後，再逐成輸出PNG或JPG，包含文字也要輸出成圖片，然後我會使用imageoptim對圖片進行一次檔案最佳化然後再匯入Flash中，接著製作動態完成後，統一在發布設定裡設定JPEG輸出品質約50，通常以兩個場景約四卡的動畫來說，就可以壓在40~50K以內，如果還是超出一點，一些K數較大的元件我就會設定JPEG輸出品質約30，文字部分因為是純色，設定品質10其實都還好。
再來Flash的部分一定要記得要埋Click tag，也就是要寫action script在一顆透明大按鈕上，每個平台的action script的code都不一樣，以下列出一些我最近有使用過的action script2的click tag code：
--------------google--------------
on (release) {
getURL (_level0.clickTag, "_blank");
}
--------------yahoo--------------
on (release) {
if (_root.clickTAG.substr(0, 5) == "http:" || _root.clickTAG.substr(0, 6) == "https:")
{
getURL(_root.clickTAG, "_blank");
}
}
--------------mobile01--------------
on (release) {
getURL (clickTAG, "_blank");
}
想知道埋code是否正確？Google有提供工具來檢查是否有正確埋code，但是只能撿查要投放到Google的Banner，其他部分可能還要等廣告上刊測試後，如果有問題廣告商會跟你說的。
最後就是Flash banner都需要一張墊檔圖，通常是動畫的最後一卡，這個部分如果有photoshop排版，可以從photoshop輸出，但是既然都用Flash了，就統一用Flash來做吧！只要將動畫的時間軸拉到最後一卡完整的畫面，然後選擇檔案>匯出>匯出影像，然後按下儲存，之後會跳出設定畫面，請選擇完整文件大小，即可匯出最後一卡的畫面當作墊檔圖使用。
當然墊檔圖盡量不要太大，因為也要在40~50K範圍裡，所以我會設定品質為90，如果是100的話有時候還是會超過50K，所以設定成90可以確保一定少於50K。
HTML5 Banner
目前各大平台可以完整支援HTML5 banner的不多，而且HTML5 banner製作方式也蠻多樣的，但目前最簡單的做法就是把Flash做好的swf直接使用Google Swiffy 做轉檔的動作，你可以觀看各廣告平台的規範，裡面還是會提到要在Flash中埋code，在使用Google Swiffy轉檔。Google Swiffy會將swf轉成HTML5 banner，並且將圖片元素轉成base64格式，所以只要一個html檔案就可以完整呈現整個banner，當然如果使用flash製作完成後還要打開瀏覽器上傳轉檔，感覺是挺多此一舉的，所以Google有推出Flash外掛，讓你只要多點幾下就可以直接轉成HTML5 banner。
安裝好Swiffy Extension之後，你就可以在最上方工具列的命令>Export as HTML5(Swiffy)，即可輸出HTML5 banner，輸出後記得確認是否有在150K限制內，如果沒有，一樣可以像swf壓K，在發布設定裡調整JPEG品質，即可降低K數。
資料整理
因為每個平台要埋的Code不同，檔案大小限制也不太一樣，每次一波廣告可能同時2~5個以上的廣告平台，所以建議每一個平台的廣告banner的要有自己的資料夾，這樣才會比較好核對所有的banner，如果banner之後有修改，建議在資料夾上除了有平台名稱以外，也可以押上日期，這樣才不會太過於混亂，導致找不到Banner。