第一篇:“網(wǎng)頁設(shè)計(jì)與制作”課程中的應(yīng)用分析論文
摘要:互聯(lián)網(wǎng)和信息化技術(shù)的高速發(fā)展給教育教學(xué)領(lǐng)域帶來的變革,是教育工作者不能忽略的現(xiàn)象。充分利用各種新型的教學(xué)模式或技術(shù)手段來提高教學(xué)質(zhì)量,激發(fā)學(xué)習(xí)興趣,是當(dāng)代教師應(yīng)廣泛關(guān)注的問題。本文從翻轉(zhuǎn)課堂教學(xué)模式在“網(wǎng)頁設(shè)計(jì)與制作”課程中的應(yīng)用入手,探究翻轉(zhuǎn)課堂對(duì)傳統(tǒng)的“教”與“學(xué)”模式的影響及其在課程中應(yīng)用的分析與總結(jié)。
關(guān)鍵詞:翻轉(zhuǎn)課堂;網(wǎng)頁設(shè)計(jì)與制作;教學(xué)模式
一、翻轉(zhuǎn)課堂教學(xué)模式的研究背景和意義
1.翻轉(zhuǎn)課堂教學(xué)模式的研究背景翻轉(zhuǎn)課堂譯自“FlippedClassroom”,也可譯為“顛倒課堂”。源于美國科羅拉多州林地公園高中的兩位化學(xué)老師對(duì)傳統(tǒng)教學(xué)模式的改革實(shí)踐。隨著翻轉(zhuǎn)課堂教學(xué)模式在美國的推廣和流行,其逐漸成為全球教育領(lǐng)域關(guān)注的一種新型教學(xué)模式。傳統(tǒng)的教學(xué)模式是教學(xué)主要在課堂上完成。教師在課堂上講解知識(shí),演示案例或?qū)嶒?yàn)。學(xué)生聽取講授,完成相關(guān)的實(shí)踐任務(wù)及課后練習(xí)。但由于課堂時(shí)間有限,這種教學(xué)模式基本上是以教師為主體,學(xué)生的學(xué)習(xí)較為被動(dòng)。并且部分學(xué)生在學(xué)習(xí)前對(duì)新知識(shí)點(diǎn)的了解非常有限,甚至一無所知。經(jīng)常是教師講得激情四射,學(xué)生聽得不知所云。教師在課堂上為完成相關(guān)的教學(xué)任務(wù),變得沒有時(shí)間及精力與學(xué)生進(jìn)行更多的互動(dòng)及反饋。翻轉(zhuǎn)課堂教學(xué)模式是指重新調(diào)整課堂內(nèi)外的時(shí)間,將學(xué)習(xí)的主動(dòng)權(quán)從教師轉(zhuǎn)變?yōu)閷W(xué)生。學(xué)生在課前的課余時(shí)間,根據(jù)教師的任務(wù)布置,先行自主學(xué)習(xí)視頻教學(xué)資料或其他學(xué)習(xí)資料,對(duì)新知識(shí)進(jìn)行一定的了解和思考。在課堂上教師用相對(duì)較短的時(shí)間,將知識(shí)點(diǎn)中的重點(diǎn)和難點(diǎn)進(jìn)行講解,然后布置相關(guān)的練習(xí)任務(wù)。在解決問題的過程中,學(xué)生可以與教師或同學(xué)進(jìn)行研究與討論,將課堂變?yōu)閹熒g答疑解惑的互動(dòng)場所、知識(shí)應(yīng)用的實(shí)踐環(huán)節(jié),給教師和學(xué)生更多的溝通和反饋時(shí)間。2.翻轉(zhuǎn)課堂教學(xué)模式的應(yīng)用優(yōu)勢“網(wǎng)頁設(shè)計(jì)與制作”是計(jì)算機(jī)類專業(yè)的一門重要專業(yè)基礎(chǔ)課程。課程特點(diǎn)是知識(shí)點(diǎn)較多,但易于自學(xué),實(shí)踐性較強(qiáng)。目前,大部分教師都采用“教學(xué)做一體”的方式進(jìn)行教學(xué)。這種方式能讓學(xué)生掌握網(wǎng)頁制作的基本技能,但也存在一些問題:由于教學(xué)內(nèi)容較多,所以課上講授時(shí)間偏長,學(xué)生精力容易分散,教學(xué)效果難以達(dá)到預(yù)期;由于課堂時(shí)間有限,課上教學(xué)方法和內(nèi)容統(tǒng)一,無法滿足不同水平學(xué)生的學(xué)習(xí)需求;教師要將更多的精力用于講授環(huán)節(jié),對(duì)于學(xué)生在實(shí)際應(yīng)用中所帶來的疑惑,無暇進(jìn)行回答和解決。傳統(tǒng)的教學(xué)模式忽略了學(xué)生作為學(xué)習(xí)主體的地位,阻礙了教學(xué)效果的提升,不利于對(duì)學(xué)生自主學(xué)習(xí)主動(dòng)性、積極性與創(chuàng)造性的培養(yǎng)。翻轉(zhuǎn)課堂教學(xué)模式中的課堂內(nèi)外教與學(xué)的變換及研討式、項(xiàng)目驅(qū)動(dòng)式學(xué)習(xí)模式都與該課程的強(qiáng)實(shí)踐性要求極為符合。因此在“網(wǎng)頁設(shè)計(jì)與制作”課程中應(yīng)嘗試使用翻轉(zhuǎn)課堂教學(xué)模式進(jìn)行改革,以彌補(bǔ)傳統(tǒng)教學(xué)模式的不足。
二、翻轉(zhuǎn)課堂在“網(wǎng)頁設(shè)計(jì)與制作”課程中的應(yīng)用
翻轉(zhuǎn)課堂不是忽略或降低教師的作用,而是對(duì)教師提出了更高的要求。它要求教師在設(shè)計(jì)教學(xué)過程時(shí),不再只注重課堂,而是要將課前、課中和課后有機(jī)地結(jié)合在一起,進(jìn)行綜合的考慮和協(xié)調(diào),將一條學(xué)習(xí)的主線貫穿其中。下面對(duì)翻轉(zhuǎn)課堂教學(xué)模式在“網(wǎng)頁設(shè)計(jì)與制作”課程中的應(yīng)用過程加以說明。1.教學(xué)資源的準(zhǔn)備(1)教案設(shè)計(jì)編寫。教師根據(jù)課程教學(xué)大綱中的教學(xué)目標(biāo)編寫教案,建立一個(gè)完整的教學(xué)過程的規(guī)劃設(shè)計(jì)。明確整個(gè)教學(xué)過程的教學(xué)任務(wù)、教學(xué)案例、拓展練習(xí)等具體的實(shí)施內(nèi)容。(2)視頻資源制作。教師采用視頻錄制軟件,制作教學(xué)視頻。每個(gè)知識(shí)點(diǎn)可以錄制2~3個(gè)時(shí)長為5~10分鐘的教學(xué)視頻。大致可以分為:知識(shí)點(diǎn)應(yīng)用的導(dǎo)入、基本知識(shí)點(diǎn)的講解、教學(xué)案例的演示等。(3)其他資源制作。根據(jù)教案和視頻,可以制作如學(xué)習(xí)指導(dǎo)、參考案例、拓展任務(wù)、輔助資料等學(xué)習(xí)資源。(4)上傳教學(xué)資源。教師將錄制好的視頻資源和其他輔助教學(xué)資料上傳到校內(nèi)的共享學(xué)習(xí)的平臺(tái)或班級(jí)QQ群中,供學(xué)生利用互聯(lián)網(wǎng)絡(luò)在課前進(jìn)行下載學(xué)習(xí)。(5)問題匯總整理。學(xué)生在自主學(xué)習(xí)、完成參考案例和拓展任務(wù)時(shí)會(huì)出現(xiàn)各種各樣的問題。教師通過學(xué)習(xí)的平臺(tái)或QQ群收集整理學(xué)生的問題和反饋意見,對(duì)于簡單的問題在線即可解答,對(duì)于典型或困難的問題在后面的課堂教學(xué)中重點(diǎn)解決。2.教學(xué)任務(wù)的實(shí)施學(xué)生通過網(wǎng)絡(luò)下載學(xué)習(xí)視頻和資料,在課前完成新課程的學(xué)習(xí)環(huán)節(jié)。通過課前的學(xué)習(xí),學(xué)生對(duì)新知識(shí)點(diǎn)有了一定的了解和掌握。學(xué)生在課前向教師提交完成的練習(xí)任務(wù)或存在的疑難問題。教師在課堂上根據(jù)匯總和整理的問題或任務(wù)完成的情況,結(jié)合具體的任務(wù)實(shí)例講解本課程中的重點(diǎn)或難點(diǎn)。這個(gè)部分一般控制在20分鐘左右。然后教師布置新的拓展任務(wù),并將學(xué)生分為小組模式,以小組的方式完成拓展任務(wù)。在分組練習(xí)的過程中,教師可以進(jìn)行充分的引導(dǎo)和問題的解答,使學(xué)生與學(xué)生、學(xué)生與教師之間對(duì)新問題進(jìn)行深入的研討。利用這個(gè)環(huán)節(jié)加深和鞏固學(xué)生對(duì)知識(shí)點(diǎn)的掌握及在實(shí)際問題中的應(yīng)用。在課程的最后,教師進(jìn)行適當(dāng)?shù)目偨Y(jié),并布置課后任務(wù)和新的課前學(xué)習(xí)內(nèi)容。3.教學(xué)評(píng)價(jià)的建立在課程前,教師根據(jù)學(xué)生完成的任務(wù)練習(xí)或所提出的問題,評(píng)定課前的學(xué)習(xí)情況。在課程中,教師根據(jù)學(xué)生完成拓展任務(wù)及小組中的表現(xiàn),評(píng)定課中的學(xué)習(xí)情況。這部分評(píng)定可以包括:自我評(píng)價(jià)、小組互評(píng)和教師評(píng)定。在課程后,通過作業(yè)練習(xí)或階段考核,評(píng)定知識(shí)的掌握情況。通過對(duì)課前獨(dú)立學(xué)習(xí)能力、問題研究討論能力、團(tuán)隊(duì)合作協(xié)調(diào)能力、任務(wù)完成公關(guān)能力等多方面的綜合評(píng)價(jià),來促進(jìn)學(xué)生的學(xué)習(xí)主動(dòng)性、獨(dú)立性和創(chuàng)造性,重新引導(dǎo)學(xué)生成為學(xué)習(xí)的主體。
三、翻轉(zhuǎn)課堂教學(xué)模式應(yīng)用的總結(jié)
隨著翻轉(zhuǎn)課堂教學(xué)模式在“網(wǎng)頁設(shè)計(jì)與制作”課程中的不斷實(shí)踐和調(diào)整,其對(duì)增強(qiáng)課程的教學(xué)效果還是起到了明顯的作用。教師所制作和提供在共享平臺(tái)上的教學(xué)資源可以長期存放,并方便學(xué)生隨時(shí)觀看學(xué)習(xí)。對(duì)于臨時(shí)缺課的學(xué)生,教師可以利用資源供其學(xué)習(xí)。對(duì)于領(lǐng)悟接收能力較差的學(xué)生,可以利用教學(xué)資源,方便他們?cè)谡n前課后進(jìn)行反復(fù)觀看學(xué)習(xí)。這樣既完善了個(gè)體的學(xué)習(xí)需求,又可以節(jié)省公共的課堂時(shí)間,提高課堂整體的教學(xué)效率。在整個(gè)運(yùn)作過程中,筆者感受最深的是如果希望取得良好的效果,教師所付出的時(shí)間和精力要遠(yuǎn)遠(yuǎn)多于傳統(tǒng)的課程教學(xué)所花的時(shí)間和精力。教師需要有耐心、細(xì)心和恒心;要做到課程專業(yè)知識(shí)的精、深和廣;要不斷地調(diào)整、不斷地反思、不斷地應(yīng)對(duì)各種情況;要充分釋放學(xué)生自主學(xué)習(xí)的潛能,將學(xué)習(xí)的掌控權(quán)交給學(xué)生。教師在課堂上轉(zhuǎn)變身份,變?yōu)閷W(xué)習(xí)的引導(dǎo)者、教學(xué)資料的提供者、問題的解答者。使學(xué)生從被動(dòng)學(xué)習(xí)向主動(dòng)學(xué)習(xí)良好轉(zhuǎn)變。
參考文獻(xiàn):
[1]羅金玲.基于世界大學(xué)城云平臺(tái)的高職翻轉(zhuǎn)課堂教學(xué)模式探究———以《Dreamweaver網(wǎng)頁制作》課程為例[J].電腦知識(shí)與技術(shù),2016,32(19):108-110.
[2]王娜.翻轉(zhuǎn)課堂教學(xué)模式在高職網(wǎng)頁設(shè)計(jì)與制作課程中的實(shí)踐研究[J].科教導(dǎo)刊(電子版),2015(10):31.
[3]柏翠,程巍.淺談翻轉(zhuǎn)課堂教學(xué)模式在《Dreamweaver網(wǎng)頁設(shè)計(jì)與制作》課程中的應(yīng)用[J].科技資訊,2015,10(29):164-165.
[4]魏春艷.項(xiàng)目教學(xué)法在《網(wǎng)頁設(shè)計(jì)與制作》課程中的應(yīng)用[J].電子世界,2013(8):148.
[5]張金磊,王穎,張寶輝.翻轉(zhuǎn)課堂教學(xué)模式研究[J].遠(yuǎn)程教育雜志,2012(4):46-51.
第二篇:網(wǎng)頁設(shè)計(jì)與制作課程學(xué)習(xí)論文
《網(wǎng)頁設(shè)計(jì)與制作》課程學(xué)習(xí)論文
作為一個(gè)二十一世紀(jì)的大學(xué)生,學(xué)習(xí)如何設(shè)計(jì)與制作網(wǎng)頁變?yōu)橐粋€(gè)必不可少的過程。經(jīng)過這幾個(gè)星期的學(xué)習(xí),我開始對(duì)網(wǎng)頁設(shè)計(jì)與制作有了初步的認(rèn)識(shí),并且學(xué)習(xí)了一些網(wǎng)頁設(shè)計(jì)與制作的基礎(chǔ)。隨著時(shí)代的發(fā)展,網(wǎng)站建設(shè)越來越接近于一門藝術(shù)而不僅僅是一門技術(shù)。網(wǎng)站設(shè)計(jì)日有必要的益被重視,學(xué)習(xí)網(wǎng)頁設(shè)計(jì)與制作這門學(xué)科是非常。
作為網(wǎng)頁設(shè)計(jì)的初學(xué)者,我對(duì)網(wǎng)頁設(shè)計(jì)非常感興趣,一心想設(shè)計(jì)出一個(gè)美觀、實(shí)用、內(nèi)容豐富的個(gè)人網(wǎng)頁。我通過自己動(dòng)手、動(dòng)腦,通過網(wǎng)絡(luò)資源,老師的指導(dǎo),在不斷發(fā)現(xiàn)問題和解決問題的過程中學(xué)到了很多知識(shí),也增強(qiáng)了我的創(chuàng)作能力和動(dòng)手能力,在網(wǎng)頁設(shè)計(jì)過程中,從構(gòu)思到設(shè)計(jì)、完善、維護(hù),整個(gè)過程我都全身心投入,使我真正學(xué)到了網(wǎng)頁設(shè)計(jì)的知識(shí)。
互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道,它在人們政治、經(jīng)濟(jì)、生活等各個(gè)方面發(fā)揮著重要的作用。網(wǎng)頁設(shè)計(jì)伴隨著網(wǎng)絡(luò)的快速發(fā)展而快速興起,作為上網(wǎng)的主要依托,由于人們使用網(wǎng)絡(luò)的頻繁而變得非常的重要。網(wǎng)頁講究的是排版布局,其功能主要就是提供一種形式給每個(gè)上網(wǎng)者,讓他們能夠了解網(wǎng)站提供的信息。
網(wǎng)頁設(shè)計(jì)與制作包含視聽元素于版式設(shè)計(jì)兩項(xiàng)內(nèi)容,以主題鮮明、形式與內(nèi)容統(tǒng)一、強(qiáng)調(diào)整體為設(shè)計(jì)原則,具有互交性與持續(xù)性、綜合性、版式的不可以控性、藝術(shù)與技術(shù)的結(jié)合的緊密型等特點(diǎn)。美和功能都是為了表達(dá)網(wǎng)站的主題。我認(rèn)為在一個(gè)網(wǎng)站中,最重要的頁面當(dāng)屬主頁,所以在此以主頁為例,說明在網(wǎng)頁制作中版面設(shè)計(jì)的問題。從版面設(shè)計(jì)來講,一個(gè)有特色的主頁,必須包含有四個(gè)要素:文字,圖片,排列方式和主色調(diào),這四者相輔相成,缺一不可。圖片要素
要設(shè)計(jì)出漂亮的主頁,首先要成為計(jì)算機(jī)圖形高手,僅這一點(diǎn)就可以讓初學(xué)者花上一年半載的時(shí)間。排列方法要素,主頁的第二個(gè)要素是排列方法,即網(wǎng)頁布局。色彩在網(wǎng)頁所占比重很大。有了合理清新的色調(diào),會(huì)彌補(bǔ)主頁上的其它不足。頁面的色彩搭配是與網(wǎng)站的主題分不開的,一個(gè)網(wǎng)站必須有一種或兩種主題色。不至于讓瀏覽者迷失方向,也不至于單調(diào)乏味。一般來說,頁面的主體文字應(yīng)盡量使用黑色等較深的顏色,與背景對(duì)比明顯,按鈕、邊框等使用彩色。例如教育類網(wǎng)站使用藍(lán)色為主題色,再用紅色和黑色作為配色,就能表達(dá)出嚴(yán)肅、穩(wěn)重的效果。網(wǎng)頁作為一種版面,既有文字,又有圖片;文字有大有小,還有標(biāo)題和正文之分;圖片頁有大小而且有橫豎之別。圖片和文字都需要同時(shí)展示給觀眾,不能簡單地將其羅列在一個(gè)頁面上,否則會(huì)搞得雜亂無章。關(guān)于具體的網(wǎng)頁布局,常見的有“國”字型、拐角型、標(biāo)題正文型、左右框架型、上下框架型、綜合框架型、封面型、Flash型、變化型等,關(guān)于它們,在網(wǎng)頁設(shè)計(jì)的相關(guān)書籍中或者在網(wǎng)絡(luò)上都可以看到詳細(xì)的敘述
網(wǎng)頁作為傳播信息的一種載體,同其他出版物如報(bào)紙、雜志等在設(shè)計(jì)上有許多共同之處,也要遵循一些設(shè)計(jì)的基本原則。但是,由于表現(xiàn)形式、運(yùn)行方式和社會(huì)功能的不同,網(wǎng)頁設(shè)計(jì)又有其自身的特殊規(guī)律。網(wǎng)頁的藝術(shù)設(shè)計(jì),是技術(shù)與藝術(shù)的結(jié)合,內(nèi)容與形式的統(tǒng)一。一般的來說,絕大多數(shù)普通受眾圖形,插件,applets和其它有關(guān)的高級(jí)Web瀏覽器特性。對(duì)我們來說,頁面的實(shí)用可能比漂亮更重要,對(duì)于用戶來說,沒有什么比頁面能夠快速下載更重要了,簡而言之,精簡你的站點(diǎn),這是一條最佳的捷徑。就站點(diǎn)設(shè)計(jì)而言,的確能夠通過成功的圖形設(shè)計(jì)招徠或者丟失訪問者。并非所有的訪問者可以完全看到圖片,某些人為了加快存取網(wǎng)絡(luò)的速度已經(jīng)關(guān)閉了瀏覽器端的圖形。簡而言之,圖形并不能正確的在客戶端加載。然而,圖形經(jīng)常被用來作為導(dǎo)航按鈕。使用可以把一個(gè)瀏覽器分成幾個(gè)不同的窗口,對(duì)于站點(diǎn)的結(jié)構(gòu)的把握是一個(gè)不錯(cuò)的方法。但是,你還是必須知道,還是有人在使用不支持幀的瀏覽器。在你開始打算設(shè)計(jì)一個(gè)幀的時(shí)候,你該仔細(xì)的考慮考慮你是否的確真的需要。經(jīng)常,你這樣的需求可以通過表格來組織站點(diǎn)的結(jié)構(gòu)。網(wǎng)頁設(shè)計(jì)涉及到對(duì)多種軟件、多種知識(shí)的學(xué)習(xí)和應(yīng)用,以及個(gè)人的審美觀等等。所以要想制作出漂亮的網(wǎng)頁,需要一個(gè)逐步學(xué)習(xí)和經(jīng)驗(yàn)積累的過程。
隨著互聯(lián)網(wǎng)的不斷發(fā)展和中國網(wǎng)絡(luò)人口的日益增長,建立個(gè)人網(wǎng)站,不但可以很好的展示自己,而且可以提高自己在計(jì)算機(jī)應(yīng)用方面的能力。個(gè)人在設(shè)計(jì)時(shí)考慮的多為個(gè)人的興趣喜好,而不注重商業(yè)的展示。內(nèi)容以反映個(gè)人為中心,從而使個(gè)人網(wǎng)站真正的成為展示自己的網(wǎng)絡(luò)名片。一張完美的主頁設(shè)計(jì)需要積累豐富的知識(shí)以及掌握大量的技巧。
由于平時(shí)課程比較繁忙,學(xué)習(xí)時(shí)間比較少,對(duì)于網(wǎng)頁設(shè)計(jì)軟件的強(qiáng)大功能運(yùn)用得還不夠。不知不覺網(wǎng)頁設(shè)計(jì)的課程將要結(jié)束了,這門課程所包含內(nèi)容的豐富是讓我從沒有想到的。在整個(gè)的學(xué)習(xí)過程中,我學(xué)習(xí)了Flash、Fireworks、Html語言、IIS、網(wǎng)站建設(shè)的基本思想等重要內(nèi)容。在網(wǎng)頁設(shè)計(jì)過程中,由于沒有網(wǎng)頁制作代碼的知識(shí),所以在設(shè)計(jì)時(shí)也遇到了很多麻煩,有時(shí)插入一個(gè)特效腳本也是很麻煩。在網(wǎng)頁制作過程中,想提高設(shè)計(jì)水平,想有個(gè)理想的網(wǎng)頁,必須學(xué)會(huì)代碼的運(yùn)用,我將在以后的學(xué)習(xí)過程中不斷加強(qiáng)這方面的學(xué)習(xí),希望老師能簡單介紹一下代碼,讓我也對(duì)它有個(gè)初步的認(rèn)識(shí),以后再加強(qiáng)學(xué)習(xí)也才會(huì)有所提高。
總體來說,通過今次的對(duì)網(wǎng)頁設(shè)計(jì)的學(xué)習(xí),有收獲也有遺憾、不足的地方,但我想,我已經(jīng)邁入了網(wǎng)頁設(shè)計(jì)的大門,只要我再認(rèn)真努力的去學(xué)習(xí),去提高,憑借我對(duì)網(wǎng)頁設(shè)計(jì)的熱情和執(zhí)著,我將來設(shè)計(jì)出的網(wǎng)頁會(huì)更加專業(yè),更完善。也希望老師在今后的日子里多指導(dǎo)。網(wǎng)頁設(shè)計(jì)還有更多的技巧,有待于我們?nèi)ネ诰蚝脱芯俊?/p>
第三篇:網(wǎng)頁設(shè)計(jì)與制作課程教學(xué)大綱
網(wǎng)頁設(shè)計(jì)與制作課程教學(xué)大綱
1.課程設(shè)計(jì)的指導(dǎo)思想
(一)課程性質(zhì)
1.課程類別:專業(yè)選修課 2.適應(yīng)專業(yè):軟件工程 3.開設(shè)學(xué)期:第二學(xué)期
4.學(xué)時(shí)安排:周學(xué)時(shí)2+2,總學(xué)時(shí)72 5.學(xué)分分配:
(二)開設(shè)目的
本課程是計(jì)算機(jī)類專業(yè)的專業(yè)選修課,它是一門操作性和實(shí)踐性很強(qiáng)的課程。本課程開設(shè)的主要目的,是為了適應(yīng)web技術(shù)的飛速發(fā)展,為學(xué)生今后在學(xué)習(xí)、工作中建立網(wǎng)站及網(wǎng)頁制作打下基礎(chǔ)。通過本課程的學(xué)習(xí),讓學(xué)生了解一定的網(wǎng)絡(luò)應(yīng)用基礎(chǔ)知識(shí);能夠熟練掌握網(wǎng)頁制作工具——網(wǎng)頁三劍客Dreamweaver、Fireworks、Flash的使用,能自行設(shè)計(jì)各種網(wǎng)頁、編輯一定的平面圖像、網(wǎng)絡(luò)動(dòng)畫。具備網(wǎng)站的建立、規(guī)劃、管理、發(fā)布的相關(guān)技術(shù)及網(wǎng)頁制作的操作技能,能獨(dú)立設(shè)計(jì) WEB 站點(diǎn)。
(三)基本要求
1、知識(shí)要求:
(1)網(wǎng)頁設(shè)計(jì)基礎(chǔ)知識(shí)(2)DREAMWEAVER 的使用(3)FIREWORKS 圖像處理(4)FLASH 的使用(5)網(wǎng)站制作實(shí)例
2、能力要求:
(1)學(xué)會(huì)熟練運(yùn)用 Dreamweaver、Flash 和 Fireworks 應(yīng)用軟件;(2)熟練掌握使用絕對(duì)和相對(duì) URL,創(chuàng)建超鏈接,圖像鏈接;(3)熟練掌握設(shè)置顏色、文本格式和列表;(4)掌握在網(wǎng)頁中添加 CSS 的方法
(5)掌握在網(wǎng)頁中嵌入圖像、聲音、多媒體信息的方法;(6)熟練掌握表格的使用方法,學(xué)會(huì)利用表格布局網(wǎng)頁;(7)掌握框架制作網(wǎng)頁的方法,會(huì)使用框架設(shè)計(jì)網(wǎng)頁;(8)掌握用 Fireworks 處理矢量圖和位圖。(9)掌握用 Flash 制作網(wǎng)頁動(dòng)畫。
3、素質(zhì)要求:
(1)具有勤奮學(xué)習(xí)的態(tài)度,嚴(yán)謹(jǐn)求實(shí)、創(chuàng)新的工作作風(fēng);(2)具有良好的心理素質(zhì)和職業(yè)道德素質(zhì)(3)具有高度責(zé)任心和良好的團(tuán)隊(duì)合作精神
(4)具有一定的科學(xué)思維方式和判斷分析問題的能力(5)具有較強(qiáng)的網(wǎng)頁設(shè)計(jì)創(chuàng)意思維、藝術(shù)設(shè)計(jì)素質(zhì)。
(四)主要內(nèi)容 計(jì)算機(jī)網(wǎng)站基礎(chǔ)知識(shí)、網(wǎng)頁三劍客DREAMWEAVER 的使用、FIREWORKS 圖像處理、FLASH 的使用。
(五)先修課程 計(jì)算機(jī)基礎(chǔ)
(六)后繼課程 Web 程序設(shè)計(jì)
(七)考核方式 上機(jī)考試
(八)使用教材
(九)參考書目
1、《網(wǎng)頁設(shè)計(jì)與制作技術(shù)教程》 作者:王傳華、段青玲、馬欽? 清華大學(xué)出版社?第二版.2、網(wǎng)頁和網(wǎng)站制作基礎(chǔ)操作與實(shí)例教程.陜西科學(xué)技術(shù)出版社
3、Dreamweaver8PhotoshopCS2Flash8網(wǎng)頁制作教材.陳笑;李景池.清華大學(xué)出版社
4、《使用網(wǎng)站技術(shù)基礎(chǔ)》作者:德力、盧明波、王化宇.內(nèi)蒙古教育出版社 教學(xué)內(nèi)容
第一部分 網(wǎng)頁設(shè)計(jì)與制作基礎(chǔ)知識(shí) 教學(xué)目的
使學(xué)生了解什么是網(wǎng)頁,網(wǎng)站,網(wǎng)頁元素等概念 主要內(nèi)容 什么是網(wǎng)頁,網(wǎng)站;2 Html語言基礎(chǔ); 構(gòu)建網(wǎng)站的一般過程; 教學(xué)要求
了解:網(wǎng)站設(shè)計(jì)與制作的前期準(zhǔn)備 掌握: 繪制網(wǎng)站首頁效果圖 第二部分 網(wǎng)頁制作軟件Dreamweaver 教學(xué)目的
使學(xué)生了解網(wǎng)站設(shè)計(jì)概念;掌握軟件界面及站點(diǎn)建立,Dreamweaver的基本功能,表單和CSS樣式表的應(yīng)用及網(wǎng)頁制作的高級(jí)技術(shù)。主要內(nèi)容
1、網(wǎng)站設(shè)計(jì)概念,要求達(dá)到“了解掌握”程度 網(wǎng)站的主題定位
網(wǎng)站的風(fēng)格和創(chuàng)意設(shè)計(jì) 準(zhǔn)備材料和結(jié)構(gòu)規(guī)劃 頁面布局
定義站點(diǎn)、申請(qǐng)域名、空間 認(rèn)識(shí)HTML語言
2、初識(shí)軟件界面及站點(diǎn)建立,要求達(dá)到“了解掌握”程度 Dreamweaver軟件界面 對(duì)象控制面板的使用 建立本地站點(diǎn) 建立遠(yuǎn)程站點(diǎn) 站點(diǎn)的更新和管理
3、Dreamweaver的基本功能,要求達(dá)到“掌握”程度,添加文本 插入圖片 插入表格
超級(jí)鏈接和導(dǎo)航條的創(chuàng)建 插入多媒體
4、表單和CSS樣式表的應(yīng)用,要求達(dá)到“了解掌握”程度 插入表單
插入表單對(duì)象
創(chuàng)建并鏈接到外部CSS樣式
5、網(wǎng)頁制作高級(jí)技術(shù),要求達(dá)到“了解掌握”程度 創(chuàng)建層 設(shè)置層
層與表格的相互轉(zhuǎn)換 創(chuàng)建框架 行為操作 創(chuàng)建模板 模板的應(yīng)用 教學(xué)要求
了解:網(wǎng)站設(shè)計(jì)概念
掌握:軟件界面及站點(diǎn)建立,Dreamweaver的基本功能,表單和CSS樣式表的應(yīng)用及網(wǎng)頁制作的高級(jí)技術(shù)。
第三部分 圖形制作與處理軟件Firewoks 教學(xué)目的
使學(xué)生了解Fireworks軟件界面;掌握?qǐng)D像的繪制和編輯,文本與顏色的使用,層與元件的使用,濾鏡和特效的使用,按鈕和動(dòng)畫的制作。主要內(nèi)容
1、Fireworks簡介,要求達(dá)到“了解掌握”程度 Fireworks概述
Fireworks的系統(tǒng)需求 Fireworks的新增功能 Fireworks窗口界面 創(chuàng)建新文檔
導(dǎo)入和導(dǎo)出文檔
2、圖像的繪制和編輯,要求達(dá)到“掌握”程度 繪制圖像 編輯圖像
3、文本與顏色,要求達(dá)到“掌握”程度 文本的使用 顏色的使用 設(shè)置畫布
4、層與元件,要求達(dá)到“掌握”程度 層的使用 元件的使用
5、濾鏡和特效,要求達(dá)到“了解掌握”程度 使用濾鏡 使用特效
6、按鈕和動(dòng)畫,要求達(dá)到“了解掌握”程度 按鈕 動(dòng)畫
教學(xué)要求
了解:Fireworks軟件界面
掌握:圖像的繪制和編輯,文本與顏色的使用,層與元件的使用,濾鏡和特效的使用,按鈕和動(dòng)畫的制作。第四部分 動(dòng)畫制作與編輯軟件Flash 教學(xué)目的
使學(xué)生了解Flash基本工作環(huán)境;掌握Flash繪圖工具的使用方法,F(xiàn)lash動(dòng)畫基礎(chǔ)及FIash影片制作和發(fā)布。主要內(nèi)容
1、初識(shí)Flash,要求達(dá)到“了解”程度 Flash基本工作環(huán)境 認(rèn)識(shí)舞臺(tái)與時(shí)間軸.認(rèn)識(shí)不同作用的面板
2、Flash繪圖工具,要求達(dá)到“掌握”程度 矢量圖與位圖 線型與顏色
線條的繪制與修改 填充圖形的繪制,選取工具 文本
變換工具 其他工具
3、Flash動(dòng)畫基礎(chǔ),要求達(dá)到“掌握”程度 層 幀 元件
Flash的基本操作
4、FIash影片制作和發(fā)布,要求達(dá)到“掌握”程度 動(dòng)畫基礎(chǔ) 逐幀動(dòng)畫 形狀漸變 動(dòng)作漸變 蒙板
運(yùn)動(dòng)導(dǎo)線 按鈕
軌跡追蹤 導(dǎo)入聲音 加入視頻 測試發(fā)布 教學(xué)要求
了解:Flash基本工作環(huán)境
掌握:Flash繪圖工具的使用方法,F(xiàn)lash動(dòng)畫基礎(chǔ)及FIash影片制作和發(fā)布。第五章 綜合實(shí)例 教學(xué)目的
使學(xué)生能夠熟練掌握網(wǎng)頁制作工具Dreamvwaver、Fireworks、Flash的使用,能自行設(shè)計(jì)各種網(wǎng)頁、編輯一定的平面圖象、網(wǎng)絡(luò)動(dòng)畫。具備網(wǎng)站的建立、規(guī)劃、管理、發(fā)布的相關(guān)技術(shù)及網(wǎng)頁制作的操作技能,能獨(dú)立設(shè)計(jì) WEB 站點(diǎn)。主要內(nèi)容
綜合實(shí)例,要求達(dá)到“掌握”程度 網(wǎng)頁設(shè)計(jì)準(zhǔn)備工作
用Fireworks設(shè)計(jì)網(wǎng)頁結(jié)構(gòu) 用Dreamweaver生成網(wǎng)頁 用Flash制作網(wǎng)頁動(dòng)畫 整理網(wǎng)頁
完成小型WEB站點(diǎn)網(wǎng)頁的規(guī)劃、設(shè)計(jì)、管理與維護(hù) 教學(xué)要求
掌握:Web網(wǎng)站建設(shè)的基本方法,掌握網(wǎng)頁制作工具的使用方法和技巧,培養(yǎng)學(xué)生設(shè)計(jì)網(wǎng)站的能力。課時(shí)分配及其它
(一)課時(shí)分配
課程總教學(xué)時(shí)數(shù)為90學(xué)時(shí),安排在第二學(xué)期,每周3+2學(xué)時(shí),上課18周。具體分配如下
教學(xué)內(nèi)容 講授學(xué)時(shí)數(shù)
章次
第一部分 網(wǎng)頁設(shè)計(jì)與制作基礎(chǔ)知識(shí) 4 第二部分 網(wǎng)頁制作軟件Dreamweaver 12 第三部分 圖形制作與處理軟件Firewoks 8 第四部分 動(dòng)畫制作與編輯軟件Flash 8 第五部分 綜合實(shí)例 4 合計(jì)
實(shí)驗(yàn)學(xué)時(shí)數(shù) 10 8 2 36
(二)考核要求
平時(shí)成績(含考勤、作業(yè)與實(shí)驗(yàn))占50%,期末(上機(jī)考試)成績占50%。
第四篇:網(wǎng)頁設(shè)計(jì)與制作課程作業(yè)任務(wù)書
廣新09級(jí)《網(wǎng)頁設(shè)計(jì)與制作》課程作業(yè)任務(wù)書
一、目的與任務(wù)
《網(wǎng)頁設(shè)計(jì)與制作》課程作業(yè)是《網(wǎng)頁設(shè)計(jì)與制作》課程教學(xué)中的一個(gè)重要的環(huán)節(jié),是對(duì)學(xué)生進(jìn)行的一次較為全面的網(wǎng)頁設(shè)計(jì)與制作的訓(xùn)練和考核。其基本目的是:
(1)培養(yǎng)學(xué)生理論聯(lián)系實(shí)際的設(shè)計(jì)思想,訓(xùn)練綜合運(yùn)用所學(xué)的基礎(chǔ)理論知識(shí),結(jié)合生產(chǎn)實(shí)際分析和解決網(wǎng)頁設(shè)計(jì)與制作中問題的能力,從而使基礎(chǔ)理論知識(shí)得到鞏固和加深。
(2)學(xué)習(xí)掌握網(wǎng)站的一般設(shè)計(jì)過程和方法。
(3)對(duì)學(xué)生所學(xué)知識(shí)的程度進(jìn)行考核。
二、教學(xué)基本要求
(1)確定設(shè)計(jì)網(wǎng)站的主題和風(fēng)格。
(2)合理設(shè)計(jì)網(wǎng)站結(jié)構(gòu)圖。
(3)根據(jù)網(wǎng)站結(jié)構(gòu)圖,對(duì)各個(gè)頁面進(jìn)行布局和樣式設(shè)計(jì)。
(4)完成課程作業(yè)報(bào)告。
三、課程作業(yè)題目具體要求
1、網(wǎng)站有一個(gè)主題,比如:個(gè)人網(wǎng)站、購物網(wǎng)站等;
2、每個(gè)網(wǎng)站至少包含5個(gè)以上的html文件;(網(wǎng)站的首頁統(tǒng)一名稱為:index.html)
3、最后提交兩個(gè)內(nèi)容:
1)打印紙質(zhì)報(bào)告(具體要求見報(bào)告模板);
2)網(wǎng)站源文件。
做完后找老師驗(yàn)收通過后發(fā)到365109338@qq.com。郵件主題上一定要寫明:學(xué)號(hào)+班級(jí)+姓名+網(wǎng)頁設(shè)計(jì)與制作
第五篇:網(wǎng)頁設(shè)計(jì)與制作-論文(本站推薦)
第一章
緒論
摘 要
本論文將對(duì)個(gè)人網(wǎng)頁設(shè)計(jì)與制作的方法、工具等展開研究和探討。在介紹網(wǎng)頁設(shè)計(jì)與制作語言的基礎(chǔ)上,著重使用JavaScript作為工具語言進(jìn)行網(wǎng)頁設(shè)計(jì)與制作的實(shí)際操作,分別對(duì)基于對(duì)象的JavaScript語言、內(nèi)部對(duì)象系統(tǒng)的使用及WEB頁面信息交互——窗口和框架進(jìn)行詳細(xì)描述,并利用具體的實(shí)例進(jìn)行驗(yàn)證。
本論文主要章節(jié)如下,第一章:緒論,本章主要介紹網(wǎng)頁設(shè)計(jì)的相關(guān)知識(shí)。第二章:網(wǎng)頁設(shè)計(jì)語言概述,本章主要介紹網(wǎng)頁設(shè)計(jì)的語言——HTML,以及用于編輯HTML語言的軟件,為后續(xù)工作奠定基礎(chǔ)。第三章:基于對(duì)象的JavaScript語言,本章介紹了基于對(duì)象的JavaScript中常用內(nèi)部對(duì)象屬性、方法的使用。第四章:內(nèi)部對(duì)象系統(tǒng)的使用,本章主要介紹使用瀏覽器的內(nèi)部對(duì)象系統(tǒng),可實(shí)現(xiàn)與HTML文檔進(jìn)行交互。第五章:WEB頁面信息的交互——窗體與框架,本章主要介紹實(shí)現(xiàn)網(wǎng)頁的動(dòng)態(tài)交互,必須掌握有關(guān)窗體對(duì)象(Form)和框架對(duì)象(Frames)更為復(fù)雜的知識(shí)。
關(guān)鍵詞: 網(wǎng)頁制作;網(wǎng)頁設(shè)計(jì);HTML;ASP
第一章
緒論
第一章 緒論
隨著21世紀(jì)的到來,人們更深切地感受到計(jì)算機(jī)在生活和工作中的作用越來越重要,越來越來的職業(yè)需要具有計(jì)算機(jī)的應(yīng)用技能。掌握計(jì)算機(jī)是職業(yè)的需要,更是事業(yè)發(fā)展的需要。網(wǎng)頁設(shè)計(jì)與制作是計(jì)算機(jī)能力的具體表現(xiàn),本章主要介紹網(wǎng)頁設(shè)計(jì)的相關(guān)知識(shí)。
1.1 網(wǎng)頁設(shè)計(jì)概述
網(wǎng)站是企業(yè)向用戶和網(wǎng)民提供信息(包括產(chǎn)品和服務(wù))的一種方式,是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺(tái),離開網(wǎng)站(或者只是利用第三方網(wǎng)站)去談電子商務(wù)是不可能的。企業(yè)的網(wǎng)址被稱為“網(wǎng)絡(luò)商標(biāo)”,也是企業(yè)無形資產(chǎn)的組成部分,而網(wǎng)站是INTERNET上宣傳和反映企業(yè)形象和文化的重要窗口。
1.2 網(wǎng)頁設(shè)計(jì)的要素
網(wǎng)頁設(shè)計(jì)的兩大要素是:整體風(fēng)格和色彩搭配。
一、確定網(wǎng)站的整體風(fēng)格
在這里,我提供給大家一些參考經(jīng)驗(yàn):
1.將你的標(biāo)志logo,盡可能的放在每個(gè)頁面上最突出的位置。2.突出你的標(biāo)準(zhǔn)色彩。
3.總結(jié)一句能反映貴站精髓的宣傳標(biāo)語!
4.相同類型的圖像采用相同效果,比如說標(biāo)題字都采用陰影效果,那么在網(wǎng)站中出現(xiàn)的所有標(biāo)題字的陰影效果的設(shè)置應(yīng)該是完全一致的!
二、網(wǎng)頁色彩的搭配
1.用一種色彩。這里是指先選定一種色彩,然后調(diào)整透明度或者飽和度,這樣的頁面看起來色彩統(tǒng)一,有層次感。
2.用兩種色彩。先選定一種色彩,然后選擇它的對(duì)比色。
3.用一個(gè)色系。簡單的說就是用一個(gè)感覺的色彩,例如淡藍(lán),淡黃,淡綠;或者土黃,土灰,土藍(lán)。
1.3 大作業(yè)目的和意義
本大作業(yè)主要是對(duì)網(wǎng)頁設(shè)計(jì)與制作的語言基礎(chǔ)上進(jìn)行探討,主要內(nèi)容如下:通過已經(jīng)做好的網(wǎng)頁,分析html網(wǎng)頁設(shè)計(jì)技術(shù)、XML技術(shù)、Java Applet技術(shù)和Javascript技術(shù)在網(wǎng)頁設(shè)計(jì)中的應(yīng)用。
第一章
緒論
1.4 要分析的網(wǎng)頁
第一章
緒論
第一章
緒論
第二章
HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
第二章 HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
2.1 HTML語言介紹
HTML(HyperText Mark-up Language)即超文本標(biāo)記語言或超文本鏈接標(biāo)示語言,是目前網(wǎng)絡(luò)上應(yīng)用最為廣泛的語言,也是構(gòu)成網(wǎng)頁文檔的主要語言。
HTML文本是由HTML命令組成的描述性文本,HTML命令可以說明文字、圖形、動(dòng)畫、聲音、表格、鏈接等。HTML的結(jié)構(gòu)包括頭部(Head)、主體(Body)兩大部分,其中頭部描述瀏覽器所需的信息,而主體則包含所要說明的具體內(nèi)容。
2.1.1 HTML語言的特點(diǎn)
HTML文檔制作不是很復(fù)雜,且功能強(qiáng)大,支持不同數(shù)據(jù)格式的文件鑲?cè)?,這也是WWW盛行的原因之一,HTML語言的特點(diǎn)如下:
1、簡易性,HTML版本升級(jí)采用超集方式,從而更加靈活方便。
2、可擴(kuò)展性,HTML語言的廣泛應(yīng)用帶來了加強(qiáng)功能,增加標(biāo)識(shí)符等要求,HTML采取子類元素的方式,為系統(tǒng)擴(kuò)展帶來保證。
3、平臺(tái)無關(guān)性。雖然PC機(jī)大行其道,但使用MAC等其他機(jī)器的大有人在,HTML可以使用在廣泛的平臺(tái)上,這也是WWW盛行的另一個(gè)原因。
2.1.2 HTML語言的編輯軟件
HTML的本質(zhì)是文本,需要瀏覽器的解釋,HTML的編輯器大體可以分為三種:
1、基本編輯軟件,使用WINDOWS自帶的記事本或?qū)懽职娑伎梢跃帉?,?dāng)然,如果你用WPS來編寫,也可以。不過存盤時(shí)請(qǐng)使用.htm或.html作為擴(kuò)展名,這樣瀏覽器就可以解釋執(zhí)行了。
2、半所見即所得軟件,這種軟件能大大提高開發(fā)效率,它可以使你在很短的時(shí)間內(nèi)做出Homepage,且可以學(xué)習(xí)HTML,這種類型的軟件主要有HOTDOG,還有國產(chǎn)的軟件網(wǎng)頁作坊。
3、所見即所得軟件,使用最廣泛的編輯器,完全可以一點(diǎn)不懂HTML的知識(shí)就可以做出網(wǎng)頁,這類軟件主要有Frontpage,DREAMWEAVER、Delphi、Eclipse、UltraEdit。
2.1.4 html語言在網(wǎng)頁設(shè)計(jì)中的應(yīng)用
第二章
HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
2.2.3JavaScript技術(shù)在網(wǎng)頁設(shè)計(jì)中應(yīng)用
一、JavaScript概述
JavaScript是一種基于對(duì)象(Object)和事件驅(qū)動(dòng)(Event Driven)并具有安全性能的腳本語言。使用它的目的是與HTML超文本標(biāo)記語言、Java 腳本語言(Java小程序)一起實(shí)現(xiàn)在一個(gè)Web頁面中鏈接多個(gè)對(duì)象,與Web客戶交互作用。從而可以開發(fā)客戶端的應(yīng)用程序等。它是通過嵌入或調(diào)入在標(biāo)準(zhǔn)的HTML語言中實(shí)現(xiàn)的。它的出現(xiàn)彌補(bǔ)了HTML語言的缺陷,它是Java與HTML折衷的選擇,具有以下幾個(gè)基本特點(diǎn):
1、是一種腳本編寫語言
JavaScript是一種腳本語言,它采用小程序段的方式實(shí)現(xiàn)編程。像其它腳本語言一樣,JavaScript同樣已是一種解釋性語言,它提供了一個(gè)易的開發(fā)過程。
它的基本結(jié)構(gòu)形式與C、C++、VB、Delphi十分類似。但它不像這些語言一樣,需要先編譯,而是在程序運(yùn)行過程中被逐行地解釋。它與HTML標(biāo)識(shí)結(jié)合在一起,從而方便用戶的使用操作。
2、基于對(duì)象的語言。
JavaScript是一種基于對(duì)象的語言,同時(shí)以可以看作一種面向?qū)ο蟮?。這意味著它能運(yùn)用自己已經(jīng)創(chuàng)建的對(duì)象。因此,許多功能可以來自于腳本環(huán)境中對(duì)象的方法與腳本的相互作用。
3、簡單性
JavaScript的簡單性主要體現(xiàn)在:首先它是一種基于Java基本語句和控制流之上的簡單而緊湊的設(shè)計(jì), 從而對(duì)于學(xué)習(xí)Java是一種非常好的過渡。其次它的變量類型是采用弱類型,并未使用嚴(yán)格的數(shù)據(jù)類型。
4、安全性
JavaScript是一種安全性語言,它不允許訪問本地的硬盤,并不能將數(shù)據(jù)存入到服務(wù)器上,不允許對(duì)網(wǎng)絡(luò)文檔進(jìn)行修改和刪除,只能通過瀏覽器實(shí)現(xiàn)信息瀏覽或動(dòng)態(tài)交互。從而有效地防止數(shù)據(jù)的丟失。
5、動(dòng)態(tài)性的
JavaScript是動(dòng)態(tài)的,它可以直接對(duì)用戶或客戶輸入做出響應(yīng),無須經(jīng)過Web服務(wù)程序。它對(duì)用戶的反映響應(yīng),是采用以事件驅(qū)動(dòng)的方式進(jìn)行的。所謂事件驅(qū)動(dòng),就是指在主頁(Home Page)中執(zhí)行了某種操作所產(chǎn)生的動(dòng)作,就稱為“事件”(Event)。比如按下鼠標(biāo)、移動(dòng)窗口、選擇菜單等都可以視為事件。當(dāng)事件發(fā)生后,可能會(huì)引起相應(yīng)的事件響應(yīng)。
6、跨平臺(tái)性
JavaScript是依賴于瀏覽器本身,與操作環(huán)境無關(guān),只要能運(yùn)行瀏覽器的計(jì)算機(jī),并支持JavaScript的瀏覽器就可正確執(zhí)行。從而實(shí)現(xiàn)了“編寫一次,走遍天下”的夢(mèng)想。
實(shí)際上JavaScript最杰出之處在于可以用很小的程序做大量的事。無須有高性能的電腦,軟件僅需一個(gè)字處理軟件及一瀏覽器,無須WEB服務(wù)器通道,通過自己的電腦即可完成所有的事情。
總之,JavaScript 是一種新的描述語言,它可以被箝入到 HTML 的文件之中。JavaScript語言可以做到回應(yīng)使用者的需求事件(如:form的輸入),而不用任何的網(wǎng)路來回傳輸資料,所以當(dāng)一位使用者輸入一項(xiàng)資料時(shí),它不用經(jīng)過傳給伺服端(server)處理,再傳回來的過程,而直接可以被客戶端(client)的應(yīng)用程式所處理。
第二章
HTML網(wǎng)頁設(shè)計(jì)技術(shù)的應(yīng)用
第五章
色彩在網(wǎng)頁中的應(yīng)用
第五章 色彩在網(wǎng)頁中的應(yīng)用
5.1色彩在網(wǎng)頁中的應(yīng)用
色彩是藝術(shù)表現(xiàn)的要素之一。在網(wǎng)頁設(shè)計(jì)中,我們的設(shè)計(jì)師根據(jù)和諧、均衡和重點(diǎn)突出的原則,將不同的色彩進(jìn)行組合.搭配來構(gòu)成美麗的頁面。根據(jù)色彩對(duì)人們心理的影響,合理地加以運(yùn)用。
先選定一種色彩,然后調(diào)整透明度或者飽和度,這樣的頁面看起來色彩統(tǒng)一,有層次感。簡單的說就是用一個(gè)感覺的色彩,例如淡藍(lán),淡黃,淡綠;或者土黃,土灰,土藍(lán)。
在網(wǎng)頁配色中不要將所有顏色都用到,盡量控制在三至五種色彩以內(nèi)。背景和前文的對(duì)比盡量要大以便突出主要文字內(nèi)容。
5.2主頁色彩的處理
色彩是人的視覺最敏感的東西。主頁的色彩處理得好,可以錦上添花,達(dá)到事半功倍的效果。色彩總的應(yīng)用原則應(yīng)該是“總體協(xié)調(diào),局部對(duì)比”,也就是:主頁的整體色彩效果應(yīng)該是和諧的,只有局部的、小范圍的地方可以有一些強(qiáng)烈色彩的對(duì)比。在色彩的運(yùn)用上,可以根據(jù)主頁內(nèi)容的需要,分別采用不同的主色調(diào)。因?yàn)樯示哂邢笳餍?,例如:嫩綠色、翠綠色、金黃色、灰褐色就可以分別象征著春、夏、秋、冬。其次還有職業(yè)的標(biāo)志色,例如:軍警的橄欖綠,醫(yī)療衛(wèi)生的白色等。色彩還具有明顯的心理感覺,例如冷、暖的感覺,進(jìn)、退的效果等。另外,色彩還有民族性,各個(gè)民族由于環(huán)境、文化、傳統(tǒng)等因素的影響,對(duì)于色彩的喜好也存在著較大的差異。充分運(yùn)用色彩的這些特性,可以使我們的主頁具有深刻的藝術(shù)內(nèi)涵,從而提升主頁的文化品位。
5.3常用的配色方案
1.暖色調(diào)。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調(diào)的運(yùn)用,可使主頁呈現(xiàn)溫馨、和煦、熱情的氛圍。
2.冷色調(diào)。即青色、綠色、紫色等色彩的搭配。這種色調(diào)的運(yùn)用,可使主頁呈現(xiàn)寧靜、清涼、高雅的氛圍。
3.對(duì)比色調(diào)。即把色性完全相反的色彩搭配在同一個(gè)空間里。例如:紅與綠、黃與紫、橙與藍(lán)等。這種色彩的搭配,可以產(chǎn)生強(qiáng)烈的視覺效果,給人亮麗、鮮艷、喜慶的感覺。
第五章
色彩在網(wǎng)頁中的應(yīng)用
最后,還要考慮主頁底色(背景色)的深、淺,這里借用攝影中的一個(gè)術(shù)語,就是“高調(diào)”和“低調(diào)”。底色淺的稱為高調(diào);底色深的稱為低調(diào)。底色深,文字的顏色就要淺,以深色的背景襯托淺色的內(nèi)容(文字或圖片);反之,底色淡的,文字的顏色就要深些,以淺色的背景襯托深色的內(nèi)容(文字或圖片)。這種深淺的變化在色彩學(xué)中稱為“明度變化”。當(dāng)然,色彩的明度也不能變化太大,否則屏幕上的亮度反差太強(qiáng),同樣也會(huì)使讀者的眼睛受不了。
5.4合理搭配網(wǎng)頁色彩
網(wǎng)頁的色彩是樹立網(wǎng)站形象的關(guān)鍵之一,網(wǎng)頁的背景、文字、圖標(biāo)、邊框、超鏈接等都要用到色彩。不同的色彩會(huì)使瀏覽者有不同的心理感受。合理的搭配色彩,會(huì)更好的表現(xiàn)主題,吸引用戶的注意力。網(wǎng)頁色彩涉及到藝術(shù)知識(shí),讓美術(shù)教師參加網(wǎng)頁色彩設(shè)計(jì),可能會(huì)出現(xiàn)比較理想的效果。在色彩搭配上要注意色彩的鮮明性、獨(dú)特性、合適性、聯(lián)想性。背景色和前景色對(duì)比要大,以突出主要內(nèi)容
網(wǎng)站給人的第一印象來自視覺沖擊,不同的色彩搭配產(chǎn)生不同的效果,并可能影響到訪問者的情緒?!皹?biāo)準(zhǔn)色彩”是指能體現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩,要用于網(wǎng)站的標(biāo)志,標(biāo)題,主菜單和主色塊。給人以整體統(tǒng)一的感覺。至于其它色彩也可以使用,但應(yīng)當(dāng)只是作為點(diǎn)綴和襯托,絕不能喧賓奪主。一般來說,一個(gè)網(wǎng)站的標(biāo)準(zhǔn)色彩不超過3種,太多則讓人眼花繚亂。適合于網(wǎng)頁標(biāo)準(zhǔn)色的顏色有:藍(lán)色,黃/橙色,黑/灰/白色三大系列色。
第五章
色彩在網(wǎng)頁中的應(yīng)用
第六章 WEB頁面信息的交互——窗體與框架
要實(shí)現(xiàn)網(wǎng)頁的動(dòng)態(tài)交互,必須掌握有關(guān)窗體對(duì)象(Form)和框架對(duì)象(Frames)更為復(fù)雜的知識(shí)。
6.1窗體基礎(chǔ)知識(shí)
窗體對(duì)象可以使設(shè)計(jì)人員能用窗體中不同的元素與客戶機(jī)用戶相交互,而用不著在之前首先進(jìn)行數(shù)據(jù)輸入,就可以實(shí)現(xiàn)動(dòng)態(tài)改變Web文檔的行為。
6.1.1窗體對(duì)象
窗體(Form):它構(gòu)成了Web頁面的基本元素。通常一個(gè)Web頁面有一個(gè)窗體或幾個(gè)窗體,使用Forms[]數(shù)組來實(shí)現(xiàn)不同窗體的訪問。
在Forms[0]中共有三個(gè)基本元素,而Forms[1]中只有兩個(gè)元素。窗體對(duì)象最主要的功能就是能夠直接訪問HTML文檔中的窗體,它封裝了相關(guān)的HTML代碼:
6.1.2 窗體對(duì)象的方法窗體對(duì)象的方法只有一個(gè)--submit()方法,該方法主要功用就是實(shí)現(xiàn)窗體信息的提交。如提交Mytest窗體,則使用下列格式:
document.mytest.submit()
第五章
色彩在網(wǎng)頁中的應(yīng)用
6.1.3 窗體對(duì)象的屬性
窗體對(duì)象中的屬性主要包括以下:elements name action target encoding method。除Elements外,其它幾個(gè)均反映了窗體中標(biāo)識(shí)中相應(yīng)屬性的狀態(tài),這通常是單個(gè)窗體標(biāo)識(shí);而elements常常是多個(gè)窗體元素值的數(shù)組,例:
elements[0].Mytable.elements[1] 6.1.4 訪問窗體對(duì)象
在JavaScript中訪問窗體對(duì)象可由兩種方法實(shí)現(xiàn):(1)通過訪問窗體
在窗體對(duì)象的屬性中首先必須指定其窗體名,而后就可以通過下列標(biāo)識(shí)訪問窗體如:document.Mytable()。
(2)通過數(shù)組來訪問窗體
除了使用窗體名來訪問窗體外,還可以使用窗體對(duì)象數(shù)組來訪問窗體對(duì)象。但需要注意一點(diǎn),因窗體對(duì)象是由瀏覽器環(huán)境的提供的,而瀏覽器環(huán)境所提供的數(shù)組下標(biāo)是由0到n。所以可通過下列格式實(shí)現(xiàn)窗體對(duì)象的訪問:
document.forms[0] document.forms[1] document.forms[2]...6.1.5 引用窗體的先決條件
在JavaScript中要對(duì)窗體引用的條件是:必須先在頁面中用標(biāo)識(shí)創(chuàng)建窗體,并將定義窗體部分放在引用之前。
6.2 窗體中的基本元素
窗體中的基本元素由按鈕、單選按鈕、復(fù)選按鈕、提交按鈕、重置按鈕、文本框等組成。
在JavaScript中要訪問這些基本元素,必須通過對(duì)應(yīng)特定的窗體元素的數(shù)組下標(biāo)或窗體元素名來實(shí)現(xiàn)。每一個(gè)元素主要是通過該元素的屬性或方法來引用。其引用的基本格式見下:
formName.elements[].methadName(窗體名.元素名或數(shù)組.方法)formName.elemaent[].propertyName(窗體名.元素名或數(shù)組.屬性)下面分別介紹:
(1)Text單行單列輸入元素
功能:對(duì)Text標(biāo)識(shí)中的元素實(shí)施有效的控制。基本屬性:
Name:設(shè)定提交信息時(shí)的信息名稱。對(duì)應(yīng)于HTML文檔中的Name。Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。defaultvalue:包括Text元素的默認(rèn)值 基本方法:
blur():將當(dāng)前焦點(diǎn)移到后臺(tái)。
第五章
色彩在網(wǎng)頁中的應(yīng)用
select():加亮文字。主要事件:
onFocus:當(dāng)Text獲得焦點(diǎn)時(shí),產(chǎn)生該事件。OnBlur:從元素失去焦點(diǎn)時(shí),產(chǎn)生該事件。Onselect:當(dāng)文字被加亮顯示后,產(chǎn)生該文件。onchange:當(dāng)Text元素值改變時(shí),產(chǎn)生該文件。例:
...(2)textarea多行多列輸入元素功能:實(shí)施對(duì)Textarea中的元素進(jìn)行控制?;緦傩?/p>
name:設(shè)定提交信息時(shí)的信息名稱,對(duì)應(yīng)HTML文檔Textarea的Name。Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。Default value:元素的默認(rèn)值。方法:
blur():將輸入焦點(diǎn)失去 select():將文字加亮后 事件:
onBlur:當(dāng)失去輸入焦點(diǎn)后產(chǎn)生該事件 onFocus:當(dāng)輸入獲得焦點(diǎn)后,產(chǎn)生該文件 Onchange:當(dāng)文字值改變時(shí),產(chǎn)生該事件 Onselect:當(dāng)文字加亮后,產(chǎn)生該文件(3)Select選擇元素
功能:實(shí)施對(duì)滾動(dòng)選擇元素的控制。屬性:
name:設(shè)定提交信息時(shí)的信息名稱,對(duì)應(yīng)文檔select中的name。Length:對(duì)應(yīng)文檔select中的length options:組成多個(gè)選項(xiàng)的數(shù)組 selectIndex;該下標(biāo)指明一個(gè)選項(xiàng)
select在中每一選項(xiàng)都含有以下屬性: Text:選項(xiàng)對(duì)應(yīng)的文字
selected:指明當(dāng)前選項(xiàng)是否被選中 Index:指明當(dāng)前選項(xiàng)的位置 defaultselected:默認(rèn)選項(xiàng) 事件:
第五章
色彩在網(wǎng)頁中的應(yīng)用
OnBlur:當(dāng)select選項(xiàng)失去焦點(diǎn)時(shí),產(chǎn)生該文件。onFocas:當(dāng)select獲得焦點(diǎn)時(shí),產(chǎn)生該文件。Onchange:選項(xiàng)狀態(tài)改變后,產(chǎn)生該事件。(4)Button按鈕
功能:實(shí)施對(duì)Button按鈕的控制。屬性:
Name:設(shè)定提交信息時(shí)的信息名稱,對(duì)應(yīng)文檔中button的Name。Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。方法:
click()該方法類似于一個(gè)按下的按鈕。事件:
onclick當(dāng)單擊button按鈕時(shí),產(chǎn)生該事件。例 :
........(5)checkbox檢查框功能:實(shí)施對(duì)一個(gè)具有復(fù)選框中元素的控制。屬性:
name:設(shè)定提交信息時(shí)的信息名稱。
Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息。Checked:該屬性指明框的狀態(tài)true/false.defauitchecked:默認(rèn)狀態(tài) 方法:
click()該方法使得框的某一個(gè)項(xiàng)被選中。事件:
Onclick:當(dāng)框的選被選中時(shí),產(chǎn)生該事件。(6)radio無線按鈕
功能:實(shí)施對(duì)一個(gè)具單選功能的無線按鈕控制。屬性:
Name:設(shè)定提交信息時(shí)的信息名稱,對(duì)應(yīng)HTML文檔中的radio的name相同 Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息,對(duì)應(yīng)HTML文檔中的radio的name。
length:單選按鈕中的按鈕數(shù)目。defalechecked:默認(rèn)按鈕。
checked:指明選中還是沒有選中。
第五章
色彩在網(wǎng)頁中的應(yīng)用
index:選中的按鈕的位置。方法:
chick():選定一個(gè)按鈕。事件:
onclick:單擊按鈕時(shí),產(chǎn)生該事件。(7)hidden:隱藏
功能:實(shí)施對(duì)一個(gè)具有不顯示文字并能輸入字符的區(qū)域元素的控制。屬性:
name:設(shè)定提交信息時(shí)的信息名稱,對(duì)應(yīng)HTML文檔的hidden中的Name。
Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息,對(duì)應(yīng)HTML文檔hidden中的value。
defaleitvalue:默認(rèn)值(8)Password口令
功能:實(shí)施對(duì)具有口令輸入的元素的控制。屬性:
Name:設(shè)定提交信息時(shí)的信息名稱,對(duì)應(yīng)HTML文檔中password中的name。Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息,對(duì)應(yīng)HTML文檔中password中的Value。
defaultvalu:默認(rèn)值 方法:
select():加亮輸入口令域。
blur():使這丟失passward輸入焦點(diǎn)。focus():獲得password輸入焦點(diǎn)。(9)submit提交元素
功能:實(shí)施對(duì)一個(gè)具有提交功能按鈕的控制。屬性:
name:設(shè)定提交信息時(shí)的信息名稱,對(duì)應(yīng)HTML文檔中submit。
Value:用以設(shè)定出現(xiàn)在窗口中對(duì)應(yīng)HTML文檔中Value的信息,對(duì)應(yīng)HTML文檔中value。
方法
click()相當(dāng)于按下submit按鈕。事件:
onclick()當(dāng)按下該按鈕時(shí),產(chǎn)生該事件。
6.3窗體對(duì)象實(shí)例
下面我們演示通過點(diǎn)擊一個(gè)按鈕(red)來改變窗口顏色,點(diǎn)擊“調(diào)用動(dòng)態(tài)按鈕文檔”調(diào)用一個(gè)動(dòng)態(tài)按鈕文檔。
test8_1.htm
調(diào)用動(dòng)態(tài)按鈕文檔