羽茹上課內容

• 維度架站 (免費架站)
• 台中市才藝教學服務人員職業工會 (版面大小固定)
• 教育生活家 (版面隨應螢幕自動調整)
• JQuery (免費的效果程式)
• JQuery-super Cool 3D Image Transitions effect
• html5

期末作業

目標：

1. 以在http://www.webs.com架網站為基礎，為國內某一公司改良網站，使其符合
   使用者友善
   使用者經驗
2. 完成改善後，可與該公司接洽，為自己搭上出名或賺錢的機會。

時程：
11/25 選定公司，組織架構
12/02 放假 版型規畫
12/09 文字處理
12/16 圖像處理
12/23 圖像處理
12/30 動畫處理
01/06 期末報告
01/13 期末報告

可改善的公司例子

• 貝簡易機械股分有限公司
• 富潤股份有限公司
• 如龍木工機械股份有限公司
• 鴻運手工具股份有限公司
• 有可能改善的公司

測試

這是一篇測試文,各位已看到用類似的圖案表示不同的意義

2012同學在webs.com的網站

同學們，請點按此處所設好的webs.com網址，再進入webs.com修改你的網址，使與你的部落格的網域名稱(domain name)的第一個名稱相同。例如：你在
部落格的網址是okfamily.blogspot.com
在webs.com的網址是okfamily.webs.com
若無法直接在webs.com修改，可以新增一個。

1. 3300xx03,林O玹
2. 3300xx16,王O禾
3. 3301xx01,黃O武
4. 3301xx02,王O姿
5. 3301xx03,許O鈞
6. 3301xx04,曾O瑜
7. 3301xx05,潘O羽
8. 3301xx06,黃O媚
9. 3301xx07,許O茵
10. 3301xx08,沈O柔
11. 3301xx09,潘O璇
12. 3301xx10,梁O誠
13. 3301xx11,謝O穎
14. 3301xx12,陳O哲
15. 3301xx13,李O蓁
16. 3301xx14,余O茹
17. 3301xx15,張雅涵
18. 3301xx16,梁O鈞
19. 3301xx17,劉O桃
20. 3301xx18,李O岑
21. 3301xx19,林O瑩
22. 3301xx20,黃O右
23. 3301xx21,卓O倫
24. 3301xx22,蔡O珊
25. 3301xx23,張O鳳
26. 3301xx24,吳O榕
27. 3301xx25,羅O旻
28. 3301xx26,戴O儀
29. 3301xx27,李欣
30. 3301xx28,陳O幀
31. 3301xx29,白O凱
32. 3301xx30,洪O真
33. 3301xx31,黃O筠
34. 3301xx32,吳O凰
35. 3301xx33,陳O宇
36. 3301xx34,張O鈺
37. 3301xx35,張O瑋
38. 3301xx36,林O聿
39. 3301xx37,林O永
40. 3301xx40,陳O穎
41. 3301xx41,李O穎
42. 3301xx43,林O廷
43. 3301xx44,王O慶
44. 3301xx45,何O德
45. 3398xx08,吳O賢
46. 3399xx06,黃O偉

在webs.com及wopop.com建立網站

目標
活用免網站架設自己(預設的)或公司的網站

方法

1. 到http://teachweb.webs.com看使用說明
2. 選擇繁體中文
3. 設定網址 (先以學號sxxxxxxxx.webs.com為網址，sxxxxxxxx為你的設定，餘為內定)
4. 挑選樣版
5. 試做修改

一、用webs.com架設的網站例子

• 33003001
• 33003004
• 33003005
• 33003006
• 33003008
• 33003009
• 33003010
• 33003011
• 33003013
• 33003018
• 33003019
• 33003020
• 33003022
• 33003025
• 33003012 (wopop)
• 33003021 (wopop)

參考瀏覽

• http://www.skyzone45.com/

二、用wopop.com架設的網站例子

• 33003002
• 33003004
• 33003007
• 33003008
• 33003009
• 33003012
• 33003013
• 33003017
• 33003018
• 33003020
• 33003021
• 33003022
• 33003026
• 
  

延伸瀏覽

• 皮克斯網站
• webby.com免費網站
• evernote網站

期中作業

在你的部落格完成

• 版頭的圖像設計
• 新增一個與你的部落格相關性高的youtube作品
• 11月/4日 13:40 課堂發表

擷取影片碼的符號

• embed
• get code
• share (分享)

蜘蛛捕獵

作業總覽

一、在你的部落格新增一篇文章，回答

1. 網路是什麼
2. 比較瀏覽器，何者最好？
3. FB改變你什麼？

二、在你的部落格新增第二篇文章，於其中推荐

• 一個部落格
• 二個網站
• 三個Facebook

三、從以下的30個Pinners中選出你最喜歡的三個，並在你的部落格中描述它們給你的啟示

