布局網(wǎng)頁(yè)設(shè)計(jì)教學(xué)應(yīng)用

1、布局網(wǎng)頁(yè)設(shè)計(jì)教學(xué)應(yīng)用 【內(nèi)容摘要】隨著社會(huì)經(jīng)濟(jì)程度的不斷進(jìn)步，我國(guó)科學(xué)技術(shù)也得到了飛速的開(kāi)展進(jìn)步，網(wǎng)頁(yè)設(shè)計(jì)領(lǐng)域所需的人才越來(lái)越多。在多數(shù)院校中，都開(kāi)展了網(wǎng)頁(yè)設(shè)計(jì)這門課程，為了進(jìn)步這門課程的教學(xué)效果以及進(jìn)步學(xué)生的專業(yè)知識(shí)程度，本文深化研究了當(dāng)今網(wǎng)頁(yè)設(shè)計(jì)教學(xué)過(guò)程中存在各方面的問(wèn)題，主要對(duì)傳統(tǒng)的網(wǎng)頁(yè)設(shè)計(jì)教學(xué)中的網(wǎng)頁(yè)布局法和DIV+CSS布局法進(jìn)展分析比擬，分析得出DIV+CSS網(wǎng)頁(yè)布局法的優(yōu)點(diǎn)以及對(duì)網(wǎng)頁(yè)設(shè)計(jì)這門課程教學(xué)的重要作用。【關(guān)鍵詞】DIV+CSS布局;網(wǎng)頁(yè)設(shè)計(jì);布局原理一、引言隨著時(shí)代的開(kāi)展進(jìn)步，網(wǎng)絡(luò)計(jì)算機(jī)技術(shù)的飛速開(kāi)展進(jìn)步，網(wǎng)頁(yè)設(shè)計(jì)領(lǐng)域也有了極其廣泛的開(kāi)展空間，各個(gè)院校都開(kāi)設(shè)了網(wǎng)頁(yè)設(shè)計(jì)這一

2、學(xué)科的教學(xué)，為培養(yǎng)這方面更多的人才對(duì)推動(dòng)我國(guó)網(wǎng)頁(yè)設(shè)計(jì)專業(yè)的開(kāi)展進(jìn)程作出重要的奉獻(xiàn)。目前，在我國(guó)網(wǎng)頁(yè)設(shè)計(jì)這一學(xué)科的教學(xué)過(guò)程中，教學(xué)使用的軟件一般都是Dre-amweaver，這一軟件在設(shè)計(jì)網(wǎng)頁(yè)的時(shí)候，網(wǎng)頁(yè)布局法最常用的就是Table頁(yè)面布局以及DIV+CSS頁(yè)面布局這兩種，本文就深化理解分析DIV+CSS頁(yè)面布局法這一頁(yè)面布局法解決傳統(tǒng)表格布局法的缺乏之處，利于后期的網(wǎng)頁(yè)維護(hù)和修改工作的進(jìn)展，簡(jiǎn)化了代碼，從而減少了網(wǎng)絡(luò)資源的浪費(fèi)。由于DIV+CSS布局在當(dāng)今社會(huì)的應(yīng)用中受到廣泛的歡送，因此，我國(guó)各院校也應(yīng)重視這一布局法在網(wǎng)頁(yè)設(shè)計(jì)教學(xué)中的應(yīng)用，改變傳統(tǒng)網(wǎng)頁(yè)設(shè)計(jì)教學(xué)課堂的教學(xué)氣氛，進(jìn)步教學(xué)質(zhì)量，從而

3、對(duì)進(jìn)步學(xué)生的才能起到深遠(yuǎn)的作用。二、DIV+CSS布局(一)傳統(tǒng)的網(wǎng)頁(yè)頁(yè)面布局法。在傳統(tǒng)的網(wǎng)頁(yè)設(shè)計(jì)教學(xué)過(guò)程中，使用的頁(yè)面布局法主要是表格頁(yè)面布局和框架布局。表格布局法的優(yōu)勢(shì)在于可以隨意設(shè)置單元格的高度和寬度，還可以實(shí)現(xiàn)嵌套，能讓網(wǎng)頁(yè)中的各元素都擺放在預(yù)期的地方;它的操作簡(jiǎn)單易行，可以完成各種版式的布局。但是它也存在很多缺點(diǎn)，比方說(shuō)在設(shè)計(jì)復(fù)雜的網(wǎng)頁(yè)時(shí)候，HTML文檔內(nèi)容將會(huì)特別多，這樣閱讀器在加載完表格再顯示頁(yè)面的過(guò)程中，要消耗很長(zhǎng)的時(shí)間，此外，表格布局法還可能使HTML文檔的內(nèi)部構(gòu)造混亂，其頁(yè)面的維修和修改工作也特別困難。(二)含義。DIV是一種容器性質(zhì)的元素，它的存在是為HTML文檔內(nèi)容提供

