iOS5的Safari速度測試

Apple的iOS5推出了一段日子，當大家都在討論電池損耗的問題外，其中一個比較少人關心的更新就是Safari了。其實Safari已經由iOS4的5.0版本更新到iOS5的5.1版本，作為網頁設計師， 筆者比較關心其處理網頁的速度，特別是處理HTML5的速度。New Relic公司在其BLOG上公布了測試報告，在隨機的3000個網頁程式中，新版Safari比舊版快一倍有多﹗而New Relic公司的特別程式測試(應該是專門測試大量Javascript的程式)中，更加快了近4倍﹗



有關的詳細數字可以到以下網誌查看︰
Is mobile browsing faster on iOS 5? Yes- it’s significantly better in our snapshot comparison

原文網址:
http://www.aveego.com/html/o_37498_/ios5的safari速度測試.html

jQuery網頁設計插件︰ Jquery Notification提示插件

今次介紹的jQuery網頁設計插件比較適合網頁程式(Web Application)使用，例如網頁管理系統(CMS) 這類經常需要顯示提示的系統，這個Jquery Notification 提示插件的功能就是在網頁的上方顯示不同顏色的提示訊息，在配合AJAX的使用下，就可以在不跳頁(Refresh-less)的情況下顯示執行結果。例 如在用戶打入登入資料後，瀏覽器只要通過AJAX去聯繫伺服器，再利用插件顯示結果就可以，不用再跳新一頁，大大提高使用者親和度(User Friendliness)。



使用方法十分簡單，先利用以下的語句導入jQuery﹑插件碼和有關的CSS。

再在需要的地方執行showNotification()就可以了。

插件支援不同的提示訊息類別(type)﹑自動關閉(close)和顯示時間(duration)，詳細資料可以到Jquery Notification 提示插件查看。

原文網址:
http://www.aveego.com/html/o_37472_/jquery網頁設計插件-jquery-notification提示插件.html

Firefox 8有關網頁設計的新改進

Firefox 8昨天正式提供給公眾下載，對一般用戶來說，最主要的新功能就是整合twitter到搜尋欄。但作為網頁設計師，每次瀏覽器更新總要看看有沒有跟網頁開發的新東西，今次算是比較失望的一次，兩個新增功能應該都不太會用到。

insertAdjacentHTML支援

第一個跟網頁開發有關的功能就是支援insertAdjacentHTML，這其實就是jQuery的before﹑prepend﹑append和 after的原始Javascript函數，由於筆者早就不會使用這麼低階的函數，故可以說是沒有任何用途。當然，由於瀏覽器直接支援，這極可能會令 jQuery未來版本在Firefox8上執行以上四個函數時比較快一點。

加強CSS hyphen的支援

很久以前在[英語系網頁設計的排版工具 Hyphenator]已經介紹過hyphen的用法，這對好像筆者一樣主要客戶都是中文語系的網頁設計師來說，意義亦是不大。

原文網址:
http://www.aveego.com/html/o_37463_/firefox-8有關網頁設計的新改進.html

css3網頁設計實驗室︰ 創意無限的動感型菜單

早前介紹<網頁設計實驗室: CSS3朦朧效果菜單>的作者Mary Lou又有新作品 - 創意無限的動感型菜單。作為網頁設計師，每一次看到這些漂亮的CSS3作品示範，就難免又期盼著將來90%的用戶都在使用新瀏覽器的日子﹗真的不厭其煩再說一次︰用戶們，升級呀﹗



今次實驗主要都要玩鼠標覆蓋(Hover)的效果，同樣是利用css3的transition和easing等最基本的css3技巧。老實說，技術層面來說，沒有什麼驚奇的地方，但不得不佩服網頁設計師Mary Lou的創意，實在是配合得太好了。

有興趣及已升級(筆者真煩!)的朋友，可以到Creative CSS3 Animation Menus一看。

原文網址:
http://www.aveego.com/html/o_37462_/css3網頁設計實驗室-創意無限的動感型菜單.html

jQuery網頁設計插件︰ jquery.hotkeys熱鍵控制

