Event


00.13.01 Adobe CaptivateeLearning)- Webpage

 


 這裡的 Webpage,指的是 傳統的網頁,即:文字圖檔Gif 動畫
 不要覺得傳統的網頁就很簡單,光是要您擺上一些數學公式,九成九的網頁設計師就開始求爺爺、找奶奶了 !!



 1. 文字

   所有的網民初上網時,都是以文字為主
   譬如 MSN, BBS ( 電子佈告欄, 如 PTT ), Message Board ( 留言板 ), Forum ( 論壇 ), Blog ( 部落格 ), MicroBlog ( 微型部落格, 如 Plurk, Facebook ), ...

   文字是 eLearning 的主軸,但只有文字卻很難表情達意,所以最傳統也最不可被替代的 eLearning 就是 圖文教學

   文字的輸入有幾種方法:
   ‧手寫 ( 手寫板 ) 輸入,速度最慢,但適合不熟中文輸入法的電腦初學者
   ‧就打字囉
   OCR ( Optical character recognition ) 文字辨視,如 丹青,即把圖檔中的文字轉成文字檔
   Windows 內建的語音輸入 ( 語音轉文字 )

   4 eLearning 的執筆者,除了 打字的速度不能太慢 之外,文采幽默感 也得有一定的程度


 2. 影像

   圖檔是 eLearning 僅次於文字的重要元素 ( 縱視訊教學已漸為主流,但依舊無法替代圖文 )

   4 eLearning 的執筆者,一定得使用 Photoshop,如此,創意才不會受限、才可以編製出適切的 jpg背景透明的 png


 3. Gif 動畫

   雖然 Flash 已經佔領整個網路動畫的市場,但很多時後還是得使用 Gif 動畫
   編製 Gif 動畫的軟體非常多:
   Photoshop 已經把 Adobe 以前搞 Gif 動畫的 ImageReady 整併進去了
   Ulead Gif Animator 可以直接載入 Photoshoppsd 再來搞 Gif 動畫

   4 eLearning 的執筆者,要嘛就是使用 Photoshop 來搞 Gif 動畫,不然就使用 Ulead Gif Animator 來搞 Gif 動畫


 4. 向量

   當年,Adobe 推出 LiveMotionSVG 來撲殺 MacromediaFlash
   結果,Adobe 落敗,於是乎 SVG 送給 W3C 當網頁 向量圖 的標準
   後來,Adobe 併購了 Macromedia
   現在,SVG 重生了,未來的瀏覽器都會支援 SVG

   編製向量圖的軟體也非常多:
   ‧免費的 InkScape
   ‧免費的 OpenOffice.org Draw
   Namo WebCanvas
   ACD Canvas
   Xara Xtreme
   CorelDRAW
   Adobe Illustrator

   4 eLearning 的執筆者,若是要編製 SVG 檔:
     ‧簡易的繪圖,請用 Namo WebCanvas
     ‧精緻的繪圖,要嘛使用 Illustrator,不然就使用 CorelDRAW


 5. 數學公式

   高階的數學軟體有:Maple, Matlab, MathCAD, Mathematica,但筆者並不是要介紹這些,筆者要介紹的是 簡易的數理公式排版
   ( 題外話:WolframAlphaMathematica 作者 Stephen Wolfram 的最新作品,主參考, 次參考 )

   4eLearning 的執筆者 ( 如國中小, 高中, 大學的數理老師 ),若是不會 簡易的數理公式排版,那又如何編寫 eLearning 的教材呢 ?!

 OpenOffice.org Math:很工程師思維,有語法欄, 符號小視窗, 公式小視窗,但不是很順手

 Microsoft Word:非常好用的數學公式 ( 方程式 ) 編輯器,如果再安裝 Word 2007 Add-in: Microsoft Math,那更是如虎添翼
.
 Microsoft Math:前面提到的 Word 2007 Add-in: Microsoft Math,只是精簡版,本例是完整版
.
 Namo WebEditorOpenOffice.org MathMS Word 都是 文書 軟體,其中的方程式編排功能,都是附屬的,但不錯用
             Namo WebEditor 則是 網頁編製 軟體,其中的方程式編排功能,也是附屬的
             ( Microsoft Math 比較難定位,因為除了方程式編排之外,Microsoft Math 還有計算與繪圖等功能 )
.
 Math Type:最知名的方程式編輯器
.
 FramemakerWord + MS Math + Math Type = 自成一個體系,那 Adobe 呢 ?!
           Namo WebEditor 的方程式屬於 入門級, 網頁級,故品質與效果都很有限
           Microsoft WordOpenOffice.org Math 的方程式則是 辦公級, 文書級,品質與效果雖然比 Namo WebEditor 好不少,但還是達不到專業級
           Adobe 當然沒有在數理排版上缺席,Adobe 一堆都有更新 專業級, 排版級 的軟體, Framemaker
.
 LaTex:最正統的數學公式排版,就是 LaTex


 6. PDF

   1973 年,PARCXerox Alto ( 這是個人電腦的濫觴:全錄的 PARC 實驗室推出全世界第一台個人電腦,圖形化的 UI, 滑鼠, 雷射印表機, 印表語言, 乙太網路, ... )