4、構(gòu)造和背景，它是由起始標(biāo)簽div和完畢標(biāo)簽/div之間的內(nèi)容構(gòu)成的。CSS就是層疊款式表，主要是用來(lái)設(shè)計(jì)網(wǎng)頁(yè)的排版和風(fēng)格的，使網(wǎng)頁(yè)變得更加豐富。CSS由兩個(gè)主要局部組成:選擇器和聲明，其中選擇器的使用需要改變款式的元素;聲明那么是由一個(gè)屬性一個(gè)值組合成的，屬性和值需要用冒號(hào)來(lái)隔開(kāi)，聲明和聲明之間需要用分號(hào)來(lái)隔開(kāi)。假如要將網(wǎng)頁(yè)頁(yè)面上的元素實(shí)現(xiàn)一對(duì)一的控制，就需要使用CSS選擇器，常用的有標(biāo)簽選擇器、類選擇器、id選擇器、群組選擇器以及后代選擇器這幾種，它們都有著各自的優(yōu)點(diǎn)和缺點(diǎn)。(三)布局原理。DIV+CSS頁(yè)面布局法是WEB設(shè)計(jì)的標(biāo)準(zhǔn)，它和以往的表格頁(yè)面布局法有著明顯的不同之處，可以實(shí)現(xiàn)網(wǎng)頁(yè)頁(yè)

5、面內(nèi)容和表現(xiàn)別離，其中DIV是用來(lái)完成網(wǎng)頁(yè)的框架構(gòu)造，CSS是用來(lái)美化網(wǎng)站的款式，它們的共同使用可以將網(wǎng)站進(jìn)展重構(gòu)，使網(wǎng)站進(jìn)一步實(shí)現(xiàn)標(biāo)準(zhǔn)化，簡(jiǎn)化HTML文檔內(nèi)容的代碼，有利于網(wǎng)站構(gòu)造的搭建。三、網(wǎng)頁(yè)設(shè)計(jì)教學(xué)過(guò)程中DIV+CSS布局法的應(yīng)用途徑(一)DIV+CSS布局法的優(yōu)點(diǎn)。1使網(wǎng)頁(yè)構(gòu)造實(shí)現(xiàn)標(biāo)準(zhǔn)化。由于傳統(tǒng)的表格頁(yè)面布局法使用過(guò)程中，網(wǎng)頁(yè)垃圾代碼過(guò)多，用于裝飾的款式和頁(yè)面布局代碼的混合導(dǎo)致頁(yè)面構(gòu)造不美觀，此外，表格頁(yè)面布局中的多層嵌套、單元格的合并與拆分這些對(duì)一個(gè)單元格的調(diào)整工作，都會(huì)影響到其余單元格的表現(xiàn)效果。但是DIV+CSS頁(yè)面布局法很好地解決了這一問(wèn)題，在頁(yè)面布局設(shè)計(jì)的時(shí)候，使用DIV

6、盒子來(lái)確定大小，其邊框局、間距等多種屬性都可以進(jìn)展數(shù)值上的調(diào)整，這就使網(wǎng)頁(yè)頁(yè)面的構(gòu)造塑造性極強(qiáng)。2使網(wǎng)頁(yè)內(nèi)容和款式相別離。DIV+CSS頁(yè)面布局法的使用，解決了以往網(wǎng)頁(yè)風(fēng)格不統(tǒng)一的問(wèn)題，有利于更新和網(wǎng)頁(yè)維修修護(hù)工作的進(jìn)展。DIV(網(wǎng)頁(yè)內(nèi)容)和CSS(款式)的互相別離，一般是通過(guò)將頁(yè)面內(nèi)容放到HTML文檔文件中而款式那么放在單獨(dú)的CSS文件里，當(dāng)需要進(jìn)展網(wǎng)頁(yè)內(nèi)容修改時(shí)候，只需要對(duì)HTML文件改動(dòng)，對(duì)網(wǎng)頁(yè)頁(yè)面效果修改時(shí)候，那么只需要對(duì)CSS文件中的內(nèi)容進(jìn)展修改即可，大大節(jié)省了工作的時(shí)間和人力的消耗。DIV+CSS頁(yè)面布局法將網(wǎng)頁(yè)內(nèi)容和款式的別離，對(duì)網(wǎng)頁(yè)的更新工作帶來(lái)極大的便利，此外，還可以實(shí)現(xiàn)網(wǎng)頁(yè)