筆者介紹的jQuery網頁設計插件大都是控制圖像為主的，無它，因為網絡上本身就是最多這類插件，對一般的網頁設計師而言，這亦是最感興趣的，始終網頁程式或網頁系統的需求相對地少，主流的客人都是設計網頁居多。今次就特別介紹一個給網頁程式開發人員十分有用的jQuery網頁設計插件 - jquery.hotkeys熱鍵控制。

jquery.hotkeys的使用十分簡單，只要利用bind()把DOM元件聯結到有關的熱鍵和函數(function)就可以，例如以下的簡單程式便會令使用者按下Esc時彈出"You cannot escape!"的視窗。

jQuery(document).bind('keydown', 'esc', function (evt) {
  alert('You cannot escape!'); return false;
});

插件厲害的地方是不單止支援單一的按鈕，而且支援由多個按鈕組成的熱鍵，例如'alt+ctrl+z'，對網頁設計師來說可以想像的空間也很多，例如利用上下左右鍵來作簡單的移動等。

瀏覽器支援

IE6+
Firefox 1.5+
Safari3 +
Chorme 0.2+

jQuery支援

jQuery1.4.2+

原文網址:
http://www.aveego.com/html/o_37461_/jquery網頁設計插件-jquery-hotkeys熱鍵控制.html

jQuery 1.7 正式推出

現在大部份網頁設計師都應該或多或少在使用jQuery，而jQuery剛剛推出了1.7版本，效能又再提升。



這次版本增加了不少API，大家可以到jQuery API 1.7列表查看。

重大更新

1. 新事件API: .on() 及 .off()
2. Delegate事件效能提升，根據jQuery的數據，1.7版本比1.6.3快了一倍
3. 增強在ie6/7/8的html5支援
4. 修正動畫系列的toggle
5. Asynchronous Module Definition(AMD)
6. jQuery.Deferred
7. jQuery.isNumeric()

有關的詳細資料，請到jQuery Blog - JQUERY 1.7 Released查看。


原文網址:
http://www.aveego.com/html/o_37393_/jquery-1-7-正式推出.html

jQuery網頁設計插件︰jQuery Waypoints

今次介紹的jQuery網頁設計插件是jQuery Waypoints，功能非常簡單好用，就是當瀏覽器捲動到有關的dom元件，就會啟動你需要的程序碼。基本上所有的dom元件都可以使用，以下的簡單編碼就會使瀏覽器捲動到有關的h1標題時彈出警告了。

$('h1').waypoint(function() {
  alert('h1 is here!');
});

瀏覽器支援

IE6+
Firefox 3+
Safari4 +
Chorme 6+
Opera 11

jQuery支援

jQuery1.4.3+

另外插件的官方網頁亦有多個有趣的示範，有興趣可以一看。


原文網址:
http://www.aveego.com/html/o_37383_/jquery網頁設計插件︰jquery-waypoints.html

網頁設計實驗室: 超酷的css3鼠標覆蓋效果

今次介紹的是Alessio Atzeni的Original Hover Effects with CSS3，就是利用css3來製造鼠標覆蓋時的超酷效果。若果大家喜歡上次網頁設計實驗室: CSS3朦朧效果菜單的效果，今次介紹的比上次更加漂亮，絕對比以前用flash做的效果更加賞心悅目。由於是大量利用css3，所以記謹要使用新版本的瀏覽器。

作為網頁設計師，筆者最欣賞的就是其簡單的技巧，基本上都是利用css3的 translate﹑rotate和scale，再加上不同的transition效果和時間，但配合起來就變得十分精彩了，筆者在日後將會多介紹一下 css3，希望能夠推動一下，當然也希望大家儘快升級瀏覽器。



原文網址:
http://www.aveego.com/html/o_37382_/網頁設計實驗室--超酷的css3鼠標覆蓋效果.html

Jquery網頁設計插件 Portamento 浮動菜單

假如網頁設計得有一定長度的話，一個跟著使用者移動的浮動菜單會很好用。今次介紹的Jquery網頁設計插件就是幫助大家簡單地做到這效 果，Portamento只需要簡單的css和一句Javascript，無論是用float或absolute的版面設計也支援。另一個特別的地方是大 家可以設定浮動的底線，菜單永遠不會超越該底線。

瀏覽器支援︰
IE 7+
Firefox 3+
Safari 4+ (non-iOS)
Chrome 4+
Opera 10

