2011年10月15日 星期六

台科大推廣教育中心Photoshop基礎應用班花絮

這篇其實早就該發,只是一直沒有時間整理上來,這是2011.7開始在台科大的Photoshop基礎應用班,以下為最後一天上課時拍攝的照片花絮。
紙本的問卷調查與教學廣播螢幕的畫面。
1

上課狀況,採用投影機與螢幕廣播兩種方式教學。
2 

學員們都很認真喲!還有一位同學之後還有幾次mail跟我聯絡,詢問問題與其他推薦書籍。
3

咦!我在指啥咧~?自己都忘記了!
4


課程裡有用到書上許多範例,但底下我貼幾個書本之外的範例。

A4 DM設計,人物去背、圖形特效運用、文字特效、整合Illustrator等。
10 

Gif動畫。
banner3
形象頁,切圖、Gif動畫、滑鼠互動效果。
11

次頁,切版、Gif動畫、滑鼠互動效果、Iframe。
12

這班名稱因為是有「應用」這兩個字,所以其實講了不少Photoshop在平面設計上與Illustrator整合,以及Photoshop在網頁設計上製作Gif動畫與Dreamweaver整合運用的觀念技巧。

這是在示範動作時,被偷拍的…
6

以下為動作三連拍。


擺剪刀勝利姿勢。
7

擺石頭姿勢,我還加了鬼臉。
8

擺布的姿勢。
9

希望學員們未來學習都順利與開心啦!


2011年10月10日 星期一

台灣科技大學推廣教育中心-InDesign數位排版班

InDesign是數位排版的首選軟體,無論是要進行書籍等長文件編輯,或是製作電子書,都能透過內建的創意工具與排版的精確控制,設計出動人的印刷或數位發行版面。

課程教學大綱:
  1. 排版軟體與印刷概觀、InDesign基本操作介面與工作環境介紹、加入文字、使用樣式與圖形、使用物件、檔案格式適用時機
  2. 尺規與參考線、各類框繪製、路徑管理員
  3. 建立與儲存自訂頁面、使用主版套用至文件、新增章節與頁碼編排
  4. 使用圖層、建立編輯文字與圖像框、變形與對齊物件、群組
  5. 手動排文、自動排文、自動建立串連文字框、內文編輯器、頁面文轉註釋、輸入與讀入文字、追蹤修訂、調整間距與欄位、更改段落對齊
  6. 建立與套用顏色、使用漸層、建立表格、長文件編輯與目錄、輸出與轉存

上課資訊:
  • 起迄時間:2011/10/18-2011/11/22
  • 上課時數:18小時
  • 上課時段:每週二晚上18:45~21:45
  • 報名費:NT$200
  • 學費:NT$3,600
  • 上課地點:台北市大安區基隆路四段43號台科大教室
詳細課程內容與線上報名&洽詢,請至台灣科技大學推廣教育中心課程網頁:http://cec.ntust.edu.tw/CourseInfo.aspx?id=1175


2011年9月18日 星期日

「網路免費資源行銷術-部落格+Facebook+微網誌超Easy」書中資料勘誤與更新補充懶人包