1.  The Top 30 Pinners You Should Follow Now

延伸瀏覽

• http://vincicat.blogspot.tw/2012/03/pinterest.html
• http://www.soft4fun.net/tag/pinterest/
• http://en.wikipedia.org/wiki/Pinterest

四、從以下的50個網站挑三個你最喜歡的，並在你的部落格中描述它們對你的最佳用途

1.  2012年最好的50個網站
2. 遊戲兼捐米，好玩

2012名單

1. 3300xx03,林O玹
2. 3300xx16,王O禾
3. 3301xx01,黃O武
4. 3301xx02,王O姿
5. 3301xx03,許O鈞
6. 3301xx04,曾O瑜
7. 3301xx05,潘O羽
8. 3301xx06,黃O媚
9. 3301xx07,許O茵
10. 3301xx08,沈O柔
11. 3301xx09,潘O璇
12. 3301xx10,梁O誠
13. 3301xx11,謝O穎
14. 3301xx12,陳O哲
15. 3301xx13,李O蓁
16. 3301xx14,余O茹
17. 3301xx15,張雅涵
18. 3301xx16,梁O鈞
19. 3301xx17,劉O桃
20. 3301xx18,李O岑
21. 3301xx19,林O瑩
22. 3301xx20,黃O右
23. 3301xx21,卓O倫
24. 3301xx22,蔡O珊
25. 3301xx23,張O鳳
26. 3301xx24,吳O榕
27. 3301xx25,羅O旻
28. 3301xx26,戴O儀
29. 3301xx27,李欣
30. 3301xx28,陳O幀
31. 3301xx29,白O凱
32. 3301xx30,洪O真
33. 3301xx31,黃O筠
34. 3301xx32,吳O凰
35. 3301xx33,陳O宇
36. 3301xx34,張O鈺
37. 3301xx35,張O瑋
38. 3301xx36,林O聿
39. 3301xx37,林O永
40. 3301xx40,陳O穎
41. 3301xx41,李O穎
42. 3301xx43,林O廷
43. 3301xx44,王O慶
44. 3301xx45,何O德
45. 3398xx08,吳O賢
46. 3399xx06,黃O偉

進度

第1週  概論 blogger facebook使用
第2週  facebook使用
第3週  facebook使用
第4週  部落格(blog) web 1.0 2.0 3.0
第5週  部落格(blog) 之文字與圖像應用
第6週  部落格(blog) 的影片及動畫處埋
第7週  部落格(blog) 語法
第8週  部落格(blog) RSS應用
第9週  期中考週 期中作業
第10週  網站設計實務
第11週  優良網站瀏覽
第12週  網站規畫、網站上傳
第13週  網頁文字與圖像編輯
第14週  超連結的應用
第15週  表格的使用
第16週  css樣式的使用
第17週  網站多媒體的應用
第18週  期末考週 期末作業

網路相關術語

網路傳播相關資訊

• internet
• internet history
• Web browser:  IE; Firefox; Opera; Safari; Chrome
• Search Engines: google;
• email: hotmail; gmail
• social media: facebook; blog; twitter; plunk; Flicker
• Shopping: Amazon
• Pinterest

有趣或有用的網站

• 數位超級美女
• 毛毛蟲奧運表演
• 洛杉磯時報
• 紐約時報
• 時代雜誌
• 新聞週刋

頭條新聞2012

以下的新聞，可能對你的網路傳播觀念有所啟示。
12月

1. 8 internet of thins

9月

1. 27 The Top 30 Pinners You Should Follow Now
2. 2012年美國5o個最佳網站

4月

1. 8 臉書惹禍 男遭亂棒打死 曖昧約人妻 激怒妒夫

2月

1. 24 社群新聞／西班牙科技阿媽 戳破網路假象
2. 24 http://www.behance.net/gallery/Grandmother-Tips-Vol-20/2960437

2012必看的部落格

• 屋子失火，你會帶走哪些家當？
  http://theburninghouse.com
• 藝術獨存
  http://theonlymagicleftisart.com
• 鏡頭當記者
  http://fotojournalismus.tumblr.com/
• 穿戴得像大人
  http://putthison.com/
• 你我的時尚
  fromme-toyou.tumblr.com
• 收拾整齊
  http://thingsorganizedneatly.tumblr.com/
• 衣著的流行與歷史
  http://omgthatdress.tumblr.com/
• 精明是好事
  http://www.itsokaytobesmart.com/
• 老舊的廣告
  http://oldads.tumblr.com/
• 錢不重要,只在不夠時才重要
  http://www.moneyisnotimportant.com/
• 不消費--舊物再用
  http://unconsumption.tumblr.com/
• 芝蔴街--學齡前的影片能給你養分
  http://sesamestreet.tumblr.com/

資料來源
30 Must-See Tumblr Blogs