詳細的使用方法及示範可到portamento一看

原文網址:
http://www.aveego.com/html/o_36713_/jquery網頁設計插件-portamento-浮動菜單.html

Chrome有機會在今年內趕過Firefox成第二大瀏覽器

根據愛爾蘭數據公司StatCounter的最新公佈，Chrome有機會在今年內趕過Firefox成第二大瀏覽器，逐步挑戰IE的領導地位。

截至本週三，各大瀏覽器的市場分佈如下︰
IE 41.7%
Firefox 26.8%
Chrome 23.6%

去年Firefox和IE分別被Chrome搶去4%，若果今年的走勢持續，大約在本年十二月，Chrome便極有可能取代Firefox成為第二大瀏覽器，只用了短短3年時間，確實驚人﹗

另外二大網頁設計師的惡夢，IE6及IE7則分別跌至9.7%和6.3%，個人當然希望兩老儘快從人間消失，我實在不希望再特別為兩老作CSS HACK的特別招待了。

原文網址:
http://www.aveego.com/html/o_36721_/chrome有機會在今年內趕過firefox成第二大瀏覽器.html

Facebook Timeline如期推出

f8開發者大會閃亮登場的Facebook Timeline在即將全面推出的時候，突然被Timeline.com控告，推Facebook不單損害其商標並提供類似的服務，要求Facebook停止推出Facebook Timeline。

當大家都以為Facebook Timeline會因此推出無期之際，有消息指聯邦法院已否決Timeline.com的臨時禁制令，相信Facebook會在一星期內全面推出 Facebook Timeline。不過最新Facebook的網頁設計改版，筆者收到的都是負面評價居多，不知Facebook Timeline能否受使用者歡迎，在Google+的大力追擊下，這樣的大改革相信還是會陸續有來，大家可以預期Facebook的網頁設計版面將不斷 左改右改。

原文網址:
http://www.aveego.com/html/o_36802_/facebook-timeline如期推出.html

Firefox網頁設計插件ColorZilla 2.6發放

早前介紹過之網頁設計師必備的顏色選擇器ColorZilla，昨天推出了2.6版本，最主要是針對新版Firefox，按鈕位置從狀態列(Status Bar)轉到上方的插件列(Add-On Bar)。另一個改變就是在點擊顏色後，顏色數值(比如RGB)會自動複製到剪貼簿(Clipboard)，的確是一個十分貼心的改進。



有關詳情可到Colorzilla專頁查看。

原文網址:
http://www.aveego.com/html/o_36807_/firefox網頁設計插件colorzilla-2-6發放.html 

PHP圖像處理程式庫 - Zebra_Image

PHP相信是現在最常用的網頁設計開發程式，若果要處理圖像，我們大都會直接使用GD Library，不過GD提供的都是比較低階(Low Level)的處理，若果做一些如裁剪大小等常用程序，用起來就比較麻煩了。假如你是一個不喜歡看太多程式碼的網頁設計師，今次介紹的絕對適合你。

Zebra_Image是 開源的PHP圖像處理程式庫，程式庫本身是物件導向(Object Oriented)的，用起來十分方便，提供變更大小﹑裁剪﹑旋轉和左右反轉的操作。Zebra_Image基於GD2，故支援GIF﹑JPEG和PNG 檔。其中一個最大的優點就是提供一個名為ZEBRA_IMAGE_CROP_CENTER的操作，可以在不改變圖的長寛比例下，把一幅大圖縮小到你需要的 長寛。

原圖 (614px x 461px)


縮圖 (300px x 300px)


看到特別之處嗎？縮圖是由圖的中心開始向外擴展的。

原文網址:
http://www.aveego.com/html/o_36819_/php圖像處理程式庫---zebra-image.html

Mozilla計劃自動更新Firefox

Mozilla將會改變發表新版Firefox的方法，新方法會類似Google Chrome的做法，更新會自動下載及安裝，整個過程會在背景靜悄悄進行，完全不需用戶確認。這個新的更新政策由Mozilla Foundation的主席Mitchell Baker在她的Blog中公布，不過新政策最快都要在2012頭Firefox 10才會使用。



