網路行銷之網頁設計10大秘訣

網路行銷之網頁設計10大秘訣
網頁設計的目的之一是行銷，而欲達此目的的秘訣有十，簡述如下：

1. 文字說明要清楚（Clear Writing）
2. 要包含連結（Include Links）
3. 要縮小圖片（Make Graphics Small）
4. 提供免費工具（Free Tools are Available）
5. 內容具說服力（Be Persuasive）
6. 多用文字少用圖（Use Text More Than Images）
7. 內容有組織（Organization）
8. 包含有價值的資訊（Include Valuable Information）
9. 聚焦在預期客戶的需求（Focus on Prospective Client's Needs）
10. 與其他網站交換橫幅廣告（Banner Exchanges）

資料來源http://website-design.themesite.info/

網站揚名立萬術

要使你的網站揚名立萬，其他揚名的方法
除了利用meta之外，增加知名度的方式還有

• 取好的網站名稱及標題
• 善用搜尋引擎網站
• 加入好站或酷站推薦

Meta標籤內的其他用途

在head標籤內，除了可以設style標籤之外，也可以設meta標籤，而在meta標籤的內容及用途常有下列二種：

• 頁面更換

假設你有三個頁面，檔名分別為index.htm;index1.html;index2.html,要換每格10秒換一次，則在Meta內：
第一個網頁(index.html)之<meta>標籤
<meta http-equiv="refresh" content=10;URL="index1.html">

第二個網頁(index1.html)之<meta>標籤
<meta http-equiv="refresh" content=10;URL="index2.html">

第三個網頁(index2.html)之<meta>標籤
<meta http-equiv="refresh" content=10;URL="index.html">

參看以下的範例的meta可得知。
http://web.ntit.edu.tw/~hsieh/index.html

• 增加網站、部落格的知名度

當你設計好網站或部落格之後，就要設法增加它的知名度，方法之一是刊登在在平面軟體如雜誌或名片上。另外，你可以在網站的head標籤內利用meta name="description"及meta name="keywords"來完成。
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<meta name="description" content="這是愛書人的雜記">
<meta name="keywords" content="謝寶泰、雜記">
一般要注意

1. <meta name="description" content="xxxxxxxxxxxx">此處的xxxxxxxxxxxx以二十個字描述網站的內容
2. <meta name="keywords" content=" yyyyyyyyyyyyy">此處的yyyyyyyyyyyyy代表總數少於二十字的關鍵字

備妥Web 2.0工作能力

Web 2.0與Web 1.0既有差別，而謀職者的能力自然不同，兩者所需之能力的差別如下：

Web 1.0---------->Web 2.0
情報無國界革命--->集體創造革命
情報收集力-------->知識凝聚力

1. 網路收尋力------>1. 主動奉獻力
2. 網路徵詢力------>2. 社群共鳴力
3. 網路編輯力------>3. 概念提案力

草根媒體革命------>主客融合革命
意見發表力-------->行動創造力

1. 訊息表達力------>1. 自我情緒抑制力
2. 訊息交流力------>2. 遵守網路禮儀力
3. 訊息散播力------>3. 實踐推動力

知識共享革命------>感性共享革命
知識學習力--------->知識感動力

1. 知識習得力------>1. 認同感知力
2. 知識專精力------>2. 想像傳達力
3. 知識說明力------>3. 人格表現力

因應Web 2.0的現實，現代謀職者需將部落格視為自己的第二份履歷表，而好的部落格必須具備以下10種好感度：

• 風格感：認真寫，凸顯自己的觀點。
• 速度感：天天做網路文摘。
• 分享感：心存分享，必有鄰。
• 編輯感：把事件編輯成可讀性的內容。
• 親切感：內容能夠簡單可口易消化。
• 親密感：參加網路社群摶感情。
• 品牌感：取好名、充實內容、建立唯一品牌。
• 真心感：以誠與網友交心。
• 實用感：表現自己的專業和專長，讓網友有收穫。
• 連結感：與大平台連結，處處留足跡，讓別能連到你。

**摘自《Web 2.0時代，你需要什麼工作力？》30雜誌，2006年12月, p.77。**

分辨Web 1.0與Web 2.0

網路傳播世界的進步可說是一日千里，其整體文化也與時俱變，2000年前後起了巨大的改變，即從Web 1.0進入Web 2.0，例如，最近的Youtube及臺灣的無名小站，即是最好的例子。根據Tim O'Reilly的說法，Web 1.0進入Web 2.0所涉及的技術、觀念、公司形態，差異性如下：
Web 1.0 ------------------------>Web 2.0
DoubleClick（點按二次） ---> Google AdSense
Ofoto -----------------------------> Flickr
Akamai ---------------------------> BitTorrent
mp3.com ------------------------> Napster
Britannica Online --------------> Wikipedia
personal websites --------------> blogging（部落格）
evite -----------------------------> upcoming.org及EVDB
domain name speculation -> search engine optimization (搜尋引擎最佳化)
page views -----------------------> cost per click（每次點按的成本）
screen scraping -----------------> web services（網路服務）
publishing -----------------------> participation（參與）
content management systems > wikis（維基百科）
directories (taxonomy) ---------> tagging ("folksonomy")
stickiness ---------------------------> syndication （集思廣義）

期末作業

繳期：
96年1月10/11日（週三/四）

作業主題：全真公司網站100%更新

• 將期中作業存到asystem1內，期末作業存在
  http://web2.ntit.edu.tw/~sxxxxxxxxx/asystem/內。

作業項目：

1. 12月13/14日--新風格設定（需設有連結xxxx.css檔）
2. 12月20/21日--首頁及內頁1
3. 12月27/28日--內頁2-4
4. 01月03/04日--初評
5. 01月10/11日--修稿 (評核)

參考網站

• http://www.gateway.com/index.shtml
• http://www.dell.com/
• http://global.acer.com/
• http://www.sony.co.jp/
  

必看的CSS網站

網站設計的必備能力之一是善用CSS，以下的網站是值得一覽：

• http://www.csszengarden.com/
• http://ccca.nctu.edu.tw/~hlb/trans/practicalcss/
  
• http://chinese-school.netfirms.com/css-tutorial-T-Chinese-index.htm
• http://www.w3schools.com/css/
• http://www.sitepoint.com/books/cssant1/
• http://www.photoshopcafe.com/tutorials.htm
• http://www.greenmaven.com/
• http://www.zafu.com
• http://www.adobe.com/devnet/dreamweaver/
• 用CSS及Photoshop做網頁粗稿http://alistapart.com/articles/quickcssmockupswithphotoshop
  

建議閱讀

• 賴虹燕譯，Web CSS網頁樣式設計學 ，台北：博碩，200x年。
• 黃聰明，CSS版面樣式設計實務，台北：文魁，200x年。
• 碼上就用CSS，台北：上奇，，200x年。
• 胡為君譯，CSS網頁設計手扎，101個您一定會遇到的問題與解答。台北：上奇，200x年。
• 胡為君譯，The Zen of CSS-網頁視覺設計の王道，台北：上奇，200x年。
• 王煦淳譯，WebLayout設計的美學, 台北：旗標，2006。
  

CSS概述
CSS是Cascading Style Sheet的縮寫，中譯為樣式表。它是一組樣式的集合，功能是要讓網站頁面的設計能結構化、經濟化及美觀化。
樣式可以網頁內部的，也可以是外部的。
前者適用於單一頁面，後者適用於整個網站﹣﹣先設好一個.css檔，網頁再連結該.css檔。

例一