這個新設立的部門具有網上銷售的價格決定權嗎？
◎電子商務不等於網上銷售
筆者已經遇到過太多的傳統產業老闆，他們原先是不懂網際網路，總覺得那是燒錢的行業，看不到效益。好不容易公司弄了個網站，卻也不知道該怎麼管理。等到電子商務開始發熱的時候，老闆們總算覺得可以在網上做點生意，但是概念又完全停留在「在網上銷售商品」。
通常筆者會告訴對方，你的企業其實不一定需要在網上銷售，甚至可能連網站都不需要。曾有個汽車公司老闆也想在網上賣車。但是網上賣車要怎麼支付？消費者在沒有看到實際的車子並試駕看看之前，會直接在網上訂購嗎？顯然有些商品並不合適在網上銷售。
傳統企業的老闆們，對於是否要在網上銷售企業的商品，請先思考：
1. 商品適合在網上銷售嗎？
2. 透過網上銷售的成本較低嗎？
3. 如果成本沒有較低，那麼是否能接觸到新的客戶群體？
一旦決定要在網上銷售以後，才接著思考：
1. 透過什麼網上通路的銷售成本最低？（自建網店不一定成本最低）
2. 透過什麼作業程序可以滿足消費者？（金流物流資訊流）
3. 透過什麼方式做推廣？（不推廣基本上沒有人會來消費）
◎企業電子商務策略四大面向
其實，傳統企業的老闆們一下子跳入是否要透過網際網路銷售的思考，進度是太快了些。很有可能在經歷過上述思考之後發現，企業根本沒必要做網上銷售。事實上，網上銷售僅是企業電子商務策略中的一環而已，老闆們真正要考慮的是下面這個圖形：
企業的電子商務策略要考慮四個面向：1)新增客戶；2)維繫客戶；3) 客戶服務；4)二次銷售。由於傳統產業通常已經有既有的線下銷售方式以及既有客戶，因此更需要從客戶的角度出發來看待電子商務如何成為面向客戶的工具。
需要透過網上取得新客戶嗎？如果是，那麼績效指標（KPI ）就是客戶成長率；若不期待（或無法）從網上得到新客戶，是否用網際網路來維繫既有客戶？那麼績效指標就是客戶流失率；僅能做到用網際網路來服務客戶？那麼績效指標就是客戶滿意度。
有的傳統企業利用網際網路對既有客戶進行二次銷售，例如：網上賣不了汽車，但是可以對既有車主銷售汽車週邊商品。而二次銷售的績效指標就是每客戶平均的再消費金額。透過對上述電子商務的思考，傳統企業主才能找到網際網路對自己企業的意義。
◎不需要另外建立電子商務部門
傳統企業需要另外成立電子商務部門來進行自己的網際網路事業嗎？經歷過十年的電子商務發展經驗，筆者可以很肯定的告訴企業主，不要幹這種事情。在傳統企業裡面被新設立出來的電子商務部門，最後都是飽受折磨，部門主管死得死逃得逃。
道理很簡單，如果這個新設立出來的電子商務部門是從事網上銷售的，請問這個部門跟原先企業內部的銷售部門是甚麼關係？這個新設立的部門具有網上銷售的價格決定權嗎？大部分的企業都有直營經銷加盟等等銷售通路，請問這個電子商務部門算是哪個通路？
通常，網上銷售部門會要求老闆，說網上銷售的商品價格要比傳統通路低，網民才願意買。而其他銷售單位不服，說電子商務部門賣得比我門店的價格還低，搶了門店生意。而老闆最終會認為，目前公司最大營收來源還是傳統通路，因此最後被犧牲的往往是電子商務部門。
過去十年，這種傳統企業的電子商務慘劇不斷重演。
此外，如果新設立的電子商務部門主要負責客戶服務，那麼請問這個部門跟原先企業已經存在的客戶服務部門是甚麼關係？諸如此類的問題，都導因於企業主沒有先思考過企業到底要怎麼看待網際網路，就先想到要成立新部門，最終造成企業內部的嚴重衝突。
比較好的做法，是回歸到本文前面的那張圖，傳統企業的電子商務策略，把那四個面向想清楚，然後讓企業內部既有的部門來負責籌畫電子商務的相關事宜，將網際網路納歸企業內部的體系，而績效考評的問題以及部門衝突的問題方能得到解決。
（文：黃紹麟)
文章提供 BAYSTARS DESIGN網頁設計公司
2009年6月8日 星期一
2009年6月7日 星期日
99designs透過「小比賽」來創造1.6億元撮合業績，給我們的２個新啟示
這周看到一篇極有趣的成功案例，它是在分析一間叫「99designs」的Web 2.0型的「撮合平台」，如何成功的在一年又四個月內創造了524萬美元（1.6億元台幣）的平台交易量？
「99designs」的點子相信大家都耳熟能詳，好多人都有類似的點子，也有一些做的成功，一些失敗。他們試圖讓中小企業主或一般網友貼「案子」，然後給網頁設計師來「接案」，99designs是一個網頁設計專案的撮合平台。問題是，在2007年，你要推出這麼一個平台，有何競爭性可言？如果這點子可以做起來，早就有人成功了，大者恆大，沒有他的份；如果這點子做不起來，那就是做不起來。不只是撮合設計師與業主，還有好多好多其他類似的網站都是想做「撮合平台」，先撮合、然後交易，許多皆很有創意也很有市場需求，但到了最後，都沒有真的獲得網友使用，大家還是回到傳統方式來交易，沒有線上平台！雞生蛋蛋生雞，沒有一方，另一方也不會出現，這種新創線上撮合平台有嚴重的「2 mass」門檻要先突破，為了突破此點，站方就不方便馬上收費，也造成以後收費不易……還有種種好多好多其他的挑戰要克服，最後會達到「500萬美元」、「成功」的可說少之又少！
更何況是在「2007年」，「一年又四個月」時間就達到！到底，這家99designs怎麼成功的？
很妙，它就在兩方撮合的中間，加了一個小小的「東西」──
那個小小的東西叫作：「小比賽」。
是的，小比賽，Competition。
什麼意思呢？原來，所有的99designs的「案子」，都是以「比賽」的形式來推出。大部份的案子都只是設計一個logo之類的，一般來說大概花設計師最多一～二天的時間，所以這些都是「小比賽」，而目前正在進行中的「比賽」的價錢大約從300美元到800美元都有。如果你是設計師，你可以選其中一個比賽，然後在限期內交出你的作品，如果作品被業主所選中了，那你就會得到那筆獎金，如果沒中，SORRY！那就做了白工了。
所有已經繳交的作品，都會即時在線上出現，你可以看到別人的作品，再自己改都行。目前這些小比賽包括像這個要設計一把雨傘的iPhone logo，已吸引92件作品去搶那475美元的獎金。還有要設計一個「Service.com」網站的logo，目前已吸引172件作品去搶那375美元的獎金。還有幫一家托嬰中心設計的logo，已吸引138件作品去搶那500美元的獎金！你可以相信嗎？
這種做法顯然打中了「甜蜜點」(sweet spot)，目前在99designs上面共有36,975個設計師在站上找案子，這些設計師在這短短時間以來，已經熱情的貢獻了高達193萬件作品。而這些作品顯然只有一小部份真的有「收益」，剩下都是作免費的。一年半以來已經辦了2萬2千次以上的競賽，總共給出了……524萬美元（1.6億台幣）的獎金！而現在仍有330個競賽正在進行，總獎金高達12萬美元（台幣400萬元）。喂，各位設計高手還在想去找尋什麼政府的競標案嗎？如果找不到的話，有空嗎，這邊有一個總額400萬獎金的地方，趕快來吧！
看完，你會覺得很興奮！我們隨便算都可以幫99designs算出它從這些作品所收到的錢，還有一些隱型的收費點等著它，不過，各位難道不會也覺得「怪怪的」，為何「小比賽」，竟是打開撮合平台的金鑰匙？我們在NET-MBA網路成功案例分享四堂課中的獲利成功案例分析課程中，有提到如何透過比賽來提升網友付費，但我們沒注意到原來「比賽」竟然能做更多，竟能讓設計師……這些平常非常小心談每一個案子的每一個價錢的設計師們，願意做「免費」的？
最妙的是，這個創業家，其實也沒有很神。他完全是不小心從討論區觀察到一個有趣的現象。創業家之前剛好開設了一個叫SitePoint的論壇，這個論壇其實本身已經蠻成功，一個月有300萬個不重覆使用者，而這些使用者都是「網站與視覺設計師」。
有一天，創業家發現，這些設計師其實還蠻愛「比賽」的，他們常常互相比Photoshop的技術，比到後來，竟然就有人在SitePoint論壇主動發起一個小型的Photoshop比賽，通常是選「周五的晚上」，某人出了一個「比賽題目」，譬如，看看誰能把一堆難以去背的髮絲成功的全部去背，然後，通常真的會有設計師真的很無聊的跑進來比，畫到周一早上，交出作品，再互相「投票」，決定誰贏得比賽！最後並沒有什麼獎品，但，大家就很享受這種比賽，據創業家觀察，每場比賽都有20~30位設計師熱情參與。
不過，創業家觀察到這情形卻有看沒到，還沒「開竅」，直到有一天，有一位生意人跑進來也發現這狀況，就在上面提議設計師們不要再自己想題目了，他有題目！這題目就是，幫他設計一個他公司的新logo吧！周五開始，周一早上交件，最後得到我使用的，我就給他100美元！
嘩，才100美元(3300台幣)？這是亞洲這邊削價才會有的設計logo的價錢？沒想到，這招竟然很有用，設計師拚了老命的做，爭那100美元，當然，最爽的就是這位小企業家，他得到了一大堆超棒的logo，最後，從容不迫的選了一個，只花他100美元！
這時候，這位99designs的創業家才終於看懂這一切的暗示，終於開始動作。他先將這些「周末比賽」從主要討論區分出來，另外開設一個新的專區，而且他也開始「對業主收刊登費」，每一個刊登比賽的業主必須先付20美元，不多，就只要20美元，才能貼一個「比賽公告」。結果創業家駭然發現，這些「周末比賽」的數量愈來愈多，參加的人不減還反增！這時候，創業家終於決定另外找人寫一點程式，做一個很基本很陽春的子網站，專門讓人「公告比賽」，以及「參加比賽」的。由於這位創業家並沒有很著急，所以竟然連這個子網站也花了三、四個月時間才做好，他將刊登費用提升到30美元，沒想到，它還在繼續成長！一年又四個月前，這位創業家終於決定，該是用這個點子出來「開網站」的時候了，所以他開設了99designs，和原本的「設計專家專用的討論區」做一個明顯的區隔，讓一般的大中小企業主、想要得到一些設計的，都會知道這個地方，知道它總是會有很多設計師等著提供作品。
有趣的是，通常這種Web 2.0起家的論壇，有如背上插了一把刀，這把刀讓他們快速成長，也因為這把刀，讓他們受制於網友的箝制，尤其是當站方宣布要收費的時候，就算不是對網友收而是對業主收，網友依然有反彈的可能。但99designs這部份卻做得很巧妙，他們對設計師說，99designs都是「為了這些設計師」，才向企業主收費的！雖然最後的獎金有一部份不免的給了站方，但唯有這樣，才能確保這筆獎金不是「黃牛」，以免設計師設計了一個周末，結果這名企業主死都不付錢！從「為了社群好」的出發點，design99成功的得到支持。
總和下來，Design99的成功，讓我們至少學到了兩件事情：
第一、觀察大型論壇中「非討論型」的網友自發活動：看，這名創業家顯然並不是一個一般喜歡在網路上天馬行空亂想點子的創業家。如果他不是剛好有這個SitePoint的討論區，不是剛好看到這些設計師在上面「比賽」，他可能永遠都不會想開設99designs。這也告訴我們，只要有網友聚集的地方，有時候就會透露一些商機，詭異的是，這些商機大部份創業家都看不到的！看99designs花了一～二年的時間，一個周末又一個周末的過去，大家都是網站設計師，竟然都沒有人看到這個需求？都沒有人出來搶先開一間99designs？可見，大部份的創業家雖然大腦發達、點子想得非常迅速，但大部份都是「眼瞎」的。就算生意已經就在「面前」，還是寧可用自己的大腦去試想一些不存在的需求，而放棄了眼前已經明顯得不能再明顯的暗示。因此創業家應該多多觀察各大論壇、PTT的一些特殊的活動，尤其像SitePoint當初「周末設計比賽」的這樣的「網友自發的活動」，它原本就不該是屬於在論壇裡的東西，只是暫時勉強先在論壇裡做而已，因此，這種活動若不錯的話，一般論壇的介面肯定不是最終的選項，這時候趕快出來開一個網站，成功機率很高。
第二、什麼點子都可以加入「比賽」來另創新世界：以99designs目前logo的價錢從300~800美元來看，並不算是最貴的設計，但設計出來的東西也不見得很好（而且很有可能不能再修改）。你說，為何有業主要提供這樣的獎金拿到一個不保證好的logo，而這些設計師為了什麼而願意只為了100美元去設計這些logo？都是因為「比賽」兩字。這些都是「周末比賽」，設計師平常有案，平常在賺錢，周末他們就只想休閒一下，所以他們在乎的不是那100元，而是那種比賽、競爭、飆車的快感，那種一起競爭然後再一起喝酒的痛快，所以設計師都卯足了勁在做，可想像業主最後得到的logo應該不會太差，而最後真的得獎的那位，得到的當然也不只那100元，而是一種莫大的榮耀；平常周一到周五都是做別人想要的東西，沒人可以「打敗」，但周末這次卻是「打敗人家」才獲得此獎，這種榮耀感在設計師心中的真實價值說不定比收到100元，不，1000元都還要「爽」。所以，還有哪些點子可以加入「比賽」來讓人以低價貢獻東西呢？
另外還有興趣聽到類似這樣的成功案例者，也歡迎加入下一屆的「NET-MBA網路行銷、獲利、募資、流量提升成功四堂課」，雖然我們學員中許多都有著在各產業操作過網站的實作背景，但我們更歡迎「初學者」，對網路一竅不通，但擁有3年以上工作經驗的社會人士，最好是5~7年以上工作經驗者，可以帶來一些傳統的思維，分享關於您工作的點點滴滴，不要小看您自我介紹的一兩句話，每一句都是打開大家的眼睛，大家一起研究網路還可以怎麼深入的觸及各產業，從各產業都賺到錢！
每一個星期最快樂、最有收穫的一天，就是NET-MBA上課日，快點來報名喔！
文章來自MR6
買菜團團長Ken幫鹽湖城家庭省下70%花費，自成一個驚人生意
這一個月從偏遠的寧靜小鎮鹽湖城，傳出一個奇特的小案例（另一篇文章在此）。它還稱不上是個「網站」，比較像是透過網路與實體整合發展的服務，我是覺得它在「省錢」這塊挖出一塊藍海策略，可供網路創業家參考──
原來，在鹽湖城，這幾年來有一位小小的名人叫Ken Roesbery，他在鹽湖城已自稱為「Grocery Guru」，中文叫「日常雜貨達人」，這位仁兄常常出現在各大超市，總是穿著綠色的圍裙，活像個超市的幫忙切肉的人員，但他不是在超市切肉，他是正在「帶團」。是的，帶團。Ken最厲害的是，他每周要帶好幾次的「買菜團」上超市買東西！
這買菜團要幹嘛？Ken帶著一群媽媽們，直接告訴她們該買什麼東西，然後媽媽們不必想太多，就照著Ken的指示買就對了。你說，媽媽們自己有自己的買菜需求，為何要全聽一個Ken的指示？這就是Ken的價值所在了，因為他號稱，只要你照著他的要求買，他就能幫你省下高達70%的日常雜貨成本！（註：這個％數愈來愈高，幾年前他說是50%，後來變60%，現在則是70%，嚇死人）。根據該篇報導的那位記者說，最後她的總價原本85.59美元，但Ken先生給了他一堆coupon，最後只要付28.48美元，總共省了66%，還買下了八大袋的日用食品！據其他媽媽陸續傳達給記者的數字是，只要和Ken一起買東西，一年都可省下高達1500美元（5萬台幣）的買菜錢！
據說，如果到鹽湖城，Ken真的是一位小小的名人，據說會在許多地方看到Ken達人的蹤跡，猶他地區的路邊看板、報紙、以及廣播節目履次被提到。而且，從ZoomInfo資料顯示，Ken在推廣這個「省錢買菜團」似乎已在鹽湖城當地默默進行七年以上，Ken也據說已經在教省錢教了20年了，目前估計有1萬個左右的猶他州居民在照著這位先生的指導在進行她們每周的買菜工作，但最近一個月開始往外擴張。他的課程現在據說也到加州等其他遙遠的四個州去了。
後來才知道，原來，這位Ken先生並不是獨立工作者，他是被MediaOne所聘用的，而MediaOne是鹽湖城當地兩家報紙《The Salt Lake Tribune 》與《the Deseret News》的廣告代理商，還兼任配送商，這間公司幫Ken開了一個網站叫「GuruDeals.com」，進去後，會自動轉址到猶他城市導覽網站的其中一個內頁，這就是這位達人的首頁，包括電子報、podcast……應有盡有。MediaOne顯然也幫忙製作這兩間報紙的網站，以及這個網站。這位「日常用品大師」所教家庭主婦的第一件事，就是「開始訂報紙」，因為報紙上會有好多好多可以幫大家省錢的折價券、促銷活動……。這些折價券會幫助你省的錢，遠比一份報紙的訂閱的成本還低。
不過，我覺得這些都不是重點。重點是－－
數字就是最好的行銷工具。什麼都不必問，只要繳出成績來，就可以說服人。如果Ken能幫你省下70%，你會不會跟他一起買菜？
任何一個網站，如果能幫你省下70%的價錢，你會不會到這個網站來購買？
只要全世界有1%的這樣的傻蛋，然後這個網站賣的又是日用品，那這個網站可以立刻變成全世界最大的商店！這，就是Ken的這篇故事令我們值得學習之處。
Ken，是怎麼辦到的？
折價券人人都看得到，為何Ken先生就是可以教你省下70%的成本？
其實，這位Ken先生的「買菜策略」很簡單，說穿了會簡單得讓人嚇一跳，可是卻有很有道理──
原來，Ken是「完全跟著促銷」在走，而不是以自己的習慣去跟著促銷活動。換句話說，為了省錢，原本每天吃飯的，可能這個月就必須改為每天吃麵。
這點在行銷上面是蠻有意思的，一般人很難接受放棄自己的習慣去跟著某事，所以像折價券這種，其實都是自己腳還踩在一邊岸上，一邊又想伸手去拿其他東西，所以拿不好，也從來不可能達到高達「70%」的折價率！不過，有些人就抓準這點，告訴你「你達不到70%？我達得到！聽我的就對了！」聽他的，完全放棄自己的習慣，就可以被他帶到另一個境界；而他所做的，只是完全放棄「客製化」，去「教」你一件事情，這件事情就瞬間因為打敗客製化的問題，而得到了立即的成效（省下70%的日常用品錢），許多人看到成效，就會繼續去跟著。
而且，為了達成效果，如果你加入Ken先生的買菜團，他會「從頭開始教起」。他會告訴你，最正確的買東西方法就應該從折價券開始，每周要煮的菜，盡量想辦法照著折價券來進行，就算沒有折價券，至少也要看看這周都是哪一種青菜、哪一種水果在打折，然後照著去計畫這周要買的食物。他教大家要細讀每周日的特別的報紙，將這些折價券都剪下，放在一個檔案夾裡。
到了買菜的那天，媽媽們不必動腦筋，真的只要跟著Ken，只要讓這位先生指揮，你買這個、買這個；買四箱，買六箱……。當然這其中除了折價券，也有購買策略。據說Ken比較偏好購買一些非新鮮的食品，比較便宜，但不見得對身體好的那些，是媽媽們比較不習慣的地方，但只要省錢，不至吃到拉肚子就好，這是Ken的哲學。有趣的是，Ken先生不讓你覺得「省錢購物」是一件很小家子氣的事情，他會把購物的過程弄得很好玩，鼓勵你要多帶幾個朋友過來，自己也可以組成自己的「剪折價券大隊」……他會確定每一團買菜團都像旅行團一樣的有趣。據說現在每一團都大約有10幾位一起跟過來，大多是女性，每次到了買菜團，就好像要進攻攤頭堡，好有趣哪。
這個奇特的案例，令創業家可想想，還有哪些生意是可以藉由「拿掉客製化」，取得數字效益？這樣的話，生意可以藉由口耳相傳，愈做愈大，並且將一個力量聚在一起共同購買東西。人們雖然很聰明，但有的時候也要讓他們懶一下──只要，你可以拿得出一個說服對方的數字！
文章來自MR6
文章提供BAYSTARS DESIGN網頁設計公司
2009年6月4日 星期四
正式使用Flash Builder 4 Beta
Flex Builder官方更式命名了，並且推出Beta新版，稱為Flash Builder 4
(全球社群熱烈的討論下，為了讓更多熟悉與不熟悉Adobe產品的人，更快看到名字就知道產品用意，因此，Flex Builder催促成Flash Builder為更貼近人心之命名)
註：Flex SDK仍保留原來Flex名稱，只有更名Flex Builder為Flash Builder。
Flash Builder 4.0版重點：
Flex 2~3版間做的功能己夠商用化，但好的產品還是要不斷更好才行，這次Adobe卯足18個月的努力，將此版本重心放在三個，如：
設計者與程序員間更緊密的工作流程
以資料開發為中心
提供更好的開發環境與測試環境
設計者與程序員間更緊密的工作流程：
在專桉開始時，最需要設計者的創意靈感，而最終產品是否幾乎逼近原設計者的想法，其實不一定盡然，加上，設計人員常與開發人員間的溝通，是否有效？是否更可縮短時間，將畫面與動線完全百分百表達給開發者明白？這也是常發生鴻溝與默契之事，當然，團隊間的合作內容，是否真讓客戶滿意？這也是說與做間的結果論。
所以在新版的Flash Builder 4加了"New Flash Component"與"New Flash Container"，以符合更佳的開發流程，你可以在原先的Flash開發環境上建立或編輯內容，按下"done"後，透過Fla與SWC檔就可以就直接回到Flash Builder 4專桉裡繼續編輯。
而在Flash Catalyst裡，你可以利用不管是Photoshop或Illustrator，把編輯好的圖形匯入到Flash Catalyst中，Flash Catalyst主要是讓你將圖形轉換更佳的RIA介面，提供給Flash Builder使用，程式員匯入Flash Catalyst的專桉檔後，就清楚知道介面與動線的來龍去脈，他只需要再去做好程式資料邏輯的動作，有任何問題也可以來回編修，構成更好的協同合作。
以資料開發為中心：
在開發RIA系統中，不管多麼包羅萬象的設計，但資料還是為最基礎元素，不管你是用數位儀表板，或是Mash-up(溷搭)的介面呈現，亦或改變了原先前端設計，保留住既有的後端程式(php,asp.net,coldfusion...等)與資料端，甚至是只利用Webservice等服務媒介，伺服器或其細節設定或許會改變，但基本的「資料」仍在，你必須要更容易的去連結你需要的後端服務，並且綁定到你的Flex元件，這就是新版Flash Builder 4功能上要讓你輕鬆達成，加速你在開髮結合動態資料上的體驗，讓困難變成簡單。
也因此新版重點就在：
定義資料/服務模組
綁定服務操作到Flex元件
更能輕鬆完成資料操作功能，如：頁面顯示、進階的資料管理
將資料或服務模組在綁定模式下更加簡便：
你可能有許多的ColdFusion元件、PHP類別、Java或Webservice等既有的後端程式邏輯，不管如何，你要將資料與服務呈現在你的Flex前端，這之間的綁定就必須更加容易，這代表了，你後端不管用多複雜的技術，通通殊途同歸，化為單一的模組，將後端的操作綁定在單一的Flex元件上，如：DataGrid或List，這操作只要用滑鼠拖曳到Flex元件上就可以完成。這樣的操作，你可以很快做出主要與細項列表，或是圖表等。
更進階的資料管理功能：
這樣的Flex元件綁定概念，就是讓你的Flex前端管理後端的資料內容，根據實際需要才去做資料的讀取、變更，甚至是回復上一個動作，請放心，這版本當然有自動的CRUD(也就是自動建立、讀取、更新、刪除資料的功能)，這些通常在手工上的編程都是很費時間。
也因此，你可以快速創造出更好的前台操作體驗，並在HTML裡執行。
提供更好的程式開發環境與測試環境：
這重點擺在改善前版在重構程式、偵錯模式、剖析器上的功能。
偵錯模式上加了條件式的停頓點、觀偵點、逐行執行以及表現式上的使用。
剖析器現在也改善了"元件參考"報告。
在程式碼的搬移上也新增了重構功能。(這也就是說，你可以指定要搬移的程式碼，全部有的程式檔都照著搬移好)
對於新版IDE(快速開發環境)上，你可以去嘗試以下幾個功能：
getter/setter一般性操作
事件程式碼上的操作
新版的Package瀏覽器
ASDoc也開始支援了Tooltips(工具使用提示)
對於MXML、ActionScript及CSS檔的自訂樣版，在此版也支援。
新版對於「測試」功能的改善
對於編程上的生產力，Flash Builder 4 beta也加了二個重要的測試系統功能，也就是"Network monitor"及"Flex Unit"
Network monitor可以讓你從Flash Builder上看出Flash前端與你後端伺服器上的網路擁塞狀況，這也是讓你清楚看出資料在某一點是有大量的停滯瓶頸，好讓你針對某點去改善其效能，驗出更好的系統表現。(這情況也可以分辨出是前台還是伺服端出了問題)
Flex Unit就是在做單位測試，這對要開發的系統來說是很重要的一環，Flash builder整合了Flex Unit，好讓你測試內容是從安裝到檔桉建立、程式運行、執行結果等分析。
命令列的建立系統與佈署
系統開發完成後，你可以藉由IDE提供的功能去創建與佈署系統，但你也可以從命令列下來執行，使更符合你要的程式結果。(此在Flex Builder3就有了，筆者尚未測試細節不同處)
以上為大致Flash Builder 4 Beta最新功能概況，亦有參考Tim Buntel文章：http://www.adobe.com/devnet/flex/art..._whatsnew.html
內容相似度大約85%，請要轉貼的朋友，註明來源為RiS社群 http://forum.j2eemx.com
迫不及待要下載Flash Builder 4.0 Beta了嗎？
請至：這裡下載...
註：參加6/20以後Flex課程的朋友，您將會開始看到課程中介紹Flash Builder精彩範例。
相關學習資源：
Flash Builder 4最新影片教學
http://labs.adobe.com/technologies/flash/videos/
Flex 4線上輔助文件
http://livedocs.adobe.com/flex/gumbo...f3b6-8000.html
Flex 4線上教學範例
http://livedocs.adobe.com/flex/gumbo...c9c9-8000.html
Flex 3系統移植到Flex 4
http://livedocs.adobe.com/flex/gumbo...dmigration.pdf
Flash Builder 4 FAQ
http://labs.adobe.com/technologies/f...ID=details#FAQ.
更多的Flash Builder 4範例教學
http://labs.adobe.com/technologies/f...er4/tutorials/
Flex 4 Beta線上ASDoc文件
http://livedocs.adobe.com/flex/gumbo/langref/
Flex 4 SDK Beta介紹
http://www.adobe.com/devnet/flex/art..._whatsnew.html
Flex 4 SDK下載
http://www.adobe.com/go/flex4sdk_download
原文：點這裡...
文章提供 BAYSTARS DESIGN網頁設計公司
(全球社群熱烈的討論下，為了讓更多熟悉與不熟悉Adobe產品的人，更快看到名字就知道產品用意，因此，Flex Builder催促成Flash Builder為更貼近人心之命名)
註：Flex SDK仍保留原來Flex名稱，只有更名Flex Builder為Flash Builder。
Flash Builder 4.0版重點：
Flex 2~3版間做的功能己夠商用化，但好的產品還是要不斷更好才行，這次Adobe卯足18個月的努力，將此版本重心放在三個，如：
設計者與程序員間更緊密的工作流程
以資料開發為中心
提供更好的開發環境與測試環境
設計者與程序員間更緊密的工作流程：
在專桉開始時，最需要設計者的創意靈感，而最終產品是否幾乎逼近原設計者的想法，其實不一定盡然，加上，設計人員常與開發人員間的溝通，是否有效？是否更可縮短時間，將畫面與動線完全百分百表達給開發者明白？這也是常發生鴻溝與默契之事，當然，團隊間的合作內容，是否真讓客戶滿意？這也是說與做間的結果論。
所以在新版的Flash Builder 4加了"New Flash Component"與"New Flash Container"，以符合更佳的開發流程，你可以在原先的Flash開發環境上建立或編輯內容，按下"done"後，透過Fla與SWC檔就可以就直接回到Flash Builder 4專桉裡繼續編輯。
而在Flash Catalyst裡，你可以利用不管是Photoshop或Illustrator，把編輯好的圖形匯入到Flash Catalyst中，Flash Catalyst主要是讓你將圖形轉換更佳的RIA介面，提供給Flash Builder使用，程式員匯入Flash Catalyst的專桉檔後，就清楚知道介面與動線的來龍去脈，他只需要再去做好程式資料邏輯的動作，有任何問題也可以來回編修，構成更好的協同合作。
以資料開發為中心：
在開發RIA系統中，不管多麼包羅萬象的設計，但資料還是為最基礎元素，不管你是用數位儀表板，或是Mash-up(溷搭)的介面呈現，亦或改變了原先前端設計，保留住既有的後端程式(php,asp.net,coldfusion...等)與資料端，甚至是只利用Webservice等服務媒介，伺服器或其細節設定或許會改變，但基本的「資料」仍在，你必須要更容易的去連結你需要的後端服務，並且綁定到你的Flex元件，這就是新版Flash Builder 4功能上要讓你輕鬆達成，加速你在開髮結合動態資料上的體驗，讓困難變成簡單。
也因此新版重點就在：
定義資料/服務模組
綁定服務操作到Flex元件
更能輕鬆完成資料操作功能，如：頁面顯示、進階的資料管理
將資料或服務模組在綁定模式下更加簡便：
你可能有許多的ColdFusion元件、PHP類別、Java或Webservice等既有的後端程式邏輯，不管如何，你要將資料與服務呈現在你的Flex前端，這之間的綁定就必須更加容易，這代表了，你後端不管用多複雜的技術，通通殊途同歸，化為單一的模組，將後端的操作綁定在單一的Flex元件上，如：DataGrid或List，這操作只要用滑鼠拖曳到Flex元件上就可以完成。這樣的操作，你可以很快做出主要與細項列表，或是圖表等。
更進階的資料管理功能：
這樣的Flex元件綁定概念，就是讓你的Flex前端管理後端的資料內容，根據實際需要才去做資料的讀取、變更，甚至是回復上一個動作，請放心，這版本當然有自動的CRUD(也就是自動建立、讀取、更新、刪除資料的功能)，這些通常在手工上的編程都是很費時間。
也因此，你可以快速創造出更好的前台操作體驗，並在HTML裡執行。
提供更好的程式開發環境與測試環境：
這重點擺在改善前版在重構程式、偵錯模式、剖析器上的功能。
偵錯模式上加了條件式的停頓點、觀偵點、逐行執行以及表現式上的使用。
剖析器現在也改善了"元件參考"報告。
在程式碼的搬移上也新增了重構功能。(這也就是說，你可以指定要搬移的程式碼，全部有的程式檔都照著搬移好)
對於新版IDE(快速開發環境)上，你可以去嘗試以下幾個功能：
getter/setter一般性操作
事件程式碼上的操作
新版的Package瀏覽器
ASDoc也開始支援了Tooltips(工具使用提示)
對於MXML、ActionScript及CSS檔的自訂樣版，在此版也支援。
新版對於「測試」功能的改善
對於編程上的生產力，Flash Builder 4 beta也加了二個重要的測試系統功能，也就是"Network monitor"及"Flex Unit"
Network monitor可以讓你從Flash Builder上看出Flash前端與你後端伺服器上的網路擁塞狀況，這也是讓你清楚看出資料在某一點是有大量的停滯瓶頸，好讓你針對某點去改善其效能，驗出更好的系統表現。(這情況也可以分辨出是前台還是伺服端出了問題)
Flex Unit就是在做單位測試，這對要開發的系統來說是很重要的一環，Flash builder整合了Flex Unit，好讓你測試內容是從安裝到檔桉建立、程式運行、執行結果等分析。
命令列的建立系統與佈署
系統開發完成後，你可以藉由IDE提供的功能去創建與佈署系統，但你也可以從命令列下來執行，使更符合你要的程式結果。(此在Flex Builder3就有了，筆者尚未測試細節不同處)
以上為大致Flash Builder 4 Beta最新功能概況，亦有參考Tim Buntel文章：http://www.adobe.com/devnet/flex/art..._whatsnew.html
內容相似度大約85%，請要轉貼的朋友，註明來源為RiS社群 http://forum.j2eemx.com
迫不及待要下載Flash Builder 4.0 Beta了嗎？
請至：這裡下載...
註：參加6/20以後Flex課程的朋友，您將會開始看到課程中介紹Flash Builder精彩範例。
相關學習資源：
Flash Builder 4最新影片教學
http://labs.adobe.com/technologies/flash/videos/
Flex 4線上輔助文件
http://livedocs.adobe.com/flex/gumbo...f3b6-8000.html
Flex 4線上教學範例
http://livedocs.adobe.com/flex/gumbo...c9c9-8000.html
Flex 3系統移植到Flex 4
http://livedocs.adobe.com/flex/gumbo...dmigration.pdf
Flash Builder 4 FAQ
http://labs.adobe.com/technologies/f...ID=details#FAQ.
更多的Flash Builder 4範例教學
http://labs.adobe.com/technologies/f...er4/tutorials/
Flex 4 Beta線上ASDoc文件
http://livedocs.adobe.com/flex/gumbo/langref/
Flex 4 SDK Beta介紹
http://www.adobe.com/devnet/flex/art..._whatsnew.html
Flex 4 SDK下載
http://www.adobe.com/go/flex4sdk_download
原文：點這裡...
文章提供 BAYSTARS DESIGN網頁設計公司
開發Web應用程序的結構化過程
開發web應用程序是一件非常辛苦的事情，你需要花大把大把的時間來做無數的事情。假如你不運用有條理的方法，尤其是在複雜的項目中，你會承受忽視項目，不能按時完成，浪費時間一無所獲的風險。
這篇文章中，結構化過程的插圖可以幫助你運用簡化的方法更加節省時間更加有效的建立你的web開發程序。
下載 Woork Papers N1幻燈片 你需要知道的開發Web應用程序的結構化過程
工序的主要階段
一般的web應用程序開發流程分為五個主要的階段：
1、明確需求
2、設計
3、執行
4、測試
5、發行
規劃與跟蹤監測是一個「跨階段」的跟隨開發發展的過程，定義一個在項目執行期間你需要跟蹤監測的項目計劃活動名單，並且每項活動需要定義一套行之有效的信息報告來進行跟蹤監測，例如：
- 擁有者
- 持續的時間
- 所耗
- …
看一看這些前一段我所寫的文章，怎樣使用Excel或者Google製表軟件設計製作項目實施計劃：
How to organize a project plan 怎樣組織項目規劃
Excel Gantt chart template Excel圖表設計繪製模板
Implement a project plan and manage activities with Google Spreadsheets 使用google電子錶格實施並靈活管理項目規劃
1. 需求定義
在這第一階段你必須確定範圍和Web應用程序的需求，在你的應用程序中必須做的，主要特點和技術要求：
範圍
為了確定Web應用程序的範圍,足以編製一份明確說明適用功能的詳細清單。目前重要的不是「如何」實現他們，而是「什麼」需要實現！
需求
需求分析需求分析是一個開發過程的關鍵組成部分。在這一步中你需要估計潛在流量，選擇一個服務器端語言（ PHP， ASP， Coldfusion …),數據庫，選擇一個托管服務…這裡需要非常注意不要高估 /低估預期！準確的平衡的預估時間，成本和目標之間每件事情！
2. 設計
在需求定義階段，你需要明確的規劃「設計」你的應用。在這個階段，可以按照以下步驟：
設計：應用圖
應用圖包含對應用有意義的和必要的結構信息：頁面（用區塊表示）和他們之間的主要關聯。你的應用圖可以像這樣：
通過這種方式，您擁有了有關一些「位置」 （頁）和「路徑」 （關係頁）的圖，您可以非常容易的遵循它，逐頁，以執行應用程序的下一階段。運用這種方式，可以節省大量的時間，並明確什麼是你需要執行的。
設計：數據庫
Ok,現在到了設計數據庫的時候了。一個簡單的實現方法是使用實體關係（ER）模型 。一般來說，你可以俺咋好下面的順序：定義第一個表確定第一個表，而不是屬性和關係的表格。您的ER模型將是這樣的：
1:1表示集的關係（在這種情況下，例如1用戶只能分派1的任務， 1個用戶只生活在一個城市） 。欲瞭解更多有關這一主題的內容，來看看我的舊文章：
Define the entities-relationships model 定義實體關係模型
A correct approach to define relationships between database tables 正確對待，以定義數據庫表格關係
10 Useful articles about Database design 十篇有用的數據庫設計文章
設計：頁面結構
下一步工作是設計大體的頁面結構，用名稱命名確定所有的主要部分 (例如 #header, #navbar, #mainContent, #sidebar).
設計：服務端語言
使用面向對象的開發方法進行開發，你可以定義類，函數和所有你所需要的，記住… 那不是「執行」只是下一階段實施的「指南」.
設計：JS 框架
這一步選擇JavaScript 框架(jQuery, Scriptaculous, MooTools…), 通過確定主要的特點和所需實施的效果（拖放，動畫效果… ）編製簡單的關於在一個或多個網頁中有關聯的每一個具體功能應用圖的列表。
次點設計階段已完成。讓我們實施吧！
3. 實施
Ok.. 現在是真正的挑戰的開始，因為「執行」才是實現應用。您可以劃分這一階段為以下幾個步驟:
執行：數據庫
創建一個新數據庫，寫SQL代碼定義表，屬性和關係。看看下面的，過去我致力於一些有關此主題的文章的鏈接，以獲取更多信息：
How to use PHP and SQL to create DB tables and relationships 怎樣使用PHP創建DB表和關係
Create tables and relationships with SQL 使用SQL創建表和關係
執行：HTML
使用在設計階段定義的頁面結構實施 HTML 代碼：
程序代碼
此時添加所有在設計階段定義的所需要的HTML元素。例如，如果mainContent部分包含一個標題，文字和文章的標籤後，添加這些內容：
This is the moment to add all HTML elements you need in sections identified during Design phase. For example if the sections mainContent contains a post with a title, a text body and post tags, add these elements:
程序代碼
實施：CSS
當主體結構已經準備就緒，開始編寫CSS代碼添加樣式。如果您需要一些如何撰寫更好的CSS代碼建議，請看看這些文章：
CSS coding: semantic approach in naming convention CSS編碼：語義的方法命名慣例
Useful guidelines to improve CSS coding and maintainability 有益的改善的CSS編碼和可維護性的指南
實施：服務器端語言
實施應用類，應用功能,DB互動，查詢，以及一切需要服務器端的實現的交互。
實施：JavaScript
使用在設計階段選擇的框架（ jQuery ， Scriptaculous ， MooTools …)來實施Ajax的功能（拖放，動畫效果… ）
4. 測試
在這一階段需要「強調」的是。你的應用程序能在各種條件下執行（例如使用不同的瀏覽器） 。您的目標是在最後釋放前檢測和修復所有的應用程序錯誤。
請記住，這一過程需要有條理，需要極大的耐心！試驗的每個頁面和每個功能（在這種情況下還可以幫助理順應用圖） 。如果您測試過程中發現一個bug ，修復它修改代碼並繼續進行最後的代碼審核（一個不可告人的測試）。
5. 發佈
最後你準備好發佈了！在測試文件夾中發佈並做最後的測試，假如一切都OK的話，那就進行最後的發佈吧。
在Scribd上，閱讀與下載此篇文章
下載 Woork Papers N1幻燈片 你需要知道的開發Web應用程序的結構化過程
英文原文：Structured process you must know to develop a web application
文章提供 BAYSTARS DESIGN網頁設計公司
這篇文章中，結構化過程的插圖可以幫助你運用簡化的方法更加節省時間更加有效的建立你的web開發程序。
下載 Woork Papers N1幻燈片 你需要知道的開發Web應用程序的結構化過程
工序的主要階段
一般的web應用程序開發流程分為五個主要的階段：
1、明確需求
2、設計
3、執行
4、測試
5、發行
規劃與跟蹤監測是一個「跨階段」的跟隨開發發展的過程，定義一個在項目執行期間你需要跟蹤監測的項目計劃活動名單，並且每項活動需要定義一套行之有效的信息報告來進行跟蹤監測，例如：
- 擁有者
- 持續的時間
- 所耗
- …
看一看這些前一段我所寫的文章，怎樣使用Excel或者Google製表軟件設計製作項目實施計劃：
How to organize a project plan 怎樣組織項目規劃
Excel Gantt chart template Excel圖表設計繪製模板
Implement a project plan and manage activities with Google Spreadsheets 使用google電子錶格實施並靈活管理項目規劃
1. 需求定義
在這第一階段你必須確定範圍和Web應用程序的需求，在你的應用程序中必須做的，主要特點和技術要求：
範圍
為了確定Web應用程序的範圍,足以編製一份明確說明適用功能的詳細清單。目前重要的不是「如何」實現他們，而是「什麼」需要實現！
需求
需求分析需求分析是一個開發過程的關鍵組成部分。在這一步中你需要估計潛在流量，選擇一個服務器端語言（ PHP， ASP， Coldfusion …),數據庫，選擇一個托管服務…這裡需要非常注意不要高估 /低估預期！準確的平衡的預估時間，成本和目標之間每件事情！
2. 設計
在需求定義階段，你需要明確的規劃「設計」你的應用。在這個階段，可以按照以下步驟：
設計：應用圖
應用圖包含對應用有意義的和必要的結構信息：頁面（用區塊表示）和他們之間的主要關聯。你的應用圖可以像這樣：
通過這種方式，您擁有了有關一些「位置」 （頁）和「路徑」 （關係頁）的圖，您可以非常容易的遵循它，逐頁，以執行應用程序的下一階段。運用這種方式，可以節省大量的時間，並明確什麼是你需要執行的。
設計：數據庫
Ok,現在到了設計數據庫的時候了。一個簡單的實現方法是使用實體關係（ER）模型 。一般來說，你可以俺咋好下面的順序：定義第一個表確定第一個表，而不是屬性和關係的表格。您的ER模型將是這樣的：
1:1表示集的關係（在這種情況下，例如1用戶只能分派1的任務， 1個用戶只生活在一個城市） 。欲瞭解更多有關這一主題的內容，來看看我的舊文章：
Define the entities-relationships model 定義實體關係模型
A correct approach to define relationships between database tables 正確對待，以定義數據庫表格關係
10 Useful articles about Database design 十篇有用的數據庫設計文章
設計：頁面結構
下一步工作是設計大體的頁面結構，用名稱命名確定所有的主要部分 (例如 #header, #navbar, #mainContent, #sidebar).
設計：服務端語言
使用面向對象的開發方法進行開發，你可以定義類，函數和所有你所需要的，記住… 那不是「執行」只是下一階段實施的「指南」.
設計：JS 框架
這一步選擇JavaScript 框架(jQuery, Scriptaculous, MooTools…), 通過確定主要的特點和所需實施的效果（拖放，動畫效果… ）編製簡單的關於在一個或多個網頁中有關聯的每一個具體功能應用圖的列表。
次點設計階段已完成。讓我們實施吧！
3. 實施
Ok.. 現在是真正的挑戰的開始，因為「執行」才是實現應用。您可以劃分這一階段為以下幾個步驟:
執行：數據庫
創建一個新數據庫，寫SQL代碼定義表，屬性和關係。看看下面的，過去我致力於一些有關此主題的文章的鏈接，以獲取更多信息：
How to use PHP and SQL to create DB tables and relationships 怎樣使用PHP創建DB表和關係
Create tables and relationships with SQL 使用SQL創建表和關係
執行：HTML
使用在設計階段定義的頁面結構實施 HTML 代碼：
程序代碼
此時添加所有在設計階段定義的所需要的HTML元素。例如，如果mainContent部分包含一個標題，文字和文章的標籤後，添加這些內容：
This is the moment to add all HTML elements you need in sections identified during Design phase. For example if the sections mainContent contains a post with a title, a text body and post tags, add these elements:
程序代碼
實施：CSS
當主體結構已經準備就緒，開始編寫CSS代碼添加樣式。如果您需要一些如何撰寫更好的CSS代碼建議，請看看這些文章：
CSS coding: semantic approach in naming convention CSS編碼：語義的方法命名慣例
Useful guidelines to improve CSS coding and maintainability 有益的改善的CSS編碼和可維護性的指南
實施：服務器端語言
實施應用類，應用功能,DB互動，查詢，以及一切需要服務器端的實現的交互。
實施：JavaScript
使用在設計階段選擇的框架（ jQuery ， Scriptaculous ， MooTools …)來實施Ajax的功能（拖放，動畫效果… ）
4. 測試
在這一階段需要「強調」的是。你的應用程序能在各種條件下執行（例如使用不同的瀏覽器） 。您的目標是在最後釋放前檢測和修復所有的應用程序錯誤。
請記住，這一過程需要有條理，需要極大的耐心！試驗的每個頁面和每個功能（在這種情況下還可以幫助理順應用圖） 。如果您測試過程中發現一個bug ，修復它修改代碼並繼續進行最後的代碼審核（一個不可告人的測試）。
5. 發佈
最後你準備好發佈了！在測試文件夾中發佈並做最後的測試，假如一切都OK的話，那就進行最後的發佈吧。
在Scribd上，閱讀與下載此篇文章
下載 Woork Papers N1幻燈片 你需要知道的開發Web應用程序的結構化過程
英文原文：Structured process you must know to develop a web application
文章提供 BAYSTARS DESIGN網頁設計公司
表格外觀的無序列表
參與測試的瀏覽器：IE6 / IE7 / IE8 / FF3 / OP9.6 / SF3 / Chrome2 操作系統：Windows 特別提示：這不是表格的模擬。表格無論在語義、結構，還是在效果實現上，都是無法替代的。本文只針對無序列表在外觀方面的一個特殊需求。別看有的東東長得個表格樣，其實是披著表格皮的無序列表，為了偉大的語義，我們需要用css實現表格外觀的無序列表。個人喜好，這裡採用border和negative margin來實現，非常簡單：
HTML代碼
表格外觀的無序列表 - 原始狀態
像一個表格吧？ ^-^
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]這是一個最簡單的模型，然而，實戰總是殘酷的：1、寬度如何自適應分辨率？ 2、單元格內容過多、形成換行如何處理？ 3、最糾結的問題：5×4的表格，如果只有17條數據怎麼辦？empty-cell也黯然失色…問題1：寬度如何自適應分辨率？這個問題也許有人說沒必要，但是在模塊化設計時，幾乎任何部件都被要求設置為寬度自適應模式的。解決1：參考完美的firefox3和ie8百分比寬度處理方案，給剩餘的寬度分配給某個「列」，就行了 ^-^記得二列等高的笨辦法嗎？——用背景圖片模擬。問題2：單元格內容過多、形成換行如何處理？解決2：隱藏吧，它已經沒有存在的價值了！（ - -! 其實是我想不出別的辦法來了）但為了體驗好一點，我加上了text-overflow。這個，FF暫時不支持……aoao有好的解決辦法，其他點的解決辦法。
HTML代碼
表格外觀的無序列表 - 過剩文字的處理
實際應用的時候，通過對單元文字長度範圍的預測、應用區域寬度的結合考慮，可通過調整列數來達到我們想要的效果。
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]問題3：5×4的表格，如果只有17條數據怎麼辦？empty-cell也黯然失色…看這個Demo，其實我覺得這個樣子不影響閱讀，也不難看了，可Boss和他的Money不樂意。
HTML代碼
表格外觀的無序列表 - 5×4的表格，如果只有17條數據怎麼辦？
其實我覺得這個樣子不影響閱讀，也不難看了，可Boss和他的Money不樂意。
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]解決3：首先讓我們製造出我們想要的表格（很遺憾，製造了很多空標籤，暫時沒有找到更合適的純CSS解決方案，歡迎大家多多指點）。
HTML代碼
表格外觀的無序列表 - 讓我們製造出我們想要的表格
很遺憾，製造了很多空標籤，暫時沒有找到更合適的純CSS解決方案，歡迎大家多多指點。
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]然後用position:relative實現css移魂大法：
HTML代碼
表格外觀的無序列表 - 用position:relative實現css移魂大法
HTML代碼
表格外觀的無序列表 - 原始狀態
像一個表格吧？ ^-^
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]這是一個最簡單的模型，然而，實戰總是殘酷的：1、寬度如何自適應分辨率？ 2、單元格內容過多、形成換行如何處理？ 3、最糾結的問題：5×4的表格，如果只有17條數據怎麼辦？empty-cell也黯然失色…問題1：寬度如何自適應分辨率？這個問題也許有人說沒必要，但是在模塊化設計時，幾乎任何部件都被要求設置為寬度自適應模式的。解決1：參考完美的firefox3和ie8百分比寬度處理方案，給剩餘的寬度分配給某個「列」，就行了 ^-^記得二列等高的笨辦法嗎？——用背景圖片模擬。問題2：單元格內容過多、形成換行如何處理？解決2：隱藏吧，它已經沒有存在的價值了！（ - -! 其實是我想不出別的辦法來了）但為了體驗好一點，我加上了text-overflow。這個，FF暫時不支持……aoao有好的解決辦法，其他點的解決辦法。
HTML代碼
表格外觀的無序列表 - 過剩文字的處理
- Prison Break / 越獄
- Gossip Girl / 八卦天後
- Friends / 老友記 / 六人行
- Heroes / 超能英雄
- Desperate Housewives / 絕望的主婦
- Sex and the City / 慾望都市
- Prison Break: Proof of Innocence / 越獄 第二季
- Lost / 迷失
- Grey's Anatomy / 實習醫生格蕾 / 格蕾的解剖
- Lie to Me / 千謊百計
- The Big Bang Theory / 天才理論傳 / 生活大爆炸
- Growing Pains / 成長的煩惱
- Prison Break (Season 3) / 越獄 第三季
- House M.D. / 怪傑醫生豪斯 / 豪斯醫生
- Ugly Betty / 醜女貝蒂
- Gossip Girl season2 / 八卦天後 第二季
- CSI: Crime Scene Investigation / 犯罪現場：拉斯維加斯
- Heroes(Season 2) / 天驕 / 超能英雄
- 24 / 24反恐部隊 / 24小時
- Cashmere Mafia / 女人幫
實際應用的時候，通過對單元文字長度範圍的預測、應用區域寬度的結合考慮，可通過調整列數來達到我們想要的效果。
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]問題3：5×4的表格，如果只有17條數據怎麼辦？empty-cell也黯然失色…看這個Demo，其實我覺得這個樣子不影響閱讀，也不難看了，可Boss和他的Money不樂意。
HTML代碼
表格外觀的無序列表 - 5×4的表格，如果只有17條數據怎麼辦？
- Prison Break / 越獄
- Gossip Girl / 八卦天後
- Friends / 老友記 / 六人行
- Heroes / 超能英雄
- Desperate Housewives / 絕望的主婦
- Sex and the City / 慾望都市
- Prison Break: Proof of Innocence / 越獄 第二季
- Lost / 迷失
- Grey's Anatomy / 實習醫生格蕾 / 格蕾的解剖
- Lie to Me / 千謊百計
- The Big Bang Theory / 天才理論傳 / 生活大爆炸
- Growing Pains / 成長的煩惱
- Prison Break (Season 3) / 越獄 第三季
- House M.D. / 怪傑醫生豪斯 / 豪斯醫生
- Ugly Betty / 醜女貝蒂
- Gossip Girl season2 / 八卦天後 第二季
- CSI: Crime Scene Investigation / 犯罪現場：拉斯維加斯
其實我覺得這個樣子不影響閱讀，也不難看了，可Boss和他的Money不樂意。
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]解決3：首先讓我們製造出我們想要的表格（很遺憾，製造了很多空標籤，暫時沒有找到更合適的純CSS解決方案，歡迎大家多多指點）。
HTML代碼
表格外觀的無序列表 - 讓我們製造出我們想要的表格
- Prison Break / 越獄
- Gossip Girl / 八卦天後
- Friends / 老友記 / 六人行
- Heroes / 超能英雄
- Desperate Housewives / 絕望的主婦
- Sex and the City / 慾望都市
- Prison Break: Proof of Innocence / 越獄 第二季
- Lost / 迷失
- Grey's Anatomy / 實習醫生格蕾 / 格蕾的解剖
- Lie to Me / 千謊百計
- The Big Bang Theory / 天才理論傳 / 生活大爆炸
- Growing Pains / 成長的煩惱
- Prison Break (Season 3) / 越獄 第三季
- House M.D. / 怪傑醫生豪斯 / 豪斯醫生
- Ugly Betty / 醜女貝蒂
- Gossip Girl season2 / 八卦天後 第二季
- CSI: Crime Scene Investigation / 犯罪現場：拉斯維加斯
很遺憾，製造了很多空標籤，暫時沒有找到更合適的純CSS解決方案，歡迎大家多多指點。
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]然後用position:relative實現css移魂大法：
HTML代碼
- Prison Break / 越獄
- Gossip Girl / 八卦天後
- Friends / 老友記 / 六人行
- Heroes / 超能英雄
- Desperate Housewives / 絕望的主婦
- Sex and the City / 慾望都市
- Prison Break: Proof of Innocence / 越獄 第二季
- Lost / 迷失
- Grey's Anatomy / 實習醫生格蕾 / 格蕾的解剖
- Lie to Me / 千謊百計
- The Big Bang Theory / 天才理論傳 / 生活大爆炸
- Growing Pains / 成長的煩惱
- Prison Break (Season 3) / 越獄 第三季
- House M.D. / 怪傑醫生豪斯 / 豪斯醫生
- Ugly Betty / 醜女貝蒂
- Gossip Girl season2 / 八卦天後 第二季
- CSI: Crime Scene Investigation / 犯罪現場：拉斯維加斯