這種靜悄悄更新在Google Chrome十分成功，因為Google Chrome有其獨特的壓縮技術Courgette，每次更新都只需下載一小部份更新碼就可以，過程非常快速。以最新的190.1->190.4為例，一個全新的下載需要10MB左右，但經Courgette更新則只需要70k左右，非常厲害。

其實這類更新對我們網頁設計師來說絕對是喜事，不竟用戶愈快更新到最新最安全的瀏覽器會省掉我們大量的時間，要向下兼容一些舊版瀏覽器絕對是苦事。若果Microsoft可以加入這類靜悄悄更新到IE，肯定是天大喜訊，可惜這可能比筆者中六合彩的機率還低…

原文網址:
http://www.aveego.com/html/o_36827_/mozilla計劃自動更新firefox.html

Google現在會直接顯示你的IP地址

相信很多人都不時會查看自己的IP地址，其中一個很多人做的動作就是在Google打入"what is my ip address"，然後點擊在第一位的網址。現在不再需要這樣做了，因為Google會直接顯示你的IP地址。



暫時這項功能只在google.com出現，在google.com.hk還沒有實行，根據經驗，相信3個星期後便會登陸。

這當然是方便了我們一眾用戶，但相信whatismyip.com就慘了，一定會流失大量的搜尋引擎導引流量，辛辛苦苦花的SEO時間一夜就沒了﹗作為網頁設計及SEO從業人員，我深深感受到這種痛苦，並深表同情。

原文網址:
http://www.aveego.com/html/o_37173_/google現在會直接顯示你的ip地址.html 

jQuery網頁設計插件︰ 趕上潮流玩Timeline

自從Facebook公布會推出Facebook Timeline之後，大家都突然對這個時間線玩意很有興趣，今次趕上潮流介紹一個Timeline的jQuery插件，支援垂直及橫向的時間線，比較特別的是左面的圖示會漸漸放大，雖然技術上不難做到，但整體配合上來十分悅目。下次若果有網頁設計客戶需要做一個公司歷史，不妨考慮一下使用這個jQuery Timelinr。

橫向時間線


垂直時間線


原文網址:
http://www.aveego.com/html/o_37244_/jquery網頁設計插件-趕上潮流玩timeline.html

各大網頁瀏覽器硬體加速淺談

大家有玩電腦遊戲的話都會知道一張好的顯示卡有多重要，因為大部份的圖像處理都會直接交給顯示卡的處理器GPU，CPU的負載就會大量減少了。新一代瀏覽 器都在開發類似的技術，將網頁的顯示工作交給GPU處理，而Firefox和Chrome都已經支援WebGL的硬體加速了。不過WebGL的網頁並不普 遍，故此大家都沒有特別感受到有甚麼分別。今次Opera則宣布在Opera 12 Alpha中 將會儘可能利用所有可能的硬體加速，即是一般的網頁亦會受惠。筆者認為這亦會是各大瀏覽器的下一個主戰場，IE在這方面其實比較領先，IE9已經利用 Direct2D來作硬體加速，Chrome和Firefox在這方面則仍在實驗階段，大家有興趣可以根據以下的步驟開啟硬體加速。

Chrome:
在地址打入about:flags
然後Enable "GPU compositing on all pages"和"GPU Accelerated Canvas 2D"



Firefox:
在地址打入about:config
gfx.direct2d.force-enabled的Value改為true

隨著瀏覽器的硬體加速日漸，網頁設計師可以做的亦更多，以下是幾個測驗硬體加速的示範︰
http://webglsamples.googlecode.com/hg/aquarium/aquarium.html
http://webglsamples.googlecode.com/hg/field/field.html
http://webglsamples.googlecode.com/hg/collectibles/index.html
http://demos.hacks.mozilla.org/openweb/HWACCEL/
http://cooliris-wall.appspot.com/

原文網址:
http://www.aveego.com/html/o_37245_/各大網頁瀏覽器硬體加速淺談.html

PSD網頁設計素材: 霓虹燈文字效果

今次介紹的PSD網頁設計素材來自pixeden.com，可以簡單做出霓虹燈文字效果，以下是原作者的示範圖，很漂亮吧﹗



由於是全部圖層都是矢量(Vector)，故此可以無限量放大﹗圖層的分佈亦十分清晰，修改起來真的十分方便。



