方便直觀的編輯環境-進階頁面建立-長榮大學.pptVIP

Namo WebEditor 研習講義 長榮大學 師資培育中心 邱才銘 助理教授 Namo WebEditor是一套功能極強的網頁編輯軟體，操作界面簡易、人性化，而且有完善的網站管理功能，兼具許多重量級軟體的優點(如FrontPage、Dreamwaver)，不管是初學者或專業工作者，Namo 都能帶來不少助益，發展個人特色網站的好幫手。 方便直觀的編輯環境 Namo提供方便直觀的工作環境。 浮動、可銜接的「內容檢查員」視窗，可及時存取各種頁面元素經常修改的屬性。 利用WYSIWYG(what you see is what you get)編輯環境，輕鬆地建立動態網站，收到事半功倍的效果。   壹、執行Namo 至桌面Namo WebEditor圖示上，輕按滑鼠左鍵兩下即可。 也可從【開始】-【程式集】-【Namo WebEditor 5.5】-【Namo WebEditor 5.5】 編輯視窗 檢查員 可輕鬆地檢視和修改Web網頁文件中各種元素的主要內容。 它的內容隨著選擇不同的網頁元素而不斷變化。受支援的網頁元素包括表格、表格儲存格、表格列、影像、圖層及其他通用元素和文件本身。 它可在主視窗的任何邊，或浮於其他視窗的頂部。 貳、快速建立網站的架構 步驟一：從功能表列中選取【檔案】-【專案】-【網站精靈】。 網站精靈 選擇網站範本和佈景主題幾秒鐘即可生成一個完整的網站。共有 200 個預設好的佈景主題可供使用 另外也可以透過編輯現有佈景主題來建立新的佈景主題。 網站精靈可以新增、移動或移除網站元素，或新增文件。  步驟二：從網站精靈-[範本] 選擇所需套用:使用【教育網站】這個範本，選定後按【下一步】。 範本 提供各種預先設計好的文件、區段、網站等範本，使用這些範本可快速輕鬆地建立專業網站。  步驟三：從網站精靈-[結構] 複製 重新命名 上移 下移 升級 降級 佈景主題 佈景主題是可編輯的設計範本，可將其套用至網站中的所有或部分網頁。 在 200 個佈景主題，透過修改現有佈景主題來建立您自己的佈景主題。佈景主題元件包括按鈕、橫幅、文字樣式、連結色彩、背景色彩及其他屬性。 步驟四：選定佈景主題 佈景主題是網站風格的表現，不同的佈景主題有不同的色系編排、背景圖片、按鈕造型、文字選項等，可依自己的喜好來選擇。 【檢視佈景主題】可讓您先預覽該主題的內容。選定後請按【下一步】。 步驟五：輸入網站資訊 標題(網站名) 、作者、電子郵件地址以及著作權資訊。 輸入的網站名稱將用來作為索引頁的主標題，輸入的電子郵件地址將自動插入專案中每一份文件底部。輸入後按【下一步】。 步驟六：發佈網站 知道網頁伺服器就新增,與修改 按【完成】。 參、認識Namo 的環境： 執行Namo WebEditor後，會有兩個工具程式執行著，一是網頁編輯工具，另一則是網站管理者。 在製作網頁時，我們交互利用這兩個工具程式，隨時掌握網站的狀態，讓工作順利進行。 編頁編輯工具負責網頁的設計與編寫，除了基本的網頁要素元件可供選擇外，包括很多的靜態、動態的效果及資料庫聯結功能，網頁的修改也都是要用到它。 編頁編輯工具有三種工作模式： 【編輯】：提供視覺化的編排環境，一般都是在此狀態下工作。【HTML】：可看到網頁的HTML原始碼，如果您想加入特殊的程式碼，可以用F6切換到此模式。【預覽】：此模式可以預覽成果，一如使用瀏覽器觀看。 網站管理者有三種工作模式： 主要負責網站狀態與架構的呈現： 【網站】：呈現樹狀結構，目前專案網站的結構，最上方的是專案名稱，接著則是首頁，再來就是導覽列。 導覽列是分層級的，如第一層、第二層等，原則是進網站後最先看到的導覽列(有超連結的文字、按鈕或圖示)位於第一層，從第一層連結進去才出現的導覽列是第二層，依此類推。除了呈現結構外，如果要增刪、修改導覽列，也可以在此模式下進行，等一下會用到。 【報告】：顯示目前專案網站的所有檔案的狀態 【發佈】：將網頁上傳至網路主機上，在此之前您必須先知道您網頁所在主機的位址與您個人的帳號和密碼。 肆、修改網站的架構 例:班級網頁網站，從結構上來看包括【簡介】、【新聞】、【校友資訊】、【家長資訊】、【圖書館】及【酷站】，這些從導覽列的位階上來看都是位於第一層。 其中【簡介】又包括【學生】和【教職員】第二層導覽列，【圖書館】則包括【主旨1】、【主旨2】及【主旨3】等第二層導覽列。 按功能表列中的【專案】-【儲存專案】。 切換至編頁編輯工具中的預覽模式看成果 完成結構的修改後，要開始編輯各網頁中的內容了，一邊編輯內容，一邊也要開始學習各項Namo的各項工具 * * 模式標籤 狀態列 功能表列 文件標籤 文字工具列 標準工具列