網路資訊的變遷很迅速,雖然「網路免費資源行銷術-部落格+Facebook+微網誌超Easy」這本書還算新書,但部分內容已經需要做些變更調整,身為一位沒良心有良心的作者,在此彙整開一篇本書的懶人包勘誤與補充如下,不定期更新…
  1. P.1-3頁的http://who.is網址,若有遇到連線緩慢與查詢資料有問題,建議可以改用https://www.webnic.cc/cgi/whois_captcha.cgi?lang=tw
  2. P.4-1頁的Yahoo!奇摩免費網站推薦登錄付費優先登錄,目前均已經取消此服務,Yahoo!官方已經正式公告使用微軟bing搜尋技術,對於SEO優化操作也將會有重大的影響,可參考這篇「Yahoo SEO自然搜尋排名重大變更,Bing搜尋重要性大增!」。
  3. P.4-1頁的搜尋引擎基本登錄之前或登錄後一段時間,若想要知道自己網站究竟有無被搜尋引擎收錄,可以參考這篇得知有無被搜尋引擎登錄索引記錄的語法。
  4. P.4-5頁的評估關鍵字熱門程度,也可以多參考Yahoo!奇摩搜尋榜來得知最近熱門被搜尋的關鍵字。
  5. P.4-26頁若還想要了解SEO的精義,可以觀看這篇文章SEO之歌,用一首歌內的歌詞,淺顯易懂的說明的SEO優化的大方向。
  6. P.4-47頁智邦網摘MyShare網址已失效。
  7. P.5-19~5-21頁裡的「固定FBML」內容已經無法使用,請改用這篇「在Facebook粉絲專頁中設計歡迎頁的功能 」裡的IFRAME APP功能來取代。
  8. P.5-39頁裡twitter的「Find People」選項,改放在新的主選項「Who to follow」裡面。
    3
  9. facebook的粉絲專頁,目前新功能為可以選擇「以專頁的身分登入」
    1

    以往用個人身分登入粉絲專頁時,常會沒有注意到網友對以前文章的回應留言(因為管理者自己也很難去留意以前就問是否有人回應),造成對一些粉絲的服務疏失,但若選擇「以專頁的身分登入」後,即使粉絲是針對您很久以前的訊息回應,您也可以在「訊息」裡面看到,比較不會漏掉!
    2
  10. P.3-52到P.3-54頁裡,藍新科技ezpay金流服務網址變更如下紅字:
    已經由舊網址:https://mpp.neweb.com.tw/ezCashSimple/pay.jsp?merchantnumber=您的商家編號
    更換成新網址:https://aquarius.neweb.com.tw/CashSystemFrontEnd/ezpay/ezpayshop.jsp?merchantnumber=您的商家編號
  11. Google Blogger後台管理介面,已經有推出新版操作介面,但您仍可點選上方「切換回舊介面」,即可按本書內容操作練習。
    a1 
    其實新版介面,除了介面走清爽簡單風格之外,一些選項位置也有做調整,但大致上功能與操作觀念仍是與舊版一樣的,若您使用舊版介面後,仍想要切換到新介面,可以點選「試用更新的Blogger介面」。
    a2
  12. 第五章中,5.2.3小節介紹的twitter已推出繁體中文版介面,請參考這篇「twitter推出繁體中文版介面囉~!」。      

本書內容錯字勘誤表:

章節頁數 原來的內容 建議修改的內容(紅字為校正)
1-10 表格-賣方4P下方
Product)
(Product)
2-5 第一行
http://www.blog-ger.com
http://www.blogger.com
2-11 最後一行
請在如右圖網頁裡,
請在如圖網頁裡,
2-13 第三張圖左側文字第一行
http://google.com/sup-port/
http://google.com/support/
3-33 第四張圖左側文字第四行
http://stat-counter.com/register.php
http://statcounter.com/register.php
3-34 第一行
可以登入StacCounter
可以登入StatCounter
3-52 第一段最後一行
35元~30,000元的之間
35元~30,000元之間
3-72 第二段第二行
「確定」
送出
3-78 3.5.3小節,第一段第四行
同時它也能提供提供統計訂閱
同時它也能提供統計訂閱
4-5 01.下方第一行文字
http://tw.emarke-ting.yahoo.com/ysm/guide/index101.html
http://tw.emarketing.yahoo.com/ysm/guide/index101.html
4-33 第二段第一行
http://www.goin-gup.com/
http://www.goingup.com/
4-36 第三段第三行
先存檔(儲成成草稿不會有作用)
先存檔(儲成草稿不會有作用)
4-37 第三行第五段
文章檔名為有意義的的英文
文章檔名為有意義的英文
5-23 第一段第二行
http://www.face-book.com/apps
http://www.facebook.com/apps