筆者簡簡單單的改了公司的名字和服務，很快就做出了以下的效果了。



字型原作者的網頁並沒有提供，筆者從網路上找到了，大家可以在以下的網址下載︰
Hero Font
LunaBar Font

跟上次介紹的iPhone 4S Photoshop矢量圖一樣，無論商用或個人都是Royalty Free﹗

下載︰
http://www.pixeden.com/photoshop-text-effects/psd-neon-text-effect-photoshop

原文網址:
http://www.aveego.com/html/o_37309_/psd網頁設計素材-霓虹燈文字效果.html 

解構 Apple iPhone 動態網頁

隨着 Apple iPhone 4s 推出，其 iPhone 網頁 亦以新面目示人。大家見到其亮麗而簡潔的換頁效果，甚有 iOS 介面的風格，而且在 iPhone / iPad 上亦可正常顯示。如何做到類似的設計？如果在幾年前，答案只有一個，就是 Adobe Flash。

不過大家都知道 iOS 根本不支援 Flash ，現在見到的動態網頁完全用 CSS 腳本編成。早前就有一個示範，清楚說明頁面上物件的動向。



利用HTML5 和 CSS 等新編譯技巧，可以做出無論在何款平台上都能正常顯示的動態網頁，方可稱得上符合真正的 Web2.0 標準。


原文網址:
http://www.aveego.com/html/o_37310_/解構-apple-iphone-動態網頁.html

Google Map將會向高使用量網站收取費用

Google Geo Developers Blog剛 確認，Google Maps API將會在2012年初開始向高流量使用者收費。Google仍然會提供每日25000次的免費地圖顯示，但之後的每1000次地圖顯示就收費4美元。 這可能是Google的長遠策略，向高使用量的使用者收取費用以補貼低用量用戶。真正高用量的企業亦可以考慮使用Google Maps API Premier，每年收費10000美元。

對於網頁設計公 司來說，問題不大。首先客戶真正需要用上Google Maps API的情況不是很多，主流的使用方法都是把客戶的公司地圖以iframe形式連結，這些的方法Google起碼在短期內都不會收費。另一個問題就是使用 量的問題，對大部份的客戶來說，每天25000次顯示是不可能出現的數字，根本不用擔心。

對一些大型網站，例如本地飲食網站Openrice，相信往後的營運費用會大增，當然以Openrice的瀏覽量，單靠廣告收入相信已可輕鬆應付。若果真的需要完全免費，大家亦可考慮OpenStreetMap。


原文網址:
http://www.aveego.com/html/o_37357_/google-map將會向高使用量網站收取費用.html

網頁設計實驗室: CSS3朦朧效果菜單

由於用戶升級瀏覽器的行動始終都比較慢，故相信我們可以安心使用CSS3的日子仍然非常漫長，但一眾網頁設計師已忍不住嘗試利用新的技術去制作更亮麗的效果。今次介紹的是CSS3朦朧效果菜單，由於大量使用了CSS3，故大家希望欣賞的話，就要更新瀏覽器了﹗



原作者Mary Lou主要是把菜單先朦朧化(Blur)，而當mouse over的時候把菜單變回正常實色。朦朧化的效果在CSS3十分容易，只要把color設定為transparent，然後再調較text-shadow 就可以，而狀態轉換的動畫當然就利用transition及easing了。

雖然大致上都是利用相同的技術，但配合起動的確十分悅目，相比用Flash做菜單當然簡單很多，而且最重要是得到硬體加速，運行起來十分順暢。

筆者作為網頁設計師，真的希望更多大公司可以徹底不支援舊版瀏覽器，好逼使各大用戶快快升級﹗


原文網址:
http://www.aveego.com/html/o_37359_/網頁設計實驗室-css3朦朧效果菜單.html 

網頁設計應如何應付使用者轉動iPhone及iPad

蘋果裝置始續大賣，網頁設計公司近來收到客戶要求對iPhone和iPad進行網頁設計優化的聲音也增加不少，最簡單的做法當然是特別根據iPad或iPhone的闊度去設計網頁，但由於用戶可以隨時轉動iPhone及iPad，網頁設計師應該怎樣應付呢？今次介紹的網頁就正正幫助大家解決這個問題。



