《網(wǎng)頁設(shè)計》教案_第1頁
《網(wǎng)頁設(shè)計》教案_第2頁
《網(wǎng)頁設(shè)計》教案_第3頁
《網(wǎng)頁設(shè)計》教案_第4頁
《網(wǎng)頁設(shè)計》教案_第5頁
已閱讀5頁，還剩25頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進行舉報或認領(lǐng)

文檔簡介

經(jīng)典word整理文檔，僅參考，雙擊此處可刪除頁眉頁腳。本資料屬于網(wǎng)絡(luò)整理，如有侵權(quán)，請聯(lián)系刪除，謝謝！網(wǎng)頁設(shè)計教案第1頁共30頁課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜第一章網(wǎng)頁與網(wǎng)站基礎(chǔ)2通過本章的學習，學生應WWW、網(wǎng)頁與網(wǎng)站的關(guān)系；靜態(tài)網(wǎng)頁、動態(tài)網(wǎng)頁和動態(tài)服務(wù)器網(wǎng)頁；用HTML編寫靜態(tài)網(wǎng)頁的技術(shù)；網(wǎng)站建設(shè)的步驟。靜態(tài)網(wǎng)頁、動態(tài)網(wǎng)頁和動態(tài)服務(wù)器網(wǎng)頁之間的區(qū)別在采用的教學手電視錄象軟件名稱自制上機學時第2頁共30頁1、WWW簡介因特網(wǎng)實現(xiàn)信息共享的主要途徑是WWW服務(wù)。WWW是WorldWideWeb也叫萬維網(wǎng)，有時簡稱為Web。WWW服務(wù)的信息資源以Web網(wǎng)頁的形式組織在一起，Web網(wǎng)頁存放在WWW服務(wù)器里。因特網(wǎng)普通用戶在瀏覽器中輸入不同的WWW服務(wù)器地址就能看到不同的Web網(wǎng)頁。Web網(wǎng)頁中通過一種鏈接技術(shù)，可以實現(xiàn)Web網(wǎng)頁之間的連接與跳轉(zhuǎn)。2、網(wǎng)頁與網(wǎng)站的關(guān)系Web網(wǎng)頁，簡稱為網(wǎng)頁，一般是用HTML語言和其它Script語言編寫而成的程序文件。HTML是HyperTextMarkupLanguage的縮寫，即超文本標記語言；Script語言是嵌入式腳本語言，如JavaScript、VBScript、JSScript等。教學內(nèi)容需要保存成單獨的文件，然后才能嵌入到網(wǎng)頁文件中。一個WWW服務(wù)器里常常有許多網(wǎng)頁和相關(guān)文件，為便于分類錄（也叫根目錄）下，或者分別存放在主目錄下面的不同子目錄也可以從分網(wǎng)頁很容易地回到主網(wǎng)頁。3、靜態(tài)網(wǎng)頁、動態(tài)網(wǎng)頁和動態(tài)服務(wù)器網(wǎng)頁Web網(wǎng)頁有很多種，如HTMLDHTMLASP網(wǎng)頁、JSP網(wǎng)頁、PHP網(wǎng)頁等。靜態(tài)網(wǎng)頁指的是HTML網(wǎng)頁，即用HTML語言編寫的網(wǎng)頁，它是所有其他網(wǎng)頁技術(shù)的基礎(chǔ)。第3頁共30頁網(wǎng)頁中所有的對象，包括文字、圖片、超鏈接、Flash動畫、表格、列表等都需要通過HTML才能展現(xiàn)出來。動態(tài)網(wǎng)頁主要指的是DHTML網(wǎng)頁，它是通過腳本語言(包括JavaScript、VBScript和JScript)CSS）及文檔對象模型（DOM）的綜合使用，能讓網(wǎng)頁中的對象產(chǎn)生各種動態(tài)等。動態(tài)服務(wù)器網(wǎng)頁是在WWW服務(wù)器端動態(tài)生成網(wǎng)頁的技術(shù)，ASPJSPPHP等都屬于動態(tài)服務(wù)器網(wǎng)頁技術(shù)，本課程主要學習ASP技術(shù)。WWW服務(wù)器與數(shù)據(jù)庫服務(wù)器合二為一。4、用HTML編寫靜態(tài)網(wǎng)頁HTML是HyperTextMarkupLanguage的縮寫，中文意義是超文本標記語言。用HTML語言編寫的網(wǎng)頁是靜態(tài)網(wǎng)頁。HTML是網(wǎng)頁的基本語言，也是其他網(wǎng)頁技術(shù)的基礎(chǔ)。HTML靜態(tài)網(wǎng)頁基本結(jié)構(gòu)一個HTML網(wǎng)頁文件總是從<html>標記開始，以</html>標記結(jié)束；網(wǎng)頁的標題（瀏覽網(wǎng)頁時，顯示在瀏覽器的標題欄）總是在<title>和</title>之間定義；網(wǎng)頁主體內(nèi)容則在<body>和</body>之間描述。標題字體的定義<hn……</hn>文本文字的定義<fontface="fontname"size=ncolor=rrggbbalign="#"></font>加粗、傾斜與下劃線的定義<b>……</b><!加粗文字-->第4頁共30頁<imgsrc="path&filename"width=n1height=n2align="#"></img>其他媒體元素的插入<embed……"width=n1height=n2align=#></embed>超鏈接的使用網(wǎng)頁文件的鏈接<ahref="URL">……</a>錨點的定義與頁內(nèi)鏈接45>表題標記…..</caption>表行標記<tralign=#1valign=#2bgcolor=rrggbb>……</tr>單元格標記<thalign=#1valign=#2bgcolor=rrggbb>……</th><tdalign=#1valign=#2……</td>網(wǎng)頁屬性的設(shè)置<bodybgcolor=rrggbbbackground="path&filename"text=rrggbblink=rrggbbalink=rrggbbvlink=rrggbb……</body>第5頁共30頁學生作業(yè)教書育人方式備注課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜第二章使用網(wǎng)頁工具制作靜態(tài)網(wǎng)頁2通過本章的學習，學生應Internet服務(wù)管理器的基本操作；調(diào)整默認的Web文檔。在采用的教學手電視錄象軟件名稱自制上機學時第7頁共30頁1、Dreamweaver入門Dreamweaver8的界面菜單欄，插入欄，工具欄，狀態(tài)欄，屬性檢查器，文檔窗口，選項面板在Dreamweaver下創(chuàng)建本地站點的具體步驟：1、選擇[站點]->[]，出現(xiàn)定義站點對話框。2、可以使用高級選項頁進行站點的定義。3、設(shè)置本地信息，共有8個項目需要設(shè)置：定義站點名稱、選擇網(wǎng)站本地文件夾、確認是否“自動刷新文件列表、選擇默認圖像文件夾默認圖像文件夾HTTP地址、區(qū)分大小寫的鏈接、確認是否啟用緩存。新建HTML網(wǎng)頁教學內(nèi)容插入表格可以采用如下步驟：①將鼠標光標置于文檔中需要插入表格的位置。②執(zhí)行插入→表格”菜單命令，彈出表格”對話框。③在對話框中設(shè)置表格參數(shù)，就可以得到所需的表格結(jié)構(gòu)。編輯表格表格元素的選定：使用標簽選擇器可以方便地選定整個表格、單元格、行或其他元素。編輯表格：設(shè)置表格的寬，表格的邊框，拆分與合并單元格表格的嵌套在一張較復雜的網(wǎng)頁中，通常要在表格的單元格中再包含表格來進行排版定位，這就是表格的嵌套。3、插入圖像、動畫與媒體元素插入圖像第8頁共30頁①將光標置于需要插入圖像的位置；②執(zhí)行[插入]->[]菜單命令，彈出選擇圖像源文件對話框，在此對話框中選擇合適的圖像，單擊確定按扭即可。插入動畫和其他媒體元素插入SWF動畫的方法為：先將插入光標置于頁面中需要插入SWF文件的位置；執(zhí)行[插入]->[媒體]->[Flash]選擇文件對話框中，選擇要插入的SWF文件后單擊確定；插入聲音head部分使用標記符bgsound，例如：<bgsoundsrc="tunes/beethoven.mid"loop="1">。（2）直接將聲音文件嵌入到網(wǎng)頁中將音樂文件放到站點文件夾下面；將光標置于頁面中需要插入音插入]->[媒體]->[菜單命令，在[選擇文件]對話框中選中要插入的聲音文件，并加以確定;可以使用屬性面板對插件的一些屬性進行設(shè)置。4、使用表單5、插入超鏈接用CSS重新定義特定HTML標記符的外觀定義CSS偽類特定ID標記符樣式在標記符中直接嵌套樣式信息第9頁共30頁7、層的使用學生作業(yè)P57【實驗二】使用投票系統(tǒng)外觀設(shè)計教書育人方式備注第10頁共30頁課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜第三章網(wǎng)頁圖形與圖像處理2通過本章的學習，學生應了解中文Fireworks8工作環(huán)境；掌握中文Fireworks8矢量圖形和位圖圖像的制作與編輯；掌握圖形圖像的美化、優(yōu)化與導出。中文Fireworks8矢量圖形和位圖圖像的制作與編輯圖形圖像的美化、優(yōu)化與導出在采用的教學手電視錄象軟件名稱自制上機學時第11頁共30頁優(yōu)化，集成的工作流程，創(chuàng)作過程簡單化，工作流程的改進Fireworks8的安裝、啟動與退出Fireworks8的界面工具箱，屬性檢查器，浮動面板創(chuàng)建Fireworks文件徒手和放大鏡工具，矢量的選擇工具，圖形選擇工具，編輯選擇工具，鉛筆和鋼筆工具，矩形等圖形繪制工具，文本工具，畫刷與路徑重組工具，形體變換工具，路徑修改工具，吸管及油漆桶工具，刀子/橡皮工具，印章工具基本圖形繪制與變形教學內(nèi)容基本的線性、矩形和橢圓的繪制，多邊形的繪制，擴展圖形的繪制，不規(guī)則圖形的繪制，自動形狀繪制，圖形的選擇與變形，創(chuàng)建位圖對象，應用顏色、筆觸和填充，創(chuàng)建文字對象層與蒙版3、圖像處理選擇像素，調(diào)整選區(qū)，修飾位圖濾鏡效果應用優(yōu)化圖像色彩，對圖像進行模糊處理，對圖像進行銳化處理，向圖像中添加雜點，將圖像轉(zhuǎn)換成透明特效與樣式使用第12頁共30頁對象次序調(diào)整，對象的對齊，對象的組合，圖像混合模式，切片和熱區(qū)設(shè)置4、圖像的優(yōu)化與導出文件格式的選擇，使用優(yōu)化設(shè)置圖像的導出學生作業(yè)教書育人方式備注第13頁共30頁課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜第四章網(wǎng)站的規(guī)劃與設(shè)計2通過本章的學習，學生應了解網(wǎng)站的欄目規(guī)劃；了解網(wǎng)站的目錄結(jié)構(gòu)設(shè)計；了解網(wǎng)站的風格設(shè)計；了解網(wǎng)站的導航設(shè)計。網(wǎng)站的欄目規(guī)劃、目錄結(jié)構(gòu)設(shè)計、風格設(shè)計和導航設(shè)計難點：網(wǎng)站的欄目規(guī)劃、目錄結(jié)構(gòu)設(shè)計、風格設(shè)計和導航設(shè)計在采用的教學手電視錄象軟件名稱自制上機學時第14頁共30頁1、網(wǎng)站的欄目規(guī)劃確定必須欄目，確定重點欄目，建立層次型結(jié)構(gòu)，設(shè)計每一個欄目欄目規(guī)劃舉例參考德德瑪家德德瑪，你已經(jīng)收集了很多有關(guān)德德瑪?shù)母枨?、圖片以及報道等。現(xiàn)在要建立一個名為我從草原來德德瑪?shù)膫€人網(wǎng)站。2、網(wǎng)站的目錄結(jié)構(gòu)設(shè)計教學內(nèi)容以我從草原來德德瑪個人網(wǎng)站為例。在上節(jié)欄目規(guī)劃的基礎(chǔ)上，接著為這個網(wǎng)站設(shè)計它的目錄結(jié)構(gòu)。3、網(wǎng)站的風格設(shè)計版面布局的步驟，版面布局的基本方法4、網(wǎng)站的導航設(shè)計導航的實現(xiàn)方法第15頁共30頁在設(shè)計網(wǎng)站導航時，可以采用的一些基本策略：首先，至少要使用一個一層欄目的導航條，如果欄目底下也有很多內(nèi)容，可以分很多子類的話，那么可以進一步設(shè)計欄目下的導航條。好使用路徑導航。路徑導航可以從第三層以下的網(wǎng)頁開始出現(xiàn)。其他導航方式作為輔助的導航手段，視實際需要而定。學生作業(yè)教書育人方式備注第16頁共30頁課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜2通過本章的學習，學生應掌握在網(wǎng)頁中插入JavaScript腳本語言的幾種方式；掌握JavaScript腳本語言的變量、運算符、表達式和函數(shù)；掌握JavaScript中的對象及使用對象的方法；掌握DHTML在網(wǎng)頁中的應用。JavaScript腳本語言的變量、運算符、表達式和函數(shù)在采用的教學手電視錄象軟件名稱自制上機學時第17頁共30頁1、使用客戶端腳本JavaScript變量，JavaScript運算符與表達式，JavaScript語句，JavaScript函數(shù)使用JavaScript對象教學內(nèi)容要實現(xiàn)通過圖形化的界面為用戶提供盡可能多的功能，單純依靠HTML或JavaScriptJavaScript和CSS有機地結(jié)合起來在客戶端混合使用以實現(xiàn)某些效果，這種有機的結(jié)合也就是動態(tài)HTML(DynamicHTML、簡稱DHTML)。DHTMLHTML,也就是頁面中的各種頁面元素對象，它們是被動態(tài)操縱的內(nèi)容之一；二是CSS，CSS的屬性也是動態(tài)操縱的內(nèi)容之一，從CSS中警告動態(tài)格式效果；三是客戶端腳本（本書使用JavaScriptWeb頁上的HTML和CSS。示例1——目錄導航器第18頁共30頁學生作業(yè)教書育人方式備注第19頁共30頁課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜2通過本章的學習，學生應了解ASP的概念與特點；認識搭建ASP的運行環(huán)境；掌握ASP腳本語言——VBScript的控制結(jié)構(gòu)；掌握VBScript的過程申明與調(diào)用。VBScript的過程申明與調(diào)用在采用的教學手電視錄象軟件名稱自制上機學時第20頁共30頁1、靜態(tài)網(wǎng)頁與動態(tài)網(wǎng)頁的工作原理靜態(tài)網(wǎng)頁服務(wù)器端工作步驟是：接受請求，找到靜態(tài)網(wǎng)頁，發(fā)送靜而動態(tài)網(wǎng)頁服務(wù)器端工作步驟是：接受請求，找到動態(tài)網(wǎng)頁，執(zhí)行程序代碼生成靜態(tài)網(wǎng)頁，發(fā)送靜態(tài)網(wǎng)頁。2、ASP入門ASP動態(tài)網(wǎng)頁也就是在靜態(tài)網(wǎng)頁中嵌入服務(wù)器端的VBScript或JavaScriptASP件解釋成靜態(tài)網(wǎng)頁文件發(fā)送過去。在服務(wù)器端運行腳本語言帶來了很多的好處：第一，服務(wù)器端的腳本可以不受客戶端瀏覽器的現(xiàn)實；第二，可以很方便地和服務(wù)器交換數(shù)據(jù)。ASP的運行環(huán)境①Windows2000（Internet服務(wù)管理器）②WindowsXP+IIS（Internet服務(wù)管理器）③Windows98+（個人WEB服務(wù)器）制作一個簡單的ASP文件教學內(nèi)容ASP文件的基本組成、CSS代碼，也就是普通的Web頁面的內(nèi)容客戶端的Script程序代碼，位于<Script>與</Script>之間服務(wù)器端的Script程序代碼，位于與之間開發(fā)ASP程序時的注意事項在ASP點符號，否則會出錯，可以在英文輸入法下輸入標點符號。普通的HTML元素可以一行連著寫，而ASP語句必須分行寫。服務(wù)器端執(zhí)行：第21頁共30頁方法一：<%VBScript代碼%></Script>在VBScript，只有一種數(shù)據(jù)類型，稱為Variant，也叫做變體類型。Variant變量中保存的數(shù)據(jù)類型稱為變量的子類型。常見的子類型有字符串、數(shù)字、日期、邏輯類型。VBScript常量常量就是擁有一定名字的數(shù)值，常量可以代表字符串、數(shù)字、日期等常數(shù)，常量一經(jīng)定義以后，其值將不能再更改。用Const定義。VBScript變量所謂變量，從專業(yè)的角度說，變量就是存儲在內(nèi)存中的用來包含信息的地址的名字。我們只要知道變量就是代表一個值的名字就行了。5、VBScript數(shù)組數(shù)組的命名、定義、賦值和引用和變量基本上是一樣的，所不同的是要定義數(shù)組中的項目數(shù)。動態(tài)數(shù)組是運行時大小可變的數(shù)組。當程序沒有運行時，動態(tài)數(shù)組不占內(nèi)存，在程序運行時才為其開辟內(nèi)存區(qū)。動態(tài)數(shù)組的定義一般分兩步：首先用Dim語句聲明一個括號內(nèi)不包含下標的數(shù)組，然后在使用數(shù)組之前用ReDim語句根據(jù)實際需要重新定義下標值。也可以用ReDim語句直接定義數(shù)組。6、VBScript運算符VBScript繼承了VisualBasic第22頁共30頁比較運算符、邏輯運算符和連接運算符。要注意運算順序，先計算算術(shù)運算符，其次連接運算符，再次比較運算符，最后計算邏輯運算符。7、VBScript內(nèi)置函數(shù)轉(zhuǎn)換函數(shù)Sub子程序的語法：Sub子程序名（參數(shù)1，參數(shù)2，…）語句……SelectCase語句第23頁共30頁<%注釋行%>OnErrorResumeNext不希望程序終止，也不希望將錯誤顯露在訪問者面前，用這條語句。學生作業(yè)P189【實驗六】ASP網(wǎng)頁編程基礎(chǔ)實驗教書育人方式備注第24頁共30頁課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜第七章ASP中的對象2通過本章的學習，學生應掌握Request對象的使用；掌握Response對象的使用；掌握Session對象的使用；掌握Application對象的使用；掌握Server對象的使用。Request對象、Response對象、Session對象、Application對象和Server對象的使用Request對象、Response對象、Session對象、Application對象和Server對象的使用在采用的教學手幻燈機√電視錄象軟件名稱自制上機學時第25頁共30頁1、Request對象Request對象的數(shù)據(jù)集合、屬性和方法使用Request.Form獲取表單中的數(shù)據(jù)使用Request.QueryString獲取URL變量使用Request.ServerVariables獲取環(huán)境變量信息2、使用Response對象教學內(nèi)容Session對象的屬性和方法利用Session存儲信息6、使用Server對象CreateObject方法第26頁共30頁學生作業(yè)教書育人方式備注第27頁共30頁課程名稱：網(wǎng)頁設(shè)計章次名稱授課教師：吳靜第八章ASP存取數(shù)據(jù)庫4通過本章的學習，學生應了解Access數(shù)據(jù)庫的基本操作；了解SQL語言的使用；掌握利用SQL語言存取數(shù)據(jù)庫的方法。Web的工作方式及URL的作用在采用的教學手電視錄象軟件名稱自制上機學時第28頁共30頁Selecttable語句，droptable語句ASP應用程序不能直接訪問數(shù)據(jù)庫，必須通過ADO(ActiveXData才可以訪問Server、Access等各種支持ODBC或者OLEDB的數(shù)據(jù)庫。3、Connection對象使用Conn

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權(quán)或不適當內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論