網(wǎng)頁(yè)教案,針對(duì)初學(xué)者的教案

2020-03-22 19:24:26

字體：大中小

供稿：網(wǎng)友

了解網(wǎng)頁(yè)、主頁(yè)、網(wǎng)站的基本概念以及它們之間的關(guān)系，理解靜態(tài)網(wǎng)頁(yè)和動(dòng)態(tài)網(wǎng)頁(yè)的概念，了解靜態(tài)網(wǎng)頁(yè)和動(dòng)態(tài)網(wǎng)頁(yè)的技術(shù)，能解釋其工作過(guò)程

凡是接觸過(guò)因特網(wǎng)的同學(xué)，都應(yīng)該訪問(wèn)過(guò)網(wǎng)站、看到過(guò)網(wǎng)頁(yè)。大家所看到的網(wǎng)頁(yè)，一般都有一些固定的格式的，比如說(shuō)標(biāo)題、網(wǎng)站標(biāo)志等，而就網(wǎng)頁(yè)的分類來(lái)說(shuō)，一般來(lái)說(shuō)可以分為兩類，一類是不隨用戶的操作而變化的，叫做靜態(tài)網(wǎng)頁(yè)，另一類是隨著用戶的操作而變化的，這類網(wǎng)頁(yè)叫動(dòng)態(tài)網(wǎng)頁(yè)。
今天我就來(lái)討論一下關(guān)于網(wǎng)頁(yè)的問(wèn)題。
二、教學(xué)內(nèi)容：
通過(guò)搜索引擎搜索一些典型的網(wǎng)站，展示給學(xué)生。
1．網(wǎng)站、網(wǎng)頁(yè)、主頁(yè)的概念及三者關(guān)系
當(dāng)今人們?cè)L問(wèn)的國(guó)際互聯(lián)網(wǎng)，是由一個(gè)個(gè)的網(wǎng)站組成的，而網(wǎng)站是由一張張具體的網(wǎng)頁(yè)組成的，主頁(yè)則相當(dāng)于網(wǎng)站的起始頁(yè)，起著引導(dǎo)連接作用，一般來(lái)說(shuō)，用戶可以通過(guò)主頁(yè)訪問(wèn)到網(wǎng)站的大部分網(wǎng)頁(yè)。

設(shè)問(wèn)：什么是網(wǎng)站？什么是網(wǎng)頁(yè)？什么是主頁(yè)？
活動(dòng)：教師講解網(wǎng)站、網(wǎng)頁(yè)、主頁(yè)的含義及三者間的關(guān)系。

2．網(wǎng)頁(yè)頁(yè)面結(jié)構(gòu)
常見網(wǎng)站的頁(yè)面結(jié)構(gòu)一般由頁(yè)面標(biāo)題、網(wǎng)站標(biāo)志（LOGO）、頁(yè)眉區(qū)、導(dǎo)航欄、登錄區(qū)、搜索區(qū)、推薦熱點(diǎn)區(qū)、主要內(nèi)容區(qū)、頁(yè)腳區(qū)等組成。

3．靜態(tài)網(wǎng)頁(yè)的概念
靜態(tài)網(wǎng)頁(yè)是在服務(wù)器上以文件形式存放并以相同格式發(fā)送給客戶的網(wǎng)頁(yè)。
靜態(tài)網(wǎng)頁(yè)是用超文本標(biāo)記語(yǔ)言寫的文件。

設(shè)問(wèn)：我們平常在因特網(wǎng)上看到的網(wǎng)頁(yè)是由什么組成的?
活動(dòng)：教師講解靜態(tài)網(wǎng)頁(yè)的組成，超文本標(biāo)記語(yǔ)言（HTML）的特點(diǎn)。
探索：學(xué)生操作，瀏覽一張網(wǎng)頁(yè)時(shí)查看網(wǎng)頁(yè)的源文件。