原作者Matthew James Taylor在iPad CSS Layout with landscape / portrait orientation modes的意念是先鎖定Safari的viewport大小，防止自動放大縮小，再利用不同的CSS去調較網頁闊度。

首先，在header中放入以下的代碼︰

在css設定正常的闊度1024px，然後再利用css的media query去處理橫放的iPad，css如下︰

/*normal styles here */
#wrap {
  width:1024px;
}
@media only screen and (orientation:portrait){
/* portrait styles here */
  #wrap {
    width:768px;
  }
}

簡直精彩﹗完全不需要Javascript﹗不過這個作法只在iPad有效，要真正兩者兼容，筆者暫時只懂得javascript的做法，詳情作法下次再談。



原文網址:
http://www.aveego.com/html/o_37369_/網頁設計應如何應付使用者轉動iphone及ipad.html

iPhone及iPad專用Gmail App殺到

殺到來了﹗iPhone及iPad專用Gmail App殺到﹗Google正式推出iOS Gmail App，以後在iPhone及iPad使用Gmail將會更方便﹗

Gmail的產品經理Matthew Izatt在網誌表示，新的Gmail App特別針對觸控式屏幕而設，而且全面支援iOS的提示功能，絕對為流動電話度身訂造﹗



一般在瀏覽器有的功能如打星﹑標記和封存都包括在內。由於是原生App的關係，搜尋電郵將會更快，而且可以簡單地夾送電話內的相片，這個功能好像比iPhone本身的Mail更好用。

不過暫時好像不支援多個戶口，筆者作為網頁設計師當然要測試一下其HTML電郵的處理，暫時好像問題不大，筆者也是在測試階段，大家有什麼發現不妨留言討論。




原文網址:
http://www.aveego.com/html/o_37370_/iphone及ipad專用gmail-app殺到.html 

2011 網上行銷調查報告

搜尋優化 Vs 社交媒體 Vs 付費點擊

如果問在互聯網上有什麼有效的行銷推廣方法，相信說搜尋引擎優化 (SEO) ，買各關鍵詞的點搫付費 (Pay-per-click) 廣告，以及近年大熱的社交媒體行銷 (Social Media Marketing) 幾個答案的話没有人會有異議。時間及金錢許可的話自然最好可以三管齊下，買盡相關keyword ，覆蓋各大平台。不過現實總有取捨，選擇投入多少資源，於何種方式，以致用哪一個社交網站都是行銷計劃中不可缺少的部分。

有見及此，美國一間網上行銷公司就於今年九月舉辦了一個問卷調查，詢問行銷人員對各網上推廣方式之意見，問題包括推廣成效是否達到計劃預期，能否為公司帶 來新的客戶及生意額，以及對來年行銷預算之展望等。此問卷調查收到超過五百份的回應，函蓋公司的規模由草創團隊到千人企業，其中業務屬B2B (Business-to-Business) 的占三分之二，B2C (Business-to-Consumer) 為三分之一。

B2B B2C 行銷目的取向迴異

調查報告指出，B2B 和 B2C 企業對網上行銷自計劃目標起已有不同之取向：
B2B 公司多以”開發潛在客戶”為主要目標 (46%)，以”增加營業額”為行銷目標的公司數目其次 (22%) 。
於B2C 企業情況相反，最多是以”增加營業額”為最重要 (40%) ，之後才是”開發潛在客戶” (23%) 。
另外，分歧亦出現於對”提升網站人流”一點：逾17% B2C 企業視此為首要任務，而同等重視網站人流的B2B 企業只有 11% 。
筆者相信原因在於B2B 商務都有銷售 (Sales) 團隊直接聯絡相對較少的客戶群；對於要接觸廣大消費者的 B2C 企業，市場行銷 (Marketing) 是最有效的途徑。

不過，對於量度計劃成效，回應者一致認為網站人流，以及網站點擊率是最有效反映推廣計劃成效的指標。此外就是在營運層面去量度潛在客戶或營業額之增長幅度。可見網站流量分析除了是網頁設計的重要部份，亦是市場推廣部門必要的工具。

SEO 最有效帶來新客源