.
   1975 年,Microsoft 成立
.
   1976 年,Apple 成立 ( MicrosoftApple,都曾到 PARC 實驗室去巧取豪奪 Xerox Alto 的各種技術與人員 )
.
   1980 年,DOS ( Apple II 大賣後,IBM 才開始留意個人電腦:IBM 製訂規格,CPU 交給 Intel 做,OS 交給 Microsoft 做 ← Bill GatesIBM 之急,買了一個 Dirty DOS 就騙 IBMMicrosoft 擁有自己的 OS )
.
   1982 年,Intel 推出 80286
        Adobe 成立 ( Adobe 的老闆,就是 PARC 印表語言的技術首腦:帶著印表語言的技術出走、成立了 Adobe )
.
   1984 年,Apple 推出 Mac ( 從 PARC 偷走技術與人員後,Apple 推出叫好卻不叫座的超貴個人電腦, 圖形介面的 LisaLisa 的精簡版就是大大成功的 Mac )
        Macromedia 成立 ( Lisa / Mac 讓全世界大大地驚豔,於是乎很多軟體公司就紛紛成立,Macromedia 就是當時成立的一家 )
.
   1985 年,Microsoft 推出 Windows 1.0 ( Apple Lisa 加快了 Microsoft 推出圖形介面 OS 的時程:第一代的 Windows,可是被全世界嘲笑為世界爛的 OS )
        Adobe 推出 PostScript ( Adobe 成立三年了,終於推出了印表語言 PostScript:後來 PostScript 變成了印刷界唯一的標準語言,這讓 Adobe 賺盡了大錢 )
        Corel 成立 ( 如同 Lisa / Mac 推出後,一堆軟體公司紛紛成立:Windows 推出後,也開始有軟體公司成立 )
.
   1987 年,Adobe 推出 Illustrator ( Adobe 第一個應用程式:基於 PostScript 標準所編寫出來的 Illustrator )
        Microsoft 推出 DOS 3.3 ( Bill Gates 很務實:Windows 暫時賺不了錢,但 DOS 可以 )
.
   1990 年,Adobe 推出 Photoshop ( 在 Adobe 的眼中,只有 PostScript-basedIllustrator 才是嫡系,Photoshop 只是 Adobe 代銷 的產品 ← 直到 Photoshop 4.0Adobe 才買下 Photoshop 的所有權 )
.
   1991 年,Microsoft 推出 DOS 5.0 ( PC 能賺錢,所以 Microsoft 還是一直在推 DOS )
        Adobe 推出 Premiere ( 當時有另一套既非 Mac, 也非 PC, 還專注於視訊剪接的電腦系統, Commodore Amiga,所以 Adobe 也就順勢推出了 Premiere )
.
   1992 年,Microsoft 推出 Windows 3.1 ( 不想丟掉賺錢的 DOS,又不得不推出圖形化 OS:所以 Microsoft 就推出 based on DOSWindows 3.1 )
        WWW released by CERN ( 是的,WWW 很早就問世了 )
.
   1993 年,Intel 推出 Pentium ( PC 真正起飛是從 Pentium 開始 )
        Adobe 推出 Photoshop for Windows ( Adobe 已把重心從 Mac 轉向 PC )
        Adobe 推出 Acrobat ( Acrobat 很早就推出了 )
.
   1994 年,AdobeAldus,這是 Adobe 最重要的併購案 ( 至此,Adobe 深知併購才能壯大之道 !! )
        取得了 Pagemaker, After Effects, ...
.
   1995 年,Microsoft 推出 Windows 95 ( MicrosoftGUI OS 從此開始起飛 )
        Adobe 推出 Photoshop 3.0 ( Photoshop 最重要的版本, 3.0:支援 Layer,因此大獲好評 )
.
   1996 年,Microsoft 推出 IE 3.0 ( 網路大戰的戰鼓響起了,Microsoft 推出 IE 3.0 來攻打 Netscape:等到 IE 5.0 推出後,NetScape 就徹底被擊垮 )
        Macromedia 併購 FutureWave ( Flash 的前身 ) ( 網路的 RIA 號角也悄悄響起 )
.
   1997 年,Adobe 推出 Illustrator 7.0 ( Photoshop-likeUI ) ( CorelDRAW 節節進逼,Illustrator 直到把介面改成 Photoshop 的樣子,才重獲新生 )
        Macromedia 推出 Flash, Dreamweaver ( Macromedia光碟 製作市場轉換到 網頁 製作的市場 )
.
   1998 年,Google 成立 ( 山雨欲來風滿樓,Google 悄悄進入網路的市場 )
        Quark 惡意併購 Adobe 不成 ( 應用軟體已開始急速發展、輔之網路也開始竄起,Adobe 疲態漸現,Quark 想趁機而入 )