7、風(fēng)格的互相統(tǒng)一。3優(yōu)化搜索引擎。網(wǎng)頁(yè)設(shè)計(jì)中的搜索引擎主要是針對(duì)網(wǎng)頁(yè)內(nèi)容也就是文字、代碼完成的，而傳統(tǒng)的表格頁(yè)面布局法中使用的頁(yè)面代碼過(guò)多，搜索引擎工作很難完成。但是DIV+CSS頁(yè)面布局法中的網(wǎng)頁(yè)代碼簡(jiǎn)潔，在進(jìn)展搜索引擎工作的時(shí)候，只需要將被搜索的內(nèi)容從HTML文檔中的代碼進(jìn)展搜索即可，搜索引擎只需要輸入搜索內(nèi)容的關(guān)鍵詞，減少了繁復(fù)的搜索內(nèi)容，進(jìn)步了搜索引擎工作的效率，減少了大量的工作時(shí)間。(二)DIV+CSS布局在網(wǎng)頁(yè)設(shè)計(jì)中的詳細(xì)應(yīng)用途徑。DIV+CSS這一布局法在網(wǎng)頁(yè)設(shè)計(jì)學(xué)科的教學(xué)過(guò)程中有著重要的作用，但是其技術(shù)性較高，操作困難，這就需要教師在教學(xué)過(guò)程中通過(guò)以下途徑進(jìn)步教學(xué)質(zhì)量。1教學(xué)內(nèi)容

8、。目前，我國(guó)多數(shù)網(wǎng)頁(yè)設(shè)計(jì)課程采用的教材在DIV+CSS布局這方面的講解都是從含義講起，再分析字體、表格、圖像等屬性，內(nèi)容散亂無(wú)章，學(xué)生學(xué)起來(lái)也顯得非常困難。因此，應(yīng)該從教學(xué)內(nèi)容的制定上實(shí)現(xiàn)創(chuàng)新，教學(xué)內(nèi)容由簡(jiǎn)單到困難，不斷深化理解其詳細(xì)含義。教學(xué)內(nèi)容困難度的由淺及深，可以使學(xué)生在輕松愉悅的氣氛中學(xué)習(xí)，激發(fā)學(xué)生的學(xué)習(xí)興趣，這樣網(wǎng)頁(yè)設(shè)計(jì)這一學(xué)科的教學(xué)質(zhì)量才能得到進(jìn)一步的進(jìn)步，學(xué)生自身的知識(shí)才能程度也將得到大幅度的進(jìn)步。2教學(xué)方法。隨著社會(huì)的開(kāi)展進(jìn)步，我國(guó)教學(xué)事業(yè)也得到了飛速的進(jìn)步，教學(xué)理念都發(fā)生了宏大的改變，在當(dāng)今教學(xué)活動(dòng)中，應(yīng)該彰顯學(xué)生在課堂中的主體地位。這就需要從教學(xué)方法開(kāi)場(chǎng)作出改變。傳統(tǒng)的網(wǎng)頁(yè)

9、設(shè)計(jì)課程都是通過(guò)教師控制學(xué)生電腦演示設(shè)計(jì)過(guò)程來(lái)完成的，這種講課方法學(xué)生無(wú)法親自動(dòng)手參與到課堂教學(xué)中，教師講完后讓學(xué)生自己輸入代碼，學(xué)生就被動(dòng)輸入代碼，這樣學(xué)生的思維得不到培養(yǎng)，教學(xué)質(zhì)量也將受到限制。因此，教師應(yīng)該創(chuàng)新教學(xué)方法，充分利用先進(jìn)的多媒體技術(shù)，不再操作學(xué)生的電腦，讓學(xué)生自己動(dòng)手，自主考慮問(wèn)題，這樣教學(xué)質(zhì)量才能得到進(jìn)步。3教學(xué)評(píng)價(jià)。傳統(tǒng)的網(wǎng)頁(yè)設(shè)計(jì)教學(xué)考核主要是通過(guò)試卷完成的，這不符合這一學(xué)科的特征，因此，教師要在教學(xué)評(píng)價(jià)上實(shí)現(xiàn)創(chuàng)新，可以通過(guò)綜合課程設(shè)計(jì)以及期末機(jī)房考試這兩局部實(shí)現(xiàn)對(duì)學(xué)生的考核，既可以檢查學(xué)生平常上課中綜合案例的掌握情況，又可以檢測(cè)學(xué)生的網(wǎng)頁(yè)設(shè)計(jì)情況，教學(xué)評(píng)價(jià)體系的創(chuàng)新對(duì)推動(dòng)學(xué)生的學(xué)習(xí)有著重要的作用。四、結(jié)語(yǔ)總體說(shuō)來(lái)，在當(dāng)今社會(huì)形勢(shì)下，各院校都要綜合考慮社會(huì)市場(chǎng)對(duì)網(wǎng)頁(yè)設(shè)計(jì)領(lǐng)域人才的需求以及這一學(xué)科自身的特點(diǎn)，制定合理的教學(xué)內(nèi)容、教學(xué)方法，進(jìn)步學(xué)生的綜合素質(zhì)，重視DIV