而對哪一網上行銷方法最有效帶來新客源，商務及消費企業亦有一致意見：搜尋引擎優化 (SEO) 是最能引來潛在客戶，點搫付費 (Pay-per-click) 廣告次之，社交媒體行銷 (Social Media Marketing) 最少。B2B 商務企業比 B2C 企業更認同 SEO 之效用，相比而言 B2C 企業會更多採用付費廣告及社交媒體。

圖一：B2B 及 B2C 對各網上行銷方式效力評價

社交媒體平台選擇

由於 Google+ 的正式推出日期已是九月下旬，調查報告中並未能做到有效的比較，社交平台方面只是顯示了 Facebook, LinkedIn, Twitter 三個開通已久的選擇。其中在 B2C 企業的回應中 Facebook 認受性一支獨秀，是四分三回應者所選的最活躍網路。在商務企業方面 Facebook 雖然佔優，不過已經没有一面倒的情況，三個平台的活躍程度接近。要留意的是回應＂完全無使用社交媒體＂的公司平均只餘下一成，果然做生意不能不 Social。

圖二：最活躍社交網絡分佈

有人氣又是否代表有生意？

Facebook Wall 上有大量 Like , 極多用家互動又是否能轉化為現金流？報告指出社交網絡的確有助開拓客源，高達 77% 有利用社交網絡的 B2C 公司認同社交網絡帶來商機。比例上仍是 Facebook 最多，不過其實應該要留意 Twitter 微博： 8.4% 活躍度帶來 40% 新商機，效率其實比 Facebook 要好。相信其中很大部分會是正面互動而做成的正循環：成為客戶＞在社交網絡互動＞再次引起購買意欲。

在 B2B 方面情況有一點落差：只有六成半的回應者發現社交網絡可以帶出新商機，而在比例上又以商務定位的 LinkedIn 最有效。

圖三：社交網絡市場開拓力比較。


綜括而言，有超過三分之二的行銷人員有從社交網絡中帶出新客路，而有五成半回覆確認社交網絡帶來成交，可見投資在社交網絡上的資源是會有回報的。而且現時有八成半的受訪公司只是用內部人手就達到成效，比起其他方式更適合資源不多的中小企。

2012 年行銷預算

現時大部份的受訪企業都將預算用於搜尋引擎優化 (SEO) 及點搫付費 (Pay-per-click) 廣告兩大項目上。被問及來年預算時，有六成回應會增加社交媒體行銷 (Social Media Marketing) 的投放，打算加大搜尋引擎優化 (SEO) 預算的也超過一半。唯付費廣告增長之勢較弱：一半回應會保持現狀，有 9.3% 說會減少 PPC 的投資。而回應公司對＂整合跨類型推廣策略＂的資訊的興趣，大概各推廣人員都希望像本文開首說的＂多管齊下＂吧。

如果各位對本文提到的2011 網上行銷調查報告有興趣，可以到該公司的網頁登記下蛓。




原文網址:
http://www.aveego.com/html/o_37377_/2011-網上行銷調查報告.html

5個相信是最經典實用的jQuery網頁設計插件

早前介紹過一系列的jQuery網頁設計插件，可能有很多讀者都會覺得花巧，今次筆者就為大家介紹自己經常用到的經典實用插件。



jQuery Easing Plugin
主要用於控制速度，通常是動畫的移動速度或效果的轉變速度，相信是jQuery最多跟其他插件合件使用的一個。

Mouse Wheel Extension
控制滑鼠的捲動，是Brandon Aaron在jQuery早期就已經寫好的經典。

jquery-cookie
幫助大家簡單處理cookie的插件，又是一個比較早期就寫好的經典。

jquery.validate
要替表單做驗証就找它，筆者近乎每個項目也在用。

jQuery LightBox
這個應該不用多介紹了，這個雖然是經典但到現在功能已經比較落後，筆者現在主要都是用prettyPhoto

筆者暫時只想到這幾個jQuery網頁設計插件，大家有什麼經典不妨留言提議，謝謝﹗


原文網址:
http://www.aveego.com/html/o_37381_/5個相信是最經典實用的jquery網頁設計插件.html

Adobe最新令人驚訝執圖技術 - Unblur

今日在網上發現了這個有關Adobe最新執圖技術的Video，最初還以為是一些簡單的Undo技術，誰知一看之後簡直目瞪口呆。廢話少說，大家自己看看﹗