.
   1999 年,Adobe 推出 InDesign 來攻打 QuarkXPress ( Adobe 也開始反擊:丟棄老舊的 Pagemaker,推出 Photoshop UI-likeInDesign 來報仇 )
        Adobe 推出 GoLive 來攻打 Dreamweaver ( Adobe 的戰線越拉越長:左打 Quark、右打 Corel、還得旁擊 Macromedia,最重的是,Adobe 開始正視網路 )
.
   2000 年,台灣 921 大地震
        Intel 推出 Pentium IV ( P4 ),直到 P4PC 才開始跑得動多媒體
        Adobe 推出 LiveMotion 來攻打 Flash ( Adobe 已徹底地從只專注於 平面出版 的軟體公司轉型到兼顧 網路出版 )
.
   2001 年,美國 911
        Microsoft 推出 Windows XP, IE 6.0 ( Microsoft 活的最久的 OSWindows XPMicrosoft 活的最久的 BrowserIE 6 )
.
   2002 年,Adobe 推出第一代的 Adobe CS ( Adobe 開始把平面軟體與網頁軟體 套餐化 )
.
   2003 年,Macrmedia 到處瘋狂併購 ( Macromedia 也想藉由併購而壯大,好與 Adobe 對抗 )
        Corel 被併購下市 ( 多媒體軟體的市場開始大洗牌,Corel 第一家被洗出市場,直到 2006 年才重新在 Nasdaq 上市 )
        Adobe 併購 CoolEdit ( 後更名為 Adobe Audition ) ( Adobe 最缺的就是 Audio 軟體與 3D 軟體 )
.
   2004 年,Macromedia 推出 Flex ( Macromedia 開始把 FlashPlayer 擴展到可以與資料庫連結 )
.
   2005 年,Microsoft 正視 Flash 帶來的威脅,推出 Expression Studio ( Flash 已經紅到連 Microsoft 都不得不正視的地步了 )
        Adobe 併購 Macromedia ( 這是 Adobe 第二重要的併購案:打不贏 Flash, Dreamweaver,就乾脆把 Macromedia 整家公司買下來 )
        Adobe 推出 Soundbooth
        Adobe 推出 Adobe CS2
.
   2006 年,Autodesk 併購 Alias,取得高階的 3D 軟體, Maya
.
   2007 年,Adobe 推出 Adobe CS3
        Autodesk 併購 3D 塑型軟體, Mudbox
.
   2008 年,Adobe 推出 Adobe CS4
        Adobe 推出 Acrobat 9.0 ( Acrobat 從跨平台的文件閱讀器 → 在印刷方面 PDF 可以取代 PostScript → 現在已經可以置入 Flash / Flv3D )
        Autodesk 併購 Avid 的高階 3D 軟體, Softimage ( 至此高階的 3D 軟體:3D Studio MAX, Maya, Softimage,都是 Autodesk 的囊中物 )
.
   20104 月,Adobe 推出 Adobe CS5

   講了那麼多,主要有三個目的:
   第一、Adobe 除了 PostScript, Illustrator, Premiere, Acrobat 之外,其它的軟體都是併購來的 ( InDesign:從併購來的 Pagemaker 所改良的 )
      扣掉 PremierePostScript, Illustrator, Acrobat 這三者根本就是一體三面 
   第二、PDF 檔已經可以在印刷方面取代 PostScript ( 即令是 Microsoft Word,只要輸出成 PDF 檔,就可以印刷 )
   第三、不管是哪一家軟體公司被併購、不管是哪一家公司的軟體、不管是哪一種媒體格式,只要有 Acrobat,全都可以納入:
      ‧納入平面的檔案格式 ( 點陣圖、向量圖、OfficeHTML、... ),就可以 PDF 檔印刷
      ‧納入多媒體的檔案格式 ( 平面, Flash, Flv, 3D, ... ),就可以在網頁中觀看 PDF

   4 PDF 的教學可以參考 這一篇


 7. 網頁

   網頁編製的軟體非常多,以下只舉幾個知名的:
   Dreamweaver 毫無疑問是最強的網頁編製軟體
   Fireworks 可以同時編製網頁的點陣圖, 向量圖, HTML / CSS
   FrontpageMicrosoft 之前的網頁編製軟體,Frontpage 2003 以後,就不再更新
   Expression WebMicrosoft 用以取代 Frontpage 的網頁編輯器 ( 與 Expression Web 幾乎一模一樣的 Sharepoint Design 2007 現在可以免費下載 )
   Namo WebEditor 是高麗棒子的網頁編輯器,完全吸取 FrontpageDreamweaver 的優點,故 Namo WebEditor 大受歡迎
   NetObjects Fusion 是唯一 100% WYSIWYG ( 所見即所得 ) 的網頁編輯器,也因為是 WYSIWYG,所以其網頁編輯的功能並不突出


 8. XHTML

   XHTML = HTML + DIV + CSS
   但是目前並沒有好用的 DIV 視覺化編輯器,所以得自行 Coding
   4 GoogleBlogger,就是 XHTML 最佳的練習場 !!這一篇 中,筆者會提到一些 Blogger 的基本功能


 2010‧0406