若您仍有發現本書有任何錯字、錯誤,或者介紹的某網路功能已經停止服務或有重大更新,歡迎您聯絡告知我


2011年9月16日 星期五

twitter推出繁體中文版介面囉~!

之前我在2011年3月份寫「網路免費資源行銷術-部落格+Facebook+微網誌超Easy」這本書時,有提到twitter方面有訊息說會推出繁體中文版,但一直以來都仍處於「只聞樓梯響」的階段,現在twitter終於推出繁體中文版的介面囉!介面中文化應該會有助於twitter在華人地區市佔率上的提升,看來Facebook、Google+、Twitter、Plurk等網路服務,接下來又將進入更激烈的競爭纏鬥了,雖然維護更新管理上需要花費更多心力,但以網路行銷層面來說,應該很樂見各種網路宣傳管道的蓬勃發展,大家對於twitter的經營也要更加以重視囉!

而原本twitter的介面,要如何改成繁體中文介面呢?可以在登入您的twitter後,在右上角選擇「Settings」。
1

在「Account」標籤的「Language」裡,選擇「Traditional Chinese - 繁體中文」。
2

按下「Save」鈕,匯出現在次請您輸入密碼的視窗,輸入密碼後再後按下「Save changes」鈕,就可以完成設定囉!
3

後台中文介面下圖所示。
4

前台變更為中文介面如下圖所示,雖然網路上有人認為翻譯的中文用詞有些非台灣慣用語,不過畢竟看到中文介面還是會感到更親切啦!相信twitter推出中文版在地化後,在台灣市場應該能有更為快速的成長,也值得大家後續密切關注其發展。
5

也歡迎大家加入我的twitter啦!


2011年9月13日 星期二

Yahoo SEO自然搜尋排名重大變更,Bing搜尋重要性大增!

之前傳聞許久的Yahoo搜尋要全面採用微軟Bing的搜尋技術,目前終於看到Yahoo官方正式公告了,詳情可見 http://tw.emarketing.yahoo.com/ysm/11_news_detail.php?news=88 ,這也就表示,之後在Yahoo上的搜尋技術,將以Bing的搜尋演算技術為主,這對於SEO技術與市場上來說,是個很大的變革。


尤其是Yahoo對台灣網路搜尋引擎市場的高市佔率,可以說是影響台灣大部分企業在網路上的曝光與行銷,所以對於在Bing上的自然搜尋排名,也就更值得大家多關注與持續研究(以往Bing搜尋上的排名可能大家比較少重視)。
Yahoo官方正式公告的原文如下:



【公告】自然搜尋移轉通知
發佈日期:2011-09-07
親愛的客戶,Yahoo!奇摩將於9月15日進行自然搜尋移轉,以下事項敬請注意:

1. 不影響客戶的關鍵字廣告排序

2. 移轉後自然搜尋結果(關鍵字廣告下方)與排序邏輯、運算法則由微軟Bing提供。

欲了解微軟Bing的搜尋引擎相關資訊請上 http://www.bing.com/toolbox/webmasters/



Yahoo奇摩與微軟搜尋聯盟熱門問題:http://tw.help.cc.yahoo.com/help_cp.html?product=40



2011年9月1日 星期四

台北護理健康大學推廣教育中心-網頁設計基礎班

本課程將帶領您,學會Dreamweaver與Fireworks這兩套軟體基礎設計與整合運用(採用軟體為CS5新版),課程中規劃了讓學員專題製作與輔導的時間,期望學習完本課程的學員,除了能夠自行設計自己的公司或個人網頁之外,能學習導入業界的實務設計經驗與軟體整合運用,並申請網頁空間,將成品上傳到網路上供網友瀏覽,擁有到相關行業任職或兼職接案之技能。

