<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>mr.mu設計工作室 &#187; 網站設計</title>
	<atom:link href="http://www.mrmu.com.tw/category/webdesign/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.mrmu.com.tw</link>
	<description>網站設計,珠寶,飾品美學,金工,設計,生活</description>
	<lastBuildDate>Sun, 16 May 2010 01:03:57 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.5</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Drupal 6多國語言網站設定-使用i18n模組支援多國語系切換</title>
		<link>http://www.mrmu.com.tw/2010/05/15/drupal-6-i18n/</link>
		<comments>http://www.mrmu.com.tw/2010/05/15/drupal-6-i18n/#comments</comments>
		<pubDate>Sat, 15 May 2010 10:31:46 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[Drupal開發]]></category>
		<category><![CDATA[PHP程式設計]]></category>
		<category><![CDATA[網站設計]]></category>
		<category><![CDATA[Drupal]]></category>
		<category><![CDATA[drupal 6]]></category>
		<category><![CDATA[drupal 模組]]></category>
		<category><![CDATA[多國語系]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1394</guid>
		<description><![CDATA[因為Drupal的設定很繁雜，所以很容易有見樹不見林或迷路的感覺，甚至突然不知道自己現在在設定什麼東西XD，或者不知道設定的意義在哪。本文除了作為筆記之用，也順帶註記一些個人覺得也許有用的說明，希望看倌們能比較容易理解。
預設的Drupal網站，有提供基本的「語系」設定及「語系翻譯」功能，可以讓有權限的使用者進入後台，進行設定網站的語系(新增語系、設定本站預設語系…等)，另外也可以匯入/匯出特定語系的翻譯檔，或針對未翻譯完整的語系進行翻譯。預設的語系功能，都是躲在後台玩的，如果要讓一般訪客都能在前台切換語系呢？安裝及設定相關模組就能達成。
安裝 Internationalization 相關模組
要讓Drupal網站前台可以提供多國語系切換的功能，可以安裝 Internationalization 模組 並進行相關設定來完成。本篇的測試環境是使用Drupal 6.16，並已安裝正體中文的翻譯，而且是以正體中文為預設語系。我們就先來介紹這個模組。
Internationalization (又稱 i18n,取internationalization字頭i及字尾n，18表示中間有18個字母) 模組是非常知名的多國語系模組，除了安裝i18n另外再安裝下列相關的推薦模組，就可以有一個基本的多國語系設定環境了：
* Language Icons, 可以在節點或區塊的內的語系連結前加上國旗小圖示。
* Translation Overview, 可擁有一個複合的檢視區域，來檢視內容翻譯的狀態。
* Localization Client, 直接看畫面上的字來手動翻譯，方便快速。
安裝完這些模組後，前台不會有什麼變化，因為我們還需要在後台管理頁面進行一些設定，現在我們先啟用這些模組，待會再說明設定的部份(下圖只有部份選項，請勾選想要使用的項目)。
接著要做的事是把想在網站上提供給訪客切換的各國語系都新增並且設定好。要完成這些動作只要設定預設的後台管理項目即可。
設定網站預設的語系項目
預設後台管理項目中，有兩個跟語系相關的項目，分別是：
1.「網站設定 / 語系(language)」：
這裡列出整個網站所有支援的語系，我們可以在這裡面選擇增加語系來加入任一個國家的語系(也能自訂語系)，但加入語系後，它裡面的翻譯是空的，必須透過「網站建置 / 翻譯語系」來加入該語系的翻譯資料，接著就來談談這個頁面。
2.「網站建置 / 翻譯語系(translate)」：故名思義就是翻譯各語系在drupal網站介面上的文字，這些文字跟網站上的內容沒有太大關係，純粹是一些管理項目、預設標題、模組介面文字等，這裡可以針對目前網站已增加的語系，來進行翻譯。而這裡也提供匯入/匯出 PO檔，與搜尋的功能－可過濾出未翻譯好的文字，讓我們可以自行翻譯 (正體中文與簡體中文的翻譯包連結在此 http://drupal.org/project/translations?text=chinese)。
現在我們先把網站想支援的語系都新增進來，並且找到各語系的翻譯包安裝好，接下來才是主要的設定。
1. 請到「網站設定 / 語系」裡的「設定」分頁，勾選「僅使用路徑前導字元」項目即可 (各項目的意思頁面上都有註記)。
2. 請到「網站建置 / 區塊」，設定「語系切換」區塊的出現區域(region)，例如：左欄。
3. 完成了，如果設定左欄，應該會出現各種語系的連結項目。
現在一般的使用者可以從前台切換drupal網站的語系了，但是這些語系是網站系統的翻譯，我們發表的各種內容節點如果也想要設定多國語系，那麼還要做一點設定。
設定內容節點的翻譯
1. 請到「內容管理 / 內容類型(content type)」管理頁，選擇您想啟用翻譯功能的內容類型，如：一般文章(story)，這表示我們想要讓所有屬於一般文章的節點都能有多國語系。點選該內容類型後方的「編輯」連結。
2. 點選「編輯」進入後，在「工作流程設定」內啟用「多國語系」，請選「已啟用翻譯功能」(單選「啟用」，我們只能為內容節點指派特定的語系，但不能額外為內容進行多國語系翻譯)，最後儲存內容類型。
完成以上設定後，在編輯該內容類型的節點時，會多出一個「語言」下拉方塊，可選擇「語系中立」或某特定語系，語系中立表示該內容不受語系切換的影響，永遠都會是現在的內容。而選擇特定語系如設定英文 (為某內容節點設定「英文」表示我們判斷它的內容是屬於英文語系，這內容就只會出現在英文語系中)，我們就能進入「翻譯」分頁 (語系中立就不會出現翻譯分頁)，來設定各種網站目前支援的語系內容。
還想設定更多東西嗎？
「內容管理 / Translation overview」 和 「Translator assigments」都是針對內容節點翻譯提供的功能，可以看看網站翻譯了多少內容。
如果對語系切換連結預設的小圖示不滿意，在「網站設定 / 語系」裡的「Icons」分頁，能設定各語系的小圖示。
而內容節點的語系呈現部份，可以到「網站設定 / 語系」裡的「Multilingual system」分頁進行設定。
另外，在「內容管理 / [...]]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/05/15/drupal-6-i18n/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Drupal 7版型開發(theming)與Drupal 6的不同(下)</title>
		<link>http://www.mrmu.com.tw/2010/05/08/drupal-7-theming-different-2/</link>
		<comments>http://www.mrmu.com.tw/2010/05/08/drupal-7-theming-different-2/#comments</comments>
		<pubDate>Sat, 08 May 2010 05:41:13 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[Drupal開發]]></category>
		<category><![CDATA[PHP程式設計]]></category>
		<category><![CDATA[介面設計]]></category>
		<category><![CDATA[網站設計]]></category>
		<category><![CDATA[Drupal]]></category>
		<category><![CDATA[Drupal 7]]></category>
		<category><![CDATA[版型開發]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1389</guid>
		<description><![CDATA[所有模版的標題都具有前置字與後置字變數
Drupal 7樣版都具備兩個新的標準變數：$title_prefix 及 $title_suffix。
這兩個變數內放的是想要被呈現在個別的標題前或後的輸出內容，可作為contextual links之用，像是讓具有某種權限的使用者可以看到一些特別的連結出現在標題上面或下面。
在node.tpl.php內局部的(Granular)展示$content 資訊
現在不需要像使用Drupal 6的$content時，要先做處理才能分隔$content的輸出。在Drupal 7使用 print render($content) 等同於在 Drupal 6的 print $content，不過當您想輸出部份的內容，像是link，在Drupal 7可以用 print render(content['links'])取得。
使用方式可以參考一下 node.tpl.php內的程式碼：

&#60;div class=&#34;content&#34;&#62;
  &#60;?php
    // 先把comments跟links的內容藏起來
    hide($content['comments']);
    hide($content['links']);
    // 輸出 $content 其他的內容
    print render($content);
  ?&#62;
&#60;/div&#62;

// 現在我們才輸出 links 跟 comments 的內容
&#60;?php print [...]]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/05/08/drupal-7-theming-different-2/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Drupal 7版型開發(theming)與Drupal 6的不同(上)</title>
		<link>http://www.mrmu.com.tw/2010/05/06/drupal-7-theming-different-1/</link>
		<comments>http://www.mrmu.com.tw/2010/05/06/drupal-7-theming-different-1/#comments</comments>
		<pubDate>Thu, 06 May 2010 06:49:30 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[Drupal開發]]></category>
		<category><![CDATA[PHP程式設計]]></category>
		<category><![CDATA[網站設計]]></category>
		<category><![CDATA[Drupal]]></category>
		<category><![CDATA[Drupal 7]]></category>
		<category><![CDATA[版型開發]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1383</guid>
		<description><![CDATA[Drupal 7預計將在今年中發佈正式版，在版型開發上有什麼不同之處需要注意的呢？
版型(Theme)無法向下相容
一直以來新版的Drupal發佈後，舊版的模組(module) 都無法向下相容於舊版的Drupal (指主要版號發佈)，這樣的情況也同樣發生在版型上，即是指舊的版型要經過修正才能套用至新版Drupal。針對此情況，Drupal.org提出了一份「Drupal 6轉換到Drupal 7的變更清單」，這份清單目前有49個項目，但實際上這些項目存在著一些待修正的部份，另外也有尚未列入清單的項目正在討論中 (講白一點就是這份清單有一點點過時XD)。但無論如何，這份清單還是能給Drupal 6的版型師(Themer)很不錯的參考，並決定思考如何升級版型去支援Drupal 7。
有一點可以確定的是，比起 Drupal 6，Drupal 7的模型開發比較複雜一點點，但這不表示比較難學習。我想合理的複雜化，是為了更容易理解及擴充。複雜的原因可能在於，Drupal 7 想盡辦法的將版型解構成合理的項目，並且另方面還要維持概念上的一致性，如此Drupal 6的版型師在轉換上才不會太痛苦。
我們先從Drupal 7的版型架構來看看有什麼新玩意。

html.tpl.php
若從版型的新架構來看，首先最外圍的包裹檔案已經從page.tpl.php變成 html.tpl.php了，不過 html.tpl.php只是把一些內容從page.tpl.php裡抽出來而已。您可以參考 modules/system/html.tpl.php (註1) 來了解它的詳細內容。大體來說，html.tpl.php主要存放 DOCTYPE描述、Html標籤、Head資訊與Body標籤，然後在Body標籤內傳入 page.tpl.php 的內容。
html.tpl.php的內容直覺且單純，因此多數版型師不太需要覆寫(override)它去作客製化。
更多關於 html.tpl.php的資訊可參考：

 api文件 &#8211; http://api.drupal.org/api/drupal/modules&#8211;system&#8211;html.tpl.php/7
 實作與變更 -http://drupal.org/node/579698

註1. modules/system目錄下可以找到許多以 tpl.php 為後置字的檔案，這些都是Drupal核心各部份的基底樣版檔，是很好的參考資料。而無論是核心或第三方模組的目錄下，有些也附有屬於該模組的*.tpl.php樣版檔。
region.tpl.php
區域(Region)樣版包括了內容區域、側邊欄、頁尾等設定。這份樣版檔是Drupal 7新增的，可以參考modules/system/region.tpl.php，實際內容就只有三行：

&#60;div&#62;
&#60;?php print $content; ?&#62;
&#60;/div&#62;

通常要在版型的.info檔內宣告要使用的區域，如果沒宣告就會用預設的設定，Drupal 7預設設定共有七個區域，分別是：

 header
 help (drupal 6放在page.tpl.php內的$help變數已被置換成這個區域)
 highlight (drupal 6的$mission變數已被置換成這個區域)
 content
 sidebar_first
 sidebar_second
 footer

所有的區域都會在page.tpl.php被呼叫並且繪出，語法就像：

&#60;?php print render($page['help']); ?&#62;
&#60;?php print render($page['sidebar_first']); ?&#62;
&#60;?php [...]]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/05/06/drupal-7-theming-different-1/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Drupal 7 &#8211; 內容管理系統(CMS)開發框架</title>
		<link>http://www.mrmu.com.tw/2010/05/04/drupal-7/</link>
		<comments>http://www.mrmu.com.tw/2010/05/04/drupal-7/#comments</comments>
		<pubDate>Tue, 04 May 2010 10:07:36 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[Drupal開發]]></category>
		<category><![CDATA[PHP程式設計]]></category>
		<category><![CDATA[網站設計]]></category>
		<category><![CDATA[CMS]]></category>
		<category><![CDATA[Drupal]]></category>
		<category><![CDATA[Drupal 7]]></category>
		<category><![CDATA[Framework]]></category>
		<category><![CDATA[網路應用]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1374</guid>
		<description><![CDATA[Drupal 是什麼？
Drupal是一個PHP based的內容管理系統(CMS)開發框架(framework，也有人稱它是一種平台)，但其實安裝Drupal之後，也會得到一個只有「半成品」程度的CMS，需要管理者「用力的」客製化後才能見到比較漂亮及完整的成品。因為Drupal也算是個CMS，因此常常被拿來跟Joomla、WordPress、Plone等CMS相比較，當然Joomla及WordPress安裝完後也需要User客製化一番，只是Drupal想要變的把戲比較多，所以比較麻煩一點，所以沒辦法定型的發展成針對某種應用的CMS，所以大部份新手使用Drupal的感覺是－Drupal很陽春或者很醜，至少不像Joomla，安裝完就有個漂亮的網站及後台。
我的理解是，Drupal應該是給開發者使用的CMS框架，但又不那麼Framework。個人刻板印象是覺得真正的Framework應該比較像是Cake或CodeIgniter這種東西，不過Drupal應該也算是比較高階一點的Framework吧。從Drupal 5 到 Drupal 6，感覺上跨了一大步，而Drupal 7又再一次給人全新的感受。實際上目前最新的穩定版本是 6.16，但是Drupal 7日前發佈了Alpha 4，趁著空檔就來稍微觀看一下 Drupal 7。
下載安裝 Drupal 7
Drupal 7的壓縮檔約為2.3mb，解壓縮後的目錄大約是8.2mb。安裝Drupal 7時預設有兩種安裝方式(install profiles)：標準與最小化安裝。
標準化安裝完，被開啟的模組會較多，查看資料庫會產生75個資料表，而最小化安裝只有48個資料表，且只有兩個模組會被啟用：block 和 database logging ，若你在稍早安裝時選擇了要自動更新模組，則還會多啟用一個update manager ，在此我們僅就標準版來介紹。
預設版型跟Drupal 6一樣，採用的都是Garland版型，但管理後台預設使用的是Seven這個非常精簡的版型。儘管後台的版型非常精簡，但後台的操作體驗跟Drupal 6相比，可是豐富多了。主要是因為Drupal 7為了提昇使用性，在後台操作上使用了大量的ajax效果，並且有效的控制管理項目的呈現。
體驗 Drupal 7
登入Drupal 7網站後最上排出現的是主要的管理選單，點選第一個&#8221;小房子&#8221;圖示，能連結至首頁。接著是八個主要的管理頁面選項。置右的選項有帳號、登出及捷徑列的開關。第二排就是捷徑列，置右的選項能編輯捷徑項目，方便管理者放置經常需要操作的選單捷徑。捷徑列內的項目不會依照切換不同管理頁面而改變，所以在切換各個管理頁面時，可別誤以為這是次選單。
如果您不習慣管理頁面「浮」在網頁上面，您可以到後台/Module管理頁面，將Overlay關閉。或者不要最上方的工具選單，就關閉Toolbar；不要捷徑列，就關Shortcut。

每個管理頁面都有連結至dashboard(管理後台)的連結，進入後可總覽所有管理項目。以下簡單介紹跟Drupal 6不同的管理後台頁面。
Content &#8211; 內容設定
Content - 內容列表 [可新增內容]
Comments - 已發佈及未認證的回應列表
Structure &#8211; 網站架構
Blocks - 區塊設定
Content types &#8211; 內容型態，有預設的兩個型態(article, basic page)，也能新增自訂型態，增加欄位(內建的CCK功能)
Menu &#8211; 主選單、管理選單、導覽選單、次選單、使用者選單，也能新增自訂選單
Taxonomy - 內容分類設定，建立分類項目(Vocabulary, 如內建的Tags)後，可至內容型態管理頁新增欄位，欄位的資料型態選擇Term   reference，儲存即可選擇自訂項目。
Appearance &#8211; 外觀設定，即是版型設定
List [...]]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/05/04/drupal-7/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>網頁設計及網站經營的趨勢-從搜尋引擎市場變化來思考對策</title>
		<link>http://www.mrmu.com.tw/2010/02/26/web-design-trends-and-strategy/</link>
		<comments>http://www.mrmu.com.tw/2010/02/26/web-design-trends-and-strategy/#comments</comments>
		<pubDate>Fri, 26 Feb 2010 07:53:15 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[網路行銷]]></category>
		<category><![CDATA[SEO]]></category>
		<category><![CDATA[搜尋引擎]]></category>
		<category><![CDATA[網站經營]]></category>
		<category><![CDATA[網站設計]]></category>
		<category><![CDATA[網頁設計]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1324</guid>
		<description><![CDATA[上圖標示的是台灣從2009年元月至2010年二月的搜尋引擎市佔率變化的概況，Yahoo雖然市佔依然第一，不過慢慢的走下坡中，而近來Yahoo為了力抗Google動作頻頻，分別對Facebook, Twitter, MS Bing等大廠表示合作意願，Google在搜尋引擎的技術及優勢較高，除了頻繁地發表新服務、新工具外，也和Facebook, MySpace, Twitter合作。
面對搜尋引擎市場變化及大廠的動作等，網站經營者又該有什麼樣的策略與準備呢？我們先看看環境有什麼變化。
1. 即時搜尋趨勢
所謂即時搜尋是指，檢索並提供像Facebook塗鴉牆,Twitter,Plurk..等這類的微網誌內容的搜尋，因為這類微網誌的更新成本小，反應某個主題的速度快，因此你一句，我一句，都是即時反應出某些事件的熱度、流行性，這對搜尋引擎來說是非常重要的訊息。
2. 客製化搜尋趨勢
針對地域、喜好、習慣等提供個人化的搜尋結果，這也是搜尋引擎發展的趨勢，Google也開始在做了。
3. 全球行動上網趨勢
雖然使用手機上網，有很多情況無法完全取代桌上型PC，但是作為隨時隨地搜尋資訊及個人社交用的工具來說，都是桌上型PC無法替代的。基礎建設都陸續發展中，上網吃到飽的費率也可望降低，很多數據也證明行動上網人口逐年逐月成長。
搜尋引擎行銷的現況？
 就目前的網站經營來說，因為最近幾年SEO(搜尋引擎優化)議題開始炒得很熱，愈來愈多網站經營者投入資源在做這塊，所以慢慢的具備SEO概念的經營能力，將會由優勢成為一種基本的標準能力。
 搜尋引擎本來的使命就是要提供最適當的內容給使用者，因此搜尋的演算法會一直朝此方向進化，如此使用者才會覺得好用。而網站本身該做的，應該就是用標準的語言說明自己提供什麼樣的資訊，操弄灰帽、黑帽SEO技巧 (暗黑小技巧)的效果會逐漸失敗，甚至受罰。
面對這些環境變化，網站該怎麼經營？
1. 架站前，先具備正確的SEO觀念－了解搜尋引擎要的是什麼
點要放在你的產品跟服務，不是一時操弄SEO的技巧。未來搜尋引擎會協助你的消費者，用盡一切方法找到提供適合產品或服務的網站，因此若你的產品及服務表現不優，即使你強打廣告，讓排名暫居第一，消費者的聲浪加上搜尋引擎的協助，會很快的讓你下台。但如果產品跟服務無法有明顯的差異化或優勢，就要試著去發展跟客戶間的關係。
2. 思考經營整合服務(部落格、社交網站、微網誌&#8230;)的可能性，但不要迷失在數據
因為web 2.0風潮，網路產出了許多便利的服務及工具，因此吸引了許多人潮。思考整合性服務是必要的，如了解各種工具特性、網站類型、平台服務，才能了解它們對你的產品及服務有何幫助。
 Facebook的粉絲數、Twitter的Follower、Plurk的粉絲+朋友+Karma值&#8230;這些，都不是重點。集客數(量)是必要的，但重點應該放在關係(質)。五個麻吉好朋友，比五百個點頭之交來得有價值。
3. 你的網站在手機上應該要長什麼樣子？
既然行動上網服務日益普及，我們就不該忽略這個情況。務必把「建立網站在行動設備上的瀏覽介面」放進你的行程表。手機畫面比較小，所以要注意把寬頻留給客戶真正在意的功能上。另外，在設計上不能失去視覺識別功能，也要提供一致性的操作流程。
本文同步發表於Facebook 網站經營研究小組 粉絲專頁
圖表資料參考：http://gs.statcounter.com/#search_engine-TW-monthly-200901-201002


	相關文章
	
	首頁PageRank突然由0成長至4，感謝大家支持&#8230;
	使用javascript (或jQuery)對SEO影響的迷思
	網頁設計(視覺設計,網站程式)計費方式(專業分工費用)及行情調查
	黃金價格顯示小工具(Widget)-目前暫停使用!
	鑽石、訂製鑽戒的線上之戰：eBay, 藍色尼羅河(Blue Nile), 九鑽網
	金屬創造力聯播－金工、藝術、設計優質Blog聯播


]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/02/26/web-design-trends-and-strategy/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>網頁設計(視覺設計,網站程式)計費方式(專業分工費用)及行情調查</title>
		<link>http://www.mrmu.com.tw/2010/02/25/web-design-prices/</link>
		<comments>http://www.mrmu.com.tw/2010/02/25/web-design-prices/#comments</comments>
		<pubDate>Thu, 25 Feb 2010 05:16:50 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[網站設計]]></category>
		<category><![CDATA[網路行銷]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1313</guid>
		<description><![CDATA[網頁設計市場中的行情一直是非常混亂，本調查試圖整理出一個大約的級距範圍以供參考。因為個人的專業知識有限，有些調查到的價格也許有破壞行情或過份高估的情況，希望大家有任何意見都可以留言給我，讓計價行情能具備更中肯的參考性。
這份行情對照表所定出來的計價方式，主要參考了JCase接案網、104接案網的案件行情，分為多媒體網頁設計、平面與視覺設計、網路應用程式、打字或編輯工作等四項專業領域。
請注意，資訊來源參考了接案網的價格，而這些價格大多是由發案方開出來的，並不一定能真實反應結案後的真正價格，因此與真正的產品及服務費用相比較，可能有落差。另外，此表價格為專業能力分工的製作價格參考，但要完成一個完整的專案，還需考量業務開發成本、討論時程、修正成本、測試成本&#8230;等，這些費用均未反映在此行情表。
價格範圍有些很寬，因為有些是學生、或剛受完訓練的新手，為了搶案子自砍價格，所以有些項目的最低價有點離譜。 在此要請發案方注意，若您要的只是便宜，而不是品質，您可以參考最低價來提出預算；畢竟羊毛出在羊身上，大多數真正能提供專業服務，能有效提昇您的企業行銷品質的產品，多半價格比較高，但這並不是貴或便宜的問題，這是價值的問題。


多媒體網頁設計計價方式



分類
內容
單位
參考價格


首頁
靜態html
一頁
3,000~10,000


含10秒形象動畫(Flash)
5,000~15,000


內頁
靜態html
一頁
1,000~3,000


含10秒形象動畫(Flash)
2,000~5,000


套用版型(不含修改)
300~1,000


網頁維護
內容更新
一項
300~1,000


方形廣告橫幅(Banner)
150*75 像素(pixel)
一個
500~2,000


300*150 像素(pixel)
500~3,500


660*300 像素(pixel)
1,300~3,000


小圖示(Icon)
80*80 像素(pixel)
一個
200~500


網頁廣告製作
單頁EDM(電子傳單)
一頁
900~2,000


廣告活動頁
1,500~3,000


電子報單頁
1,500~3,000


Flash動畫製作
2D動畫
每秒
800~2,000


2D角色創造
單個
2,500~8,000


3D動畫
每秒
2,000~5,000


3D角色創造
單個
5,000~10,000


遊戲(不含設計)
單個
3,000~10,000


Banner
單個
1,500~10,000


網頁選單
一組
2,000~3,500


網頁應用程式
一個
5,000以上



平面與視覺設計計價方式



分類
內容
單位
參考價格


海報/DM
(業主提供素材，不含攝影)

菊對開(A2)以上
單面
3,000~4,000


含菊對開(A2)~菊八開(A4)
2,200~3,500


含菊八開(A4)以下
1,800~3,000


型錄
(業主提供素材，不含攝影)
菊八開(A4)以上
單面
800~3,200


含菊八開(A4)以下
600~3,100


LOGO
 
一個
1,500~150,000
(專業設計30,000以上，附視覺識別VI手冊100,000以上)


名片設計
(不含Logo)


一張
1,000~8,000


外包裝設計
(業主提供素材，不含攝影)
紙盒
一式
1,200~5,000


紙袋
1,000~5,000


吊卡
800~1,500


人物插畫
漫畫(四格漫畫一篇1000起)(連環漫畫一頁800起)

每格
300~400


素描A4
一張
1,000~2,000


Q版人物
(不含原始檔)
1,000~5,000以上


圖片處理
圖片合成
單張
100~500


掃圖
30~50


一般物品修圖去背
50~100


人物修圖去背
100~300



網路應用程式計價方式



內容
單位
參考價格



新聞區發佈


2000~8,000



購物車


30,000~60,000



人事求才專欄


8,000~15,000



問卷調查表單


3,000起



FAQ


2,000起



線上視訊


3,000起



討論區


3,000起



動態文字展示（跑馬燈）


1,500~3,000



網站內BLOG


8,000起



行事曆（提供個別會員schedule）


6,000起



文件下載區


3,000起



我的照片（輪播）


3,000起



客戶關係管理


6,000起



會員管理


5,000~20,000 



電子報


7,000起



Wordpress 專業部落格客製架站（含版型修改、模組代裝）


15,000~50000



Joomla 專業內容管理網站安裝（不含版型修改、模組代裝）


3,000~5,000



Drupal 專業內容管理網站安裝（不含版型修改、模組代裝）


3,000~5,000



打字或編輯計價方式



分類
內容
單位
參考價格


純中文字建檔
無校對
每千字
40~50


含校對
70~80起


純英文字建檔
無校對
2000bytes
60~70


含校對
70起


打字排版(含校對)
A4
每頁
55~120


A5
45~90


簡體字稿打繁體字稿

每千字
130~160


客戶資料登錄

每筆
1.3~1.5


表格輸入
不含文字
每表
50起


書本期刊編輯


視個案洽商議定


掃瞄
A4
每頁
4~5


大於A4
7~8


聽打、逐字稿


依內容報價



此份價目表將會在未來不定期的更新，以求反映市場行情，希望大家有任何意見或看法都能不吝分享，謝謝。


	相關文章
	
	首頁PageRank突然由0成長至4，感謝大家支持&#8230;
	網頁設計及網站經營的趨勢-從搜尋引擎市場變化來思考對策
	使用javascript (或jQuery)對SEO影響的迷思
	黃金價格顯示小工具(Widget)-目前暫停使用!
	鑽石、訂製鑽戒的線上之戰：eBay, 藍色尼羅河(Blue Nile), 九鑽網
	金屬創造力聯播－金工、藝術、設計優質Blog聯播


]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/02/25/web-design-prices/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>鑽石、訂製鑽戒的線上之戰：eBay, 藍色尼羅河(Blue Nile), 九鑽網</title>
		<link>http://www.mrmu.com.tw/2010/02/22/diamonds-online-ebay-blue-nile/</link>
		<comments>http://www.mrmu.com.tw/2010/02/22/diamonds-online-ebay-blue-nile/#comments</comments>
		<pubDate>Mon, 22 Feb 2010 03:38:10 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[介面設計]]></category>
		<category><![CDATA[市場情報]]></category>
		<category><![CDATA[網路行銷]]></category>
		<category><![CDATA[Blue-Nile]]></category>
		<category><![CDATA[eBay]]></category>
		<category><![CDATA[珠寶]]></category>
		<category><![CDATA[網路應用]]></category>
		<category><![CDATA[鑽戒]]></category>
		<category><![CDATA[鑽石]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1308</guid>
		<description><![CDATA[線上拍賣的知名品牌eBay最近舉辦了「打造你的閃亮鑽戒」(Build Your Bling)比賽活動，讓參賽者設計專屬的鑽戒，並藉由這次的活動正式宣告eBay也開始進軍鑽石的線上零售戰場。這次比賽的優勝者將獲得Gemstoneking公司贈送設計者所設計的戒指，預計價格超過25000美金。
參與者二月19號前要完成並送出自己的設計，其他的eBay使用者將進行最佳設計的投票來選出優勝者，二月26日公佈比賽結果。這樣的訊息告訴我們，鑽石的線上銷售又將進入一個全新的世代!
這次的比賽也讓所有人藉此機會一睹eBay的線上鑽戒設計師系統(Diamond Ring Designer system)，很明顯的這個設計系統的介面延用參考了藍色尼羅河(Blue Nile)網站的介面，在設置搜尋條件時使用大量的雙向滑動棒(Slider bar)，包括選擇鑽石形狀、尺寸、顏色、淨度及車工等，而且價格非常透明，讓使用者能很容易的在線上進行比價。
設計流程很單純，先選擇寶石，設定了寶石的各項條件後，系統會列出所有符合條件的現貨供使用者參考，使用者可以選擇最多五顆不同樣式等級的寶石。選定寶石後，接著選擇戒台(setting)，除了樣式外，戒台的材質如黃金、K金或鉑金也能選擇，一樣也是可以選擇最多五種不同樣式的戒台，最後一步就是讓使用者搭搭看，看哪種組合最順眼，如此就完成了鑽戒的設計。
當然這場比賽並不是重點，重點之一是高單價的鑽石也能成功的搬上電子商務的檯面，並且持續獲利，而且讓我們對線上奢侈品的銷售有了一個初步的視野。全球最大的線上鑽石銷售商藍色尼羅河(Blue Nile)成立於1999年，在短短5年後就在那斯達克上市，而藍色尼羅河的成功，讓鑽石線上銷售業務大放光芒，藍色尼羅河沒有實體店面的高昂成本，加上線上直接銷售免除了大量的中間商費用，使得價值非常具有競爭力，也讓這些因素成了最佳的利基。
價格當然是重點，但鑽石這樣高單價的物品能在線上銷售成功的重點是規格的標準化，如鑽石的4C(顏色、淨度、車工、克拉重量)，GIA證書的推廣及教育，線上金流和物流的成熟等，都是讓鑽石能放在網路上銷售成功的原因。隨後跟進的大陸網路公司九鑽網，一開始的網站介面幾乎完全模仿藍色尼羅河，讓我一時還以為是Blue Nile在中國開分站，現在去看九鑽網，介面都換掉了，大概也開始走出自己的路了。
這些例子對日後想進軍鑽石或珠寶線上銷售業的業者具有指標性的意義，但如何提供具備差異性的服務或形象將會是重點，因為當鑽石被高度規格化後，光靠產品本身的價差利潤將所剩無幾，而線上服務的重點就將落在網站及客戶服務上了。
參考資料：
Luxist.com
BlueNile.com
9diamond.com


	相關文章
	
	婚戒-名人的選擇：范范(范瑋琪)與黑人(陳建州)的Tiffany 1克拉鑽戒
	如何為新娘挑婚戒？
	首頁PageRank突然由0成長至4，感謝大家支持&#8230;
	鑽飾品牌DSC, Aida Diamond搶攻消費券商機
	鑽石!LAZARE DIAMOND的億萬冰淇淋甜筒
	金屬創造力聯播－金工、藝術、設計優質Blog聯播


]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/02/22/diamonds-online-ebay-blue-nile/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Google Buzz! Google的社群應用初體驗!</title>
		<link>http://www.mrmu.com.tw/2010/02/10/google-buzz-google%e7%9a%84%e7%a4%be%e7%be%a4%e6%87%89%e7%94%a8%e5%88%9d%e9%ab%94%e9%a9%97/</link>
		<comments>http://www.mrmu.com.tw/2010/02/10/google-buzz-google%e7%9a%84%e7%a4%be%e7%be%a4%e6%87%89%e7%94%a8%e5%88%9d%e9%ab%94%e9%a9%97/#comments</comments>
		<pubDate>Wed, 10 Feb 2010 03:54:14 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[網站設計]]></category>
		<category><![CDATA[網路行銷]]></category>
		<category><![CDATA[Google]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1304</guid>
		<description><![CDATA[今天一早開啟Gmail突然發現， Google Buzz啟用的畫面先跳出來了! 我想過沒多久，我的Android手機也會跳出Google Buzz了! 馬上進入Gmail體驗一下，看Google Buzz是個什麼樣的玩意。(其實第一眼看到Google Buzz時，我心中想起的不是它到底是什麼樣的應用，而是Google Wave現在過得如何了呢XD )
之前官方有發佈Google Buzz的影片如下：

但是第一眼看到Google Buzz的介面，就讓人很直覺的聯想到Twitter，不過反正微網誌這一掛的，都跟社群應用、即時搜尋等字眼綁在一起很久了，Google要做當然多少也會參考前人的作品，而且維持一致性，讓使用者也容易上手。
像上面這個「選取相片」的介面，就跟在噗浪裡面到處充斥的Ajax視窗一樣，不能移動也不能調整大小的偽視窗，基本上我覺得不是個易用的UI設計。
上面這個是發佈訊息的介面，可以發佈文字、相片、連結，也能設定要不要公開，總之就是基本配備啦。另外，若您有自己的Blog，也可以新增網站，新增後文章的摘要就會出現在下方了，也算是跟Bu友宣傳一下，這種模式在噗浪、Twitter都已經很常見了。
不過目前身邊朋友使用Gmail的其實不能算多，而Google Buzz內建在Gmail的作法，就是把範圍先縮在Gmail的用戶了，這就表示現階段在台灣要推廣比較困難。因為現在台灣用戶大多都用Yahoo的信箱，如果要讓Google Buzz在台灣形成像噗浪這樣的規模，我想還需要讓這些Yahoo信箱的用戶更「深刻」的體會Google Gmail (及所有其他應用)的好，或者，換句話說就是體會到Yahoo信箱的不良。
參考資料:
Google Buzz-http://www.google.com/buzz


	相關文章
	
	Google Chrome OS-Google推出的自家Web OS
	首頁PageRank突然由0成長至4，感謝大家支持&#8230;
	鑽石、訂製鑽戒的線上之戰：eBay, 藍色尼羅河(Blue Nile), 九鑽網
	金屬創造力聯播－金工、藝術、設計優質Blog聯播
	設計、美學、金工、珠寶部落格的網路行銷工具－台灣創造力聯播。(09/01/04更新)
	虛實整合的趨勢


]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2010/02/10/google-buzz-google%e7%9a%84%e7%a4%be%e7%be%a4%e6%87%89%e7%94%a8%e5%88%9d%e9%ab%94%e9%a9%97/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>如何用電腦看模擬手機上網的網站？</title>
		<link>http://www.mrmu.com.tw/2009/12/14/mobile-phone-browser-simulator/</link>
		<comments>http://www.mrmu.com.tw/2009/12/14/mobile-phone-browser-simulator/#comments</comments>
		<pubDate>Mon, 14 Dec 2009 14:54:04 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[介面設計]]></category>
		<category><![CDATA[好用工具]]></category>
		<category><![CDATA[Opera Mini]]></category>
		<category><![CDATA[手機上網]]></category>
		<category><![CDATA[網站設計]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1294</guid>
		<description><![CDATA[
這是今天一位朋友突然問我的一個問題，其實有很多種simulator，但可能要先安裝特定的手機OS模擬器，才能使用它內建的browser吧，因為我的經驗也不是非常多，我只接觸過windows mobile，但一下要搞到wm的模擬器，其實也很麻煩，又非常大。
如果想要知道自己的網站在手機上瀏覽會是什麼樣子，可以參考一下Opera Mini的線上Demo程式，這是目前我能找到最簡單的solution了~ 它的Demo程式就是下方這樣的介面，你可以試玩看看，看自己的網站在手機上看會是什麼樣子：(如果畫面出不來，或者有疑似當掉的情形，請按Ctrl + F5來重讀，再試試看。)
	
Opera Mini的線上模擬器需要安裝最新的JRE: Java Runtime Environment.
	
官方網站：http://www.opera.com/mini/demo/


	相關文章
	
	黃金價格顯示小工具(Widget)-目前暫停使用!
	首頁PageRank突然由0成長至4，感謝大家支持&#8230;
	網頁設計及網站經營的趨勢-從搜尋引擎市場變化來思考對策
	網頁設計(視覺設計,網站程式)計費方式(專業分工費用)及行情調查
	無名文字繪－得知無名小站好友對你的稱呼
	心智圖工具 &#8211; FreeMind


]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2009/12/14/mobile-phone-browser-simulator/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Google Chrome OS-Google推出的自家Web OS</title>
		<link>http://www.mrmu.com.tw/2009/11/21/google-chrome-os/</link>
		<comments>http://www.mrmu.com.tw/2009/11/21/google-chrome-os/#comments</comments>
		<pubDate>Fri, 20 Nov 2009 17:29:27 +0000</pubDate>
		<dc:creator>mrmu</dc:creator>
				<category><![CDATA[學習資源]]></category>
		<category><![CDATA[Chrome OS]]></category>
		<category><![CDATA[Google]]></category>
		<category><![CDATA[Web OS]]></category>
		<category><![CDATA[網路應用]]></category>
		<category><![CDATA[網路行銷]]></category>

		<guid isPermaLink="false">http://www.mrmu.com.tw/?p=1277</guid>
		<description><![CDATA[
今天Google正式提供了Chrome OS的Source載點，相信已經有許多玩家開始試著把它build起來安裝了(據說很陽春&#8230;但也不意外)，不過Google目前不會提供給一般使用者下載安裝Chrome OS，這個Source載點，我想主要還是針對OEM(代工)廠商的測試，因為Google希望Chrome OS能跟著廠商的機器在明年一併正式問世。而今天在看過Google Chrome OS的概念後，決定來寫一篇個人感想。

會想寫一點感想，主要也是因為最近在書局看了這兩本書，也很推薦給各位，可以對Google作法、目標及獲利方式有個概括的了解：

Google Chrome OS究竟會是什麼樣子呢？Engadge.com有很簡明的介紹，其實剛開始得知這樣的消息，很多人也許會想到之前M$把IE4跟Win98緊密整合的情況，但Google這次玩的更大更徹底，看下面的圖，整個OS的操作就是以Chome瀏覽器的UI為主，似乎沒別的了，Client端似乎連硬碟也不需要了，因為它們就是把 Client端的運算，都丟上雲端了。

把Client端的運算都丟給Google的伺服器，那表示Chrome OS沒有網路就等於關機了。
「什麼？好鳥哦&#8230;這一定不適合我，沒網路我還能打電動呀~ 沒網路我還能看片子呀~ Blah Blah&#8230;」 相信這些都是大多數人聽到沒有網路等於關機的第一個念頭。
不過我想，Google所做的一定比我們所想的都多，想的更遠，甚至比我們了解自己。別說不可能，他們提供這麼多昂貴的免費服務，為的就是要透澈的了解我們的行為與習慣。雖說web os沒網路就不能用，給人一種不安全的感覺，但我們對於網路的需求早就遠比我們自己想像的高了。
至少不能上網時，我個人不會想開機 (想開機的情況很少很少&#8230;)，你說打電動、看片子，其實都是在你的電腦也能上網的同時做的，說穿了，說不定你主要是想上網，其他的都只是附屬功能，那這種情況下，沒有網路等於關機，似乎也很能讓人接受了。最後附上一段Chrome OS的UI操作概念影片，大概就有感覺了：

參考資料：
Google.com


	相關文章
	
	首頁PageRank突然由0成長至4，感謝大家支持&#8230;
	鑽石、訂製鑽戒的線上之戰：eBay, 藍色尼羅河(Blue Nile), 九鑽網
	金屬創造力聯播－金工、藝術、設計優質Blog聯播
	Google Buzz! Google的社群應用初體驗!
	設計、美學、金工、珠寶部落格的網路行銷工具－台灣創造力聯播。(09/01/04更新)
	虛實整合的趨勢


]]></description>
		<wfw:commentRss>http://www.mrmu.com.tw/2009/11/21/google-chrome-os/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