4．靜態(tài)網(wǎng)頁(yè)顯示在瀏覽器中的原理
靜態(tài)網(wǎng)頁(yè)從服務(wù)器上以相同格式發(fā)送給客戶的文件，但這個(gè)文件在到達(dá)瀏覽器后，瀏覽器需要查找文件中的HTML代碼，然后將特定的HTML代碼用特定的形式顯示出來(lái)，形成用戶所看到的網(wǎng)頁(yè)。

設(shè)問(wèn)：靜態(tài)網(wǎng)頁(yè)是如何顯示在瀏覽器中的？
活動(dòng)：教師講解瀏覽器對(duì)超文本標(biāo)記語(yǔ)言的解釋過(guò)程和效果。

5、動(dòng)態(tài)網(wǎng)頁(yè)的概念
動(dòng)態(tài)網(wǎng)頁(yè)是指在用戶用戶瀏覽過(guò)程中由計(jì)算機(jī)系統(tǒng)自動(dòng)創(chuàng)建的網(wǎng)頁(yè)，通常用于顯示實(shí)時(shí)信息或按照用戶交互顯示特定的內(nèi)容。
動(dòng)態(tài)網(wǎng)頁(yè)的特點(diǎn)：交互性、可自動(dòng)更新、因地因時(shí)因人而變
動(dòng)態(tài)網(wǎng)頁(yè)的常見形式：計(jì)數(shù)器、聊天室、討論區(qū)、BBS、校友錄等。
構(gòu)成動(dòng)態(tài)網(wǎng)頁(yè)的常見的兩種情況：純客戶端方式構(gòu)成的動(dòng)態(tài)網(wǎng)頁(yè)與客戶端服務(wù)器模式構(gòu)成的動(dòng)態(tài)網(wǎng)頁(yè)

設(shè)問(wèn)：那些有交互操作的網(wǎng)頁(yè)是由什么組成的？
活動(dòng)：教師講解，常見的構(gòu)成動(dòng)態(tài)網(wǎng)頁(yè)的兩種情況，純客戶端方式構(gòu)成的動(dòng)態(tài)網(wǎng)頁(yè)與瀏覽器/服務(wù)器模式構(gòu)成的動(dòng)態(tài)網(wǎng)頁(yè)各自的組成方式與特點(diǎn)。
交流：如何利用系統(tǒng)調(diào)色板精確調(diào)色

6、動(dòng)態(tài)網(wǎng)頁(yè)顯示的原理
純客戶端方式構(gòu)成的動(dòng)態(tài)網(wǎng)頁(yè)：這種方式不需要與服務(wù)器交互，通常采用JAVA小程序和腳本語(yǔ)言形式直接嵌在網(wǎng)頁(yè)中。它的動(dòng)態(tài)表現(xiàn)在：用戶通過(guò)各種由比如javascript、javaapplet等技術(shù)支持的操作網(wǎng)頁(yè)的顯示內(nèi)容或形式。

1．輸入如下的一段動(dòng)態(tài)網(wǎng)頁(yè)的源代碼，在瀏覽器上觀察并體驗(yàn)該代碼段生成的網(wǎng)頁(yè)動(dòng)態(tài)效果。
html
head
meta http-equiv= Content-Type content= text/html; charset=gb2312
title 一個(gè)文字的動(dòng)態(tài)效果 /title
/head
body
marquee his.stop() onMouseOut=this.start() scrollamount=1 scrolldelay=50 direction=up height=116 width=188 border=1 bgcolor=Olive 鼠標(biāo)移上時(shí)將停止，移開時(shí)繼續(xù)移動(dòng)，不妨試一下 /marquee
/body
/html
2．描述以上代碼所能實(shí)現(xiàn)的動(dòng)態(tài)效果：

3．實(shí)際運(yùn)用：根據(jù)表格中的要求，分別對(duì)代碼中不同的屬性值進(jìn)行分析、修改，并通過(guò)瀏覽器觀察個(gè)性的效果，比較修改前后的變化，根據(jù)自己的觀察結(jié)果把表格填完整。html教程

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。

上一篇：提高用戶體驗(yàn)與新窗口打開網(wǎng)頁(yè)的關(guān)系

下一篇：網(wǎng)頁(yè)注釋在IE中產(chǎn)生文字溢出