課程教學大綱:
  1. HTML與XHTML觀念與初探、簡易色彩學觀念與網頁設計軟體的認識
  2. Dreamweaver基本環境操作、網站管理、路徑與網頁編碼觀念、目錄與檔案的命名
  3. 網頁基礎圖文編排、認識網頁的圖檔格式、表格網頁佈局編輯、超連結的各類運用
  4. Fireworks基本環境操作、簡易影像處理、Banner繪製、決定專題製作主題
  5. 選單圖形繪製、Gif實體補間動畫製作、版型繪製與切割網站版型
  6. 使用動態網站範本、Dreamweaver與Fireworks整合運用、專題資料蒐集
  7. 專題實作與個別指導
  8. 申請免費的網站空間、檔案上下傳、各類網站狀況報表、作品觀摩與建議

上課資訊:

起迄時間:2011.10.23~2011.12.11 (8週)
上課時數:24小時
上課時段:每週日上午9:30~12:30
費用:NT$3,000
上課地點:台北市北投區明德路365號
詳細課程內容與線上報名&洽詢,請至台北護理健康大學推廣教育中心課程網頁:http://extensionedu.ntunhs.edu.tw/files/14-1007-6430,r433-1.php


2011年8月24日 星期三

玉山青年學社-第四期青年志工研習營-社群經理必修的十堂課

我應玉山青年學社邀請,擔任第四期青年志工研習營-社群經理必修的十堂課的講師,負責裡面「創意秘笈-啟發網誌靈感的泉源」這個單元1.5小時課程,這個活動目前雖已停止報名了,但還是放上來給大家參考,因為這個學員的目標族群是青年,因此有設定年齡限制,要「幼齒」一點的才能參加呦!

※ 參加人員資格:
預計邀集60位青年學子參與
  1. 18-35歲之青年朋友(非大專院校在學學生亦可)
  2. 懂電腦操作,擅MS OFFICE
  3. 應具備網路應用能力:(符合一項即可)
    a.個人BLOG五篇文章以上
    b.已申請Plurk帳號,好友數20人以上
    c.Facebook 好友或粉絲數20人以上
  4. 對網路社群經營有高度興趣,並願意長期學習者,熟悉網路社群,並熱愛在
  5. 社群中與人接觸互動

※ 營隊課程內容說明:
  1. 七億人的串聯-經營社群前要做的功課
  2. Community Manager-網路新知100問
  3. 社群行銷組合餐-FB、PLURK與Blog的結合與運用
  4. 創意秘笈-啟發網誌靈感的泉源
  5. TopKing-百萬粉絲社群經營術分享
  6. 社群經理的挑戰-以政治人物網路經營為例
  7. 企業參訪(暫定)
  8. 社群經理高峰會-成果發表
  9. 異想&問答-鄉民綜合座談
  10. 小組時間
詳細資料可參考:http://www.facebook.com/event.php?eid=149345405144768


2011年8月22日 星期一

台北護理健康大學推廣教育中心-部落格網路行銷班

低價優質課程來囉~!本課程以低成本部落格入手,撰寫圖文並茂文章,以SEO技巧搜尋曝光,善用網路資源來擴充與分析,達成網路行銷目的!此課程採用的書籍,是我自己寫的網路免費資源行銷術-部落格+Facebook+微網誌超Easy

課程教學大綱:
  1. 網路行銷要知道的觀念與模式、看看成功的部落客怎麼做
  2. 免費部落格基礎建置快速上手
  3. 怎樣寫部落格文章比較好,撰寫工具與方法的運用
  4. 部落格美化與數據分析評估
  5. 部落格的進階擴充增強戰力,部落格式的商店建立
  6. 部落格的SEO優化曝光行銷方法

上課資訊:

起迄時間:2011.11.13~2011.12.18 (6週)
上課時數:18小時
上課時段:每週日上午9:30~12:30
費用:NT$3,000
師資:蘇東偉
上課地點:台北市北投區明德路365號
詳細課程內容與線上報名&洽詢,請至台北護理健康大學推廣教育中心課程網頁:http://extensionedu.ntunhs.edu.tw/files/14-1007-6431,r433-1.php


