僑光行政人員訓練課程Frontpage網頁維護鄭瓊芬鄭瓊芬 (cfchengocit.edu.tw)Oct. 20, 2004WWW簡介WWW(Word Wide Web)全球資訊網是1989年歐洲高能粒子協會一個研讨小組所開發的一種全新的Internet服務，WWW能夠在網路上傳送圖片、文字、影像、聲音等多媒體資料，由TimBernersLee領導的小組所開發的主從架構分散式網路服務系統。WWW的基礎-名詞解說 WWW的架構-說明WWW全球資訊網屬於一種主從架構的系統。主端是伺服端(Server)：指的是Web伺服器，在伺服器上儲存著HTML文件等網頁文件和圖片等多媒體資料。從端是客戶端(Client)：运用者執行瀏覽程式的電腦，負責和伺服器溝通和讀取伺服器的資料，也就是HTML文件。 WWW的架構-圖例Web伺服器儲存客戶端請求的資料，以微軟來說就是IISInternetInformationServer，從端是运用瀏覽程式顯示伺服端文件，微軟的InternetExplorer是目前巿場佔有率最高的瀏覽程式。 WWW的架構-WWW採用Hypertext TransferProtocol通訊協定將伺服器的資料傳送到瀏覽程式，伺服器在架構上處於被動角色，等待运用者藉著瀏覽程式提出瀏覽的HTTP請求，Web伺服器針對請求進行檢查，假设沒有問題就開始傳輸資料，傳輸的資料為HTML文件和相關的多媒體檔案。網站運作的概念 網頁的製作流程網頁與首頁何謂網頁？透過瀏覽器在WWW上所看到的每一個畫面都是網頁(WebPage)何謂HomePage(首頁)？進入一個網站時所看到的第一個網頁功能：負責導覽及介紹最新音讯網站就是網頁的集合設計者先把整個網站架構規劃好,然後再分別製作出不同的網頁,讓網頁間彼此相連。這樣完好的架構就稱為網站網站放在哪裡普通網站放置在稱為伺服器(Server)的電腦中,除了伺服器在維修或壞掉時關機,其餘時間都可瀏覽除自行架設伺服器外,普通個人與小企業、任务室,可向ISP(InternetServiceProvider網路服務提供者)申請,在他們的伺服器上租一塊空間放置網站 網站與伺服器網頁技術靜態網頁靜態網頁網頁是由網頁是由HTML所撰寫，無論在何時何地瀏覽，皆所撰寫，無論在何時何地瀏覽，皆呈現一样的畫面與內容，且运用者僅能瀏覽，無法呈現一样的畫面與內容，且运用者僅能瀏覽，無法提供訊息給網站，讓網站回應运用者的需求。提供訊息給網站，讓網站回應运用者的需求。動態網頁動態網頁網頁是由網頁是由 JavaScript, VBScript, ASP, PHP, JSP所撰寫，讓網頁能夠按照不同的情況做出動態所撰寫，讓網頁能夠按照不同的情況做出動態回應回應網頁美工網頁美工在網頁中参与圖檔及動畫等，常用之軟體為在網頁中参与圖檔及動畫等，常用之軟體為PhotoImpact, Photoshop, Flash.什麼是什麼是 HTML在瀏覽程式中所看到的內容原始的文件內容(執行檢視/原始檔命令)HTML 文件結構文件結構標籤(tag)由小於“符號組成普通文字Ex：旗標出版公司根本的標籤HTML文件最根本的標籤：1.文件的開始與結束2.標示文件資訊3.標示本文4.文件標題HTML 根本架構網頁的組成元素文字圖片超連結其他元素網頁文字網頁元素中最根本、最重要的內容優勢：檔案小、速度快所佔的檔案空間非常小(一個中文字2Bytes)進入一個純文字的網頁時,大約只需1、2秒鐘就可以看到整篇網頁可利用HTML的語法以及新的CSS樣式表來改變颜色、格式與大小等屬性,滿足不同的設計需求變換網頁文字的限制瀏覽者的電腦裡假设沒有網頁中运用的字體,瀏覽到該網頁時,就只能以系統預設的字型顯示解決方法可將把網頁文字做成圖形,不過檔案大小會增大很多關於網頁圖片常應用在WWW上的圖形有JPG、GIF和PNG幾種格式這些格式除了具有壓縮比例高的特性之外,也具有跨平台的優點不论瀏覽者用的是什麼作業系統,都能直接在瀏覽器上看到這幾種格式的圖片網頁圖片的應用關於超連結點選頁面上超連結可以：像穿越恣意門普通迅速到達要去的地方下載檔案寄給網站的主人.網頁中不論是文字或圖形都可以加上超連結標記超連結的種類連往別的網站的外部超連結連結本人網站內部WebPage的內部超連結連結同一頁面中部分內容的書籤連至檔案以下載之的下載超連結可以寄的超連結按下或滑鼠移上時可以啟動程式產生特效的超連結其他元素表格、表單聲音、影像、多媒體程式特效其他各類多媒體Plug-in表格、表單表格在網頁中的运用：可以做為普通表格运用無邊框的表格常被利用來做網頁整體排版表單在網頁中的运用：表單是網頁與伺服端程式溝通的主要工具討論區、留言版、會員登錄等均常运用表單功能聲音、影像、多媒體在網頁的應用設定背景音樂利用ActiveX控制項或其他方式將音樂和影像、多媒體(如Flash動畫等)插入網頁中播放程式特效利用Script程式或是JavaApplet之類的程式可以在網頁中製造各類效果常見的特效：跟著滑鼠移動的文字、水中倒影網頁的設計考量不同瀏覽器的觀看效果螢幕解析度與颜色顯示字型與語系的設定考量網路的傳輸速度不同的瀏覽器Netscape和InternetExplorer所援助的HTML標籤就有些許不同,因此在網頁中所製作的效果能够會因為瀏覽者所运用的瀏覽器不同而呈現不一樣的效果运用者运用的瀏覽器設定也會影響網頁的外觀螢幕解析度在高螢幕解析度下設計的網頁,在低解析度螢幕上觀看時,會呵斥捲動好幾次頁面才干看到原設計的網頁目前來說,800X600解析度的設定值應該是符合最多人的需求可以在首頁中宣告一下最正确的瀏覽解析度,讓瀏覽者有個依據字型與語系網頁製作時要設定對應的語系編碼例如,做繁體中文網頁就要將網頁的語系設為Big-5繁體中文,這樣才干防止網頁中的文字出現亂碼設計網頁時,最好少用特殊字型,假设一定要用,那麼无妨把它作成圖片網路的傳輸速率哪些網頁內容會影響網路的傳輸速率？含有超大圖檔VRML虛擬實境影音多媒體檔案.在設計網頁時,除非必要,不然別放入過於龐大的檔案FTP 簡介 FTP(FileTransferProtocol)是一種檔案傳輸通訊協定。這項服務主要是讓运用者在網路上傳輸檔案。方法為登入有提供FTP服務的主機，然後將檔案從硬碟(近端機器)傳輸至該主機(遠端機器)，或是將該主機上的檔案傳輸至硬碟。FTP 簡介下載FTP軟體1.開啟IE,輸入ftpftp.ocit.edu.tw2.開啟upload目錄下載ffftp.exe(點兩下儲存)3.安裝ffftp.exeFTP 簡介如何連上FTP：單位網頁個人網頁主機w3.ocit.edu.twsun2.ocit.edu.tw帳號單位帳號僑光email帳號密碼單位密碼僑光email密碼FrontPage 簡介FrontPage 簡介FrontPage 簡介FrontPage 可分成網站及網頁方式。網站方式的作用, 是方便我們進行網站內檔案的全盤掌控與管理, 按下網站鈕可切換至該方式。按下網頁標籤則可切換到網頁方式, 此方式會顯示網頁的內容, 也就是我們實際編輯網頁的場所。網站的 6 種檢視方式資料夾檢視方式遠端網站檢視方式報告檢視方式導覽檢視方式超連結檢視方式網頁的 4 種檢視方式設計檢視方式分割檢視方式程式碼檢視方式預覽檢視方式建立新的網站建立新的網站選擇網站範本對於初次接觸網頁設計的人, 可從個人網站這個範本下手, 只需套用佈景主題, 再打一些文字進去, 就能快速完成個人網站。假设他想白手起家, 可選擇單頁網站或空白網站。前者會建立一個空白的首頁, 後者則無, 但同樣都可以讓他從頭開始規劃網站內容。指定網站資料夾FrontPage 會事先在C:My Documents裡建立一個My Webs資料夾, 做為網站的根目錄, 他可以將本人的網站指定為子資料夾, 例如C:My Websmyweb；也可以將網站放在電腦中的其它位置, 如D：Test, 只需方便本人管理就行了。輸入文字請開啟一個 .htm 檔, 將網頁切換到設計檢視方式中：網頁維護開啟下載之網頁利用Frontpage功能編輯完成後存檔利用FTP上傳至主機網站維護留意事項假设為個人網頁，一切的網頁檔都必須放在這個www目錄內才干夠被瀏覽。(w3則無此限制)假设日後要維護您的網站，請覆寫已存在的舊檔案即可。假设看不到新網頁的內容，別忘了按下瀏覽器重新整理按鈕以讓瀏覽器重新获得新網頁的內容。假设您的網頁還是無法瀏覽，請再次確認以下重點：能否將網頁全部放置在www目錄下。首頁能否命名為index.htm或index.html。個人網址能否正確，應為httpocit.edu.tw/帳號。單位網址能否正確，應為httpw3.ocit.edu.tw/帳號圖形或其它網頁路徑能否為相對路徑、路徑能否正確。