Sat 23 Jun 2007

根據以前讀的一個統計(好像是哈佛做的研究), 一般人從點選到下一個畫面出現中間的耐心平均不會超過8秒. 也就是說, 你做的Flash要是loading過重, 大部分的人也許連內容都還沒看到就離開了! 以下是一些小技巧可以幫你省下不少檔案大小我們來抓個保守數字, 假設使用者每秒可下載60KB, 8秒就是480KB. 以一個動畫很多的.swf黨, 480KB很輕易就會被突破.
1) 獨立圖檔壓縮:
首先先把Library打開(ctrl+L), 然後點選任何一張圖檔(BMP, JPG, PNG等)就會叫出以下視窗.

在這裡你可以選擇這張圖的壓縮方式(JPG或PNG), PNG的品質較高, 不過檔案大小相對的比JPG大出許多. 所以一般都是選擇JPG. Flash可以像Photoshop一樣的決定你要壓縮的程度並且讓你即時預覽壓縮出的品質. JPG壓縮技術對於紅色以外的顏色壓縮品質都不錯, 所以只要這張圖裡紅色的佔比不大, 你可試試50%以下, 然後按右邊的”Test”來預覽. 此範例裡的圖就從原先的37KB變成1.8KB. 馬上就省下了30多K.
*每一張圖壓縮出來的效果都不同, 養成好習慣, 把FLA裡的每一張圖都打開做獨力的JPG壓縮質設定.
2)音樂檔壓縮:
跟JPG壓縮一樣, 音樂檔也是可以獨立壓縮的. 打開Library(ctrl+L), 點選音樂檔(.MP3/.WAV), 以下是音樂檔壓縮的選項:

1. Compression(壓縮格式): MP3是最常用的
2. Stereo/Mono(單軌/雙軌): MP3的壓縮技術有個特質, 如果左右音軌的差異很大時, 他的檔案大小相對的會增加. 但是現代的音樂混音很少會混到左右音軌的差異很大, 所以我會建議使用Stereo(雙軌). 不過此範例裡的一開始就是單軌的, 所以我選擇Mono(單軌)
3. Bit Rate:這是決定MP3音質的最大因素, 我會建議各位多試試不同的bit rate, 然後再按”Test”聽聽音質與檔案大小是否在接受範圍以內.
4. Quality: 決定壓縮時間, 選”Best”會讓你compile時多等一會, 不過出來的音質好一些.
3) 影片壓縮:

影片是最佔空間的元素, 它是一連串的圖檔加上音樂. Flash8帶入了新的video codec, On2 VB6, 它可以讓影片檔更小, 畫質更好. 不過影像檔的檔案大小仍然需要注意. 一個”作弊”的方法是, 把你的影片縮小, 然後再在Flash裡拉大. 好比你有一個600*400px的影片, 你在置入時先把他的縮小設定為300*200(原本的一半), 置入後再在Flash裡把他拉回600*400px. 這樣做我們的影片其實只有300*200, 所以檔案絕對會比原先的600*400小許多, Flash在影片畫質處理上還不錯, 被拉大一倍有時還不會太糟(依影片內容而變). 不過我還是建議各位多做實驗, 找出適合的縮小比例.
4)動態字型:
當你開始使用動態文字時, 往往會需要embed字型. 英文字型通常都很小(因為只有26個字母加一些符號), 不過中文就不同了, 因為有非常多的字. 各位可以試試把新細明體整個包在一個swf裡, 檔案大小大約13MB, 不是很實用…之前有測試過shared library font, 檔案可以小許多, 不過好像也還是在3-8MB左右, 也不是很實用. 所以一般的做法是, 不要embed.
但是如果真的有需要時, 以下是一個辦法:

選取你的動態文字, 打開Embed, 輸入你需要的中文字. 這樣Flash就可以只包住你輸入的字, 掠過其他的好幾百好幾千個中文字, 所以檔案大小相對的就小了非常多. 雖然不是非常理想, 不過在用程式作文字特效時到可以解決檔案大小的問題.
總結
本人的原則是, 盡量讓每一支.swf在500KB以內, 能夠200KB以內最佳. 當然, 還有很多技巧可以讓loading變的更快, 不過以上所提的是最簡單也最有效率的方式.
August 3rd, 2007 at 4:04 pm
好實用的技巧呀~感謝分享~
September 20th, 2007 at 3:23 pm
真感謝看到這個設定,這裡果然有學校學不到的。感恩
October 11th, 2007 at 6:39 am
It’s really an useful skill for set up a website.
No one want wait too lone, right!
October 29th, 2007 at 10:42 pm
Thanks for all information~
It’s useful and I like your design~!
February 6th, 2008 at 9:29 am
我最近才剛學會這些…不過你說明的真詳細!!! 果然是歐拔老板!
February 28th, 2008 at 4:08 pm
哈,謝謝,最近剛學flash和作個人page,因為沒經驗,正在煩惱到底檔案大小多少才合適,你的解釋很簡單卻一語道破關鍵.
May 2nd, 2008 at 12:59 pm
對於做flash來說,這真的是非常實用的技巧
我可以引用你的這篇文章嗎?
可以的話麻煩給我一個回應,謝謝你囉~
May 2nd, 2008 at 5:51 pm
Hi, HsC, 當然可以呀!
April 7th, 2009 at 3:40 pm
[...] 11. 別考驗使用者等待的耐性 檔案大小一定要小心控制. 之前有寫過2篇教學可供參考: Flash網站架構 , 別讓你的使用者等超過8秒 [...]