2011年8月11日 星期四

Expression Web 4 升級 SP1 與 SP2 後的變革 - SuperPreview 的新演進

這是一篇我幫台灣微軟官方撰寫的Expression軟體系列文章之一,主要是講述ExpressionWeb4更新到Service Pack2之後,SuperPreview這個軟體也跟著進化的新功能,除了有刊載在Microsoft Expression官網之外,也同步放在此部落格上供您瀏覽參考!

首先,若您還不了解什麼是SuperPreview,或是想了解其基礎操作,可參考之前筆者撰寫的這篇「如何使用 SuperPreview 功能做網頁視覺診斷」或在SuperPreview按下鍵盤上的「F1」鈕參考說明檔,本文將以介紹SuperPreview的新功能為主。

ExpressionWeb4更新到Service Pack2後,SuperPreview的功能也跟著越來越強大,本次主要增加了兩大特色功能:「遠端瀏覽器」與「頁面互動模式」,下圖畫面為筆者撰寫本文時,SuperPreview線上服務可支援的瀏覽器廠牌與版本(要知道最新支援的狀況,可以到 http://status.superpreview.com/status_zh-TW.htm 查看),也就是說,只要使用新版的SuperPreview並且維持網際網路暢通,您的電腦就可以不需要安裝這些版本的瀏覽器,但仍然可以透過SuperPreview,來進行對多種瀏覽器的網頁開發測試。

1

要使用「遠端瀏覽器」的功能,您必須點選位於SuperPreview介面右上角的「註冊SuperPreview線上服務」鈕。
2

出現如下圖的畫面後,請按下「註冊」鈕。
3

輸入您的電子郵件信箱後(請填寫您實際有使用的E-Mail),按下「下一步」鈕。
4

系統會立即發送一封認證的電子郵件到您的信箱裡。
5

稍等一下再去收電子郵件(若沒有看到請確認之前填寫的E-Mail是否有誤,或是確認有無被歸到廣告信夾裡),會收到一封主旨為「SuperPreview online service Beta activation」的郵件(內容如下圖),請點選此郵件裡的驗證超連結網址。
6

驗證成功則會出現如下圖的畫面。
7

請回到SuperPreview線上服務啟用介面裡,按下「啟用」鈕。
8

如此就完成了整個遠端瀏覽器線上服務的啟用程序,按下「結束」鈕離開此介面。
9

接著我們要啟動遠端瀏覽器的功能,下圖為尚未啟動前的畫面,筆者電腦因為已有安裝Internet Explorer9.0版與Firefox3.6版,所以「本機端瀏覽器」會出現IE6、IE7、IE8、IE8相容性檢視、IE9與Firefox3.6,而「遠端瀏覽器」裡目前呈現的是灰色無法使用的狀態圖示。
10

請點選位於SuperPreview介面右上角的「使用遠端瀏覽器啟用或停用預覽」鈕(此處原本為「註冊SuperPreview線上服務」鈕,註冊完成會變成此功能)。
11

備註:若要重新註冊SuperPreview線上服務,可以點選位於SuperPreview介面右上角的「選項」鈕,裡面的帳戶管理有「停用」跟「刪除帳號」的功能。

如此「遠端瀏覽器」裡的各種瀏覽器圖示就會變成彩色的狀態,代表著可以選用。
12

請點選左方視窗裡的其中一個瀏覽器圖示,此時位於左下角的「基準線」,會出現以該瀏覽器為比較的基準(例如筆者選擇IE9)。
13

請點選右方視窗裡的其中一個瀏覽器圖示,此時下方的「比較」會出現該瀏覽器,您可以再繼續按下「新增」鈕,增加各種本機或遠端瀏覽器進來。
14

例如筆者點選增加「Safari5」瀏覽器的圖示。
15

可以按下「尺規」鈕,並在上或左右方的尺規上,按著滑鼠左鍵不放,拖曳參考線到畫面上,並可以開始切換「比較」區裡的各個瀏覽器圖示,以進行網頁上各區域的位置測試,例如下圖為IE9與Chome瀏覽器之間的測試比對。
16

或者可以按下「重疊版面配置」鈕,SuperPreview會將「基準線」與「比較」區裡選擇的瀏覽器,進行兩個畫面上的重疊,可以讓您快速觀察到,兩個瀏覽器解析出來的網頁差異性,例如下圖是IE9與IE6的各自呈現的網頁畫面加以重疊比較,能夠明顯看出來差異頗大。
17

上述的操作方式,是原本SuperPreview的舊功能,可惜缺點是只能用來查測一般靜態網頁,若要對使用程式資料庫構成的動態網頁進行測試,就顯得力有未逮(很多網頁必須經由程式抓取資料庫內容等複雜點選流程才能產生),但這個問題隨著「頁面互動模式」功能的推出,已經可以突破解決。

例如下圖為筆者使用Expression Web搭配Access資料庫,免Coding即可快速產生的ASP.NET通訊錄程式系統,前台並使用了主版頁面(.master)與CSS來完成版面架構,可以點選功能表裡的「網站」/「網站設定」。
18

在「預覽」的頁面標籤裡,勾選「使用Microsoft Expression Development Server」與選擇「僅PHP與ASP.NET網頁」。
19

如此就可以讓沒有IIS(Internet Information Services)環境的一般電腦,也能模擬執行成有ASP.NET程式語法的網站伺服環境。
20

例如下圖為執行起來的ASP.NET網頁,網頁檔名為callbook.aspx,可點選其中的「點選觀看」超連結點來進入該筆資料的細節內容。
21

如下圖畫面所示,顯示出來的詳細內容為傳遞 id值的callbookdetail.aspx,這是一種很常見的動態網頁類型。
22

以往舊版的SuperPreview,是難以查測如上所述的動態程式資料庫網頁,因為SuperPreview裡的原理,是把網頁快照成類似圖片格式後進行比對,所以無法再對裡面的超連結進行點選,不過目前新版有「頁面互動模式」功能,可以按下「使用頁面互動模式登入安全網站並瀏覽到您要預覽的網頁」鈕。
23

出現頁面互動模式視窗後,若頁面顯示不正確時,可以勾選左下角的「使用替代驗證」,來試看看是否能解決問題(若無問題可不勾選)。
24

此時您就可以在此視窗裡點選網頁上的超連結點進行測試。
25

出現到進一步的程式內頁畫面後,假如您要測試的為此畫面資料,希望檢查網頁美編版型是否因為資料動態帶入而被破壞,請按下「預覽」鈕。
26

此時會回到SuperPreview原本比對的畫面,例如下圖為筆者的動態程式內頁資料,分別在IE9與IE6的瀏覽器環境下呈現的狀況,很明顯看到在IE6的環境裡,版型有因為資料帶入而導致突出的問題需要修正!
27

您也可以點選位於右下角的「DOM」鈕,觀看不同瀏覽器解析出來的DOM樹狀檢視,來做為之後修改上的參考依據。
28

SuperPreview的「遠端瀏覽器」新功能,能夠讓您將主流的瀏覽器一網打盡,以進行不同版本間的仔細比對,可以節省不少交叉測試而產生的成本與時間,而「頁面互動模式」的新功能,搭配Expression Web的本機端Development Server功能,可以解決傳統美編人員長久以來的困擾(沒有伺服器、不能連網就不能測動態網頁),對於加上程式資料庫後的動態網頁版面呈現問題,也依然可以繼續利用SuperPreview內建的各項功能來進行檢查,這兩大新功能對於網頁開發者來說,都將會是非常實用的好技巧!



Related Posts Plugin for WordPress, Blogger...

訂閱RSS