是不是很厲害？就像電影一樣﹗對於筆者這些每天都基本上對著Photoshop工作的網頁設計師來說，簡直想立刻打電話去Adobe預訂一套﹗不過據筆者所了解，Adobe沒有提及這個Unblur的功能會何時及在那個產品附送，執相的同事請忍耐多一陣子﹗

原文網址:
http://www.aveego.com/html/o_36891_/adobe最新令人驚訝執圖技術---unblur.html 

2012年潮流設計顏色

2012年的網頁設計會興什麼顏色現在當然不知道，但時裝界的2012年潮流顏色就已經公布。Pantone剛公布了時裝界在2012年春季的十大顏色，筆者雖然不是時裝設計師，但相信網頁設計的顏色或多或少會受時裝界的潮流影響，由於公布的是Pantone色碼，筆者亦特別列出有關的rgb值，以方便大家。

2012春季女性系列的十大顏色:

PANTONE 17-1463 Tangerine Tango (#FE2B13)
PANTONE 13-0759 Solar Power (#FFC71A)
PANTONE 18-3628 Bellflower (#966EAA)
PANTONE 18-2140 Cabaret (#E1327C)
PANTONE 19-3953 Sodalite Blue (#0C1652)
PANTONE 14-0116 Margarita (#B6CC94)
PANTONE 14-2808 Sweet Lilac (#F1C7DD)
PANTONE 14-5420 Cockatoo (#7CCCBF)
PANTONE 18-1210 Driftwood (#827772)
PANTONE 16-1120 Starfish (#AA8C5D)

2012春季男性系列的十大顏色:

PANTONE 18-3949 Dazzling Blue (#1E499E)
PANTONE 16-0205 Vintage Khaki (#958470)
PANTONE 19-2039 Granita (#B40244)
PANTONE 17-4540 Hawaiian Ocean (#0890AB)
PANTONE 16-1120 Starfish (#AA8C5D)
PANTONE 17-1463 Tangerine Tango (#FE2B13)
PANTONE 19-3953 Sodalite Blue (#0C1652)
PANTONE 13-0759 Solar Power (#FFC71A)
PANTONE 15-4307 Tradewinds (#77777F)
PANTONE 15-6437 Grass Green (#7BC560)

原文網址:
http://www.aveego.com/html/o_36842_/2012年潮流設計顏色.html

jQuery網頁設計插件: Color Picker顏色選擇器

假如你的網頁管理系統(cms)支援產品的話，可能也有需要用戶輸入有關的顏色，筆者早年的做法是訂立一定數量的顏色選項放在下拉式菜單(pulldown menu)，不過這個做法通常都不夠用，但要求用戶輸入rgb值又不太友好，今次介紹的jQuery網頁設計插件正好解決這個問題。只要把Color Picker連到所需的input，當有關的input被點選就會下圖的顏色選擇器，用戶無需輸入rgb值，只要點選所需顏色就可以了。

瀏覽器支援︰

(原作者沒有特別說明，筆者只簡單測試以下瀏覽器)
IE 7+
Firefox 3+
Safari 4+ (non-iOS)
Chrome 4+

版權宣告︰

MIT和GPL

詳細的使用方法及示範可到Color Picker一看



原文網址:
http://www.aveego.com/html/o_36942_/jquery網頁設計插件--color-picker顏色選擇器.html

適合各類設計用的iPhone 4S Photoshop矢量圖

無論你喜歡與否，大家還是不斷地被iPhone 4S的新聞淹沒。沒辦法，在這一刻Apple就是潮流﹗筆者是網頁設計師，要找iPhone的圖去做Mockup不太難，因為網頁對像素的要求不高，但相信廣告設計師就頭痛了，要找一張高像素的iPhone圖不是一件易事。今次介紹的iPhone 4S Photoshop檔絕對是大家的恩物，因為它是矢量圖，所以可以無限制地放大﹗

筆者隨手改了幅圖，只可以說是爽呀﹗最重要是無論商用或個人都是Royalty Free，原創者也實在是太慷慨了﹗



下載︰
iPhone 4S Photoshop矢量圖

原文網址:
http://www.aveego.com/html/o_37143_/適合各類設計用的iphone-4s-photoshop矢量圖.html