第一篇:《體驗網(wǎng)站規(guī)劃與設(shè)計》教學(xué)反思
《體驗網(wǎng)站規(guī)劃與設(shè)計》教學(xué)反思
《體驗網(wǎng)站規(guī)劃與設(shè)計》教學(xué)反思
今天上午,我在高二(1)班上了一節(jié)公開課,上課的內(nèi)容是《體驗網(wǎng)站規(guī)劃與設(shè)計》。整個教學(xué)過程以師生訪問分析網(wǎng)站為主線,采取分組討論、小組活動進(jìn)行。教學(xué)中以任務(wù)驅(qū)動、自主學(xué)習(xí),交流學(xué)習(xí)以及引領(lǐng)展示的模式,將規(guī)劃過程分解為幾個任務(wù),根據(jù)所學(xué)知識,完成對網(wǎng)站規(guī)劃選題、域名、欄目及藝術(shù)風(fēng)格的規(guī)劃與設(shè)計進(jìn)行學(xué)習(xí),并將各小組任務(wù)完成的情況以學(xué)案—《網(wǎng)站規(guī)劃與設(shè)計方案》的形式呈現(xiàn)出來。通過展示學(xué)生設(shè)計方案,對學(xué)生成果給予評價與肯定,激發(fā)學(xué)生進(jìn)一步學(xué)習(xí)的興趣,培養(yǎng)學(xué)生主動思考、積極參加團(tuán)結(jié)協(xié)作。
成功之處,本節(jié)課教學(xué)環(huán)節(jié)完整,對三維目標(biāo)把握較好,同時認(rèn)真的對學(xué)情進(jìn)行了分析。本節(jié)課,對學(xué)高二火箭班的學(xué)生,我注重了學(xué)生發(fā)散性思維、語言表達(dá)能力、邏輯推理思維的培養(yǎng),同時引導(dǎo)學(xué)生學(xué)會鑒賞、學(xué)生聆聽、學(xué)會尊重,學(xué)生在較短的時間內(nèi)能夠很好的完成教學(xué)各環(huán)節(jié)的實踐,最終形成了完成的方案,且能很好的陳述。
不足之處,本節(jié)課,整個教學(xué)過程都是需要網(wǎng)絡(luò)支撐,由于網(wǎng)絡(luò)突然出現(xiàn)問題,而心中又想達(dá)到理想的課堂,希望給學(xué)生一個完整的教學(xué)過程,導(dǎo)致課堂的暫時中斷,而此后壓縮了學(xué)生討論和展示成果的一些時間,后面的教學(xué)時間和節(jié)奏略顯蒼促,課堂小節(jié)也不是很到位。
經(jīng)驗總結(jié):在教學(xué)過程中,我也考慮到網(wǎng)絡(luò)和電的問題,但是心向往對課堂存理想化狀態(tài),實際上不然,不想發(fā)現(xiàn)的事終究發(fā)生了,以此,不管是哪種級別的公開課,都要著兩種備案才可,以免出現(xiàn)課堂教學(xué)事故而讓自己陷入囧境。
第二篇:《規(guī)劃設(shè)計網(wǎng)站》教學(xué)設(shè)計
八年級下冊
八年級下冊
八年級下冊
八年級下冊
八年級下冊
第三篇:網(wǎng)站規(guī)劃與設(shè)計心得
第一次接觸網(wǎng)站規(guī)劃與設(shè)計,而且是自己參與設(shè)計一個網(wǎng)站,所以非常興奮,從前期網(wǎng)站主題的確定與相關(guān)內(nèi)容的分析到網(wǎng)站的設(shè)計,每個隊員都在積極努力,出謀劃策,每個人都在經(jīng)歷一場頭腦風(fēng)暴。
1.確定主題。制作網(wǎng)站首先確定主題,我們想做一個租書網(wǎng)站,所以就上網(wǎng)瀏覽了許多優(yōu)秀 租書網(wǎng)站和有名的主題網(wǎng)站。
2.設(shè)計主頁。主頁的設(shè)計是整個網(wǎng)站的靈魂,構(gòu)思導(dǎo)航欄的分類,然后是整體規(guī)劃,每一版 塊都有其個性的色彩,清晰明了,便于閱讀瀏覽,我們就構(gòu)思大致分幾部分。首頁、熱門閱讀、傳統(tǒng)閱讀、散文詩歌、國外文學(xué)等等,每一部分又分幾小部分,內(nèi)容比較充分,多樣。確定導(dǎo)航欄的各個分類標(biāo)題之后對于建立二級子網(wǎng)尤為重要。在頁面設(shè)計時,主要考慮整體布局、視覺平衡、頁面尺寸和頁面框架等四個方面的因素。保持網(wǎng)站的整體設(shè)計風(fēng)格統(tǒng)一一致,避免凌亂的思維方式,要做到有步驟、有計劃的設(shè)計和制作。
3.素材的搜集。主頁的導(dǎo)航欄設(shè)計好后,接下來就是對主頁導(dǎo)航欄的各個內(nèi)容進(jìn)行資料的收 集,我采用大量的資料收集再對資料進(jìn)行塞選,得到最適合導(dǎo)航欄內(nèi)容的資料。網(wǎng)頁是否生動、別具特色,還需強調(diào)文本、圖片、flash小動畫或gif動畫的編輯以及聲音和視頻等的處理和加工是否保持相對的一致性。素材的選擇,要符合網(wǎng)站的主題,然后放入站點底下,進(jìn)行圖文的鏈接和排版。
4.實現(xiàn)網(wǎng)頁間的鏈接。做好各個子網(wǎng)和首頁后,接下來就是通過模板的鏈接,將整個網(wǎng)站中 的網(wǎng)頁鏈接起來,過程其實很簡單,主要是把要鏈接的文字和圖標(biāo)選擇在選擇工具欄的鏈接按鈕最后選擇自己要鏈接的網(wǎng)頁單擊確定便可以了。
第四篇:網(wǎng)站規(guī)劃教學(xué)設(shè)計
網(wǎng)站規(guī)劃教學(xué)設(shè)計
一、教學(xué)準(zhǔn)備:
1.選取一些學(xué)生制作的優(yōu)秀網(wǎng)站,以備上課演示時用。2.配置校園網(wǎng)Web服務(wù)器
3.準(zhǔn)備好校園內(nèi)部BBS,為班內(nèi)互評作準(zhǔn)備。
二、教學(xué)目標(biāo):
1.以網(wǎng)站欣賞為主線,介紹網(wǎng)站設(shè)計思想,使學(xué)生初步了解網(wǎng)站設(shè)計的整體構(gòu)思。
2.學(xué)會如何規(guī)劃、構(gòu)思一個網(wǎng)站。
三、教學(xué)重點、難點:網(wǎng)站的整體構(gòu)思
四、教材內(nèi)容分析
本節(jié)課內(nèi)容為高中第二冊第一章第一節(jié)內(nèi)容,它是進(jìn)行網(wǎng)頁制作的前提工作,其重點在于創(chuàng)建網(wǎng)站的幾個步驟,即網(wǎng)站設(shè)計的整體構(gòu)思。在這部分內(nèi)容中,要求動腦思考的內(nèi)容比較多,所以對于本節(jié)課內(nèi)容只在于讓學(xué)生了解網(wǎng)站設(shè)計的完整過程,不能急于求成,暫時只要他們能夠策劃出簡單的網(wǎng)站就可以了。
五、教學(xué)對象分析
本節(jié)課的教學(xué)對象為高一年級第二學(xué)期的學(xué)生。在上學(xué)期,他們已經(jīng)掌握了信息技術(shù)的基礎(chǔ)知識、windows的基本操作、字處理軟件的應(yīng)用,掌握了上網(wǎng)的相關(guān)操作(如:接入Internet、瀏覽網(wǎng)頁,從因特網(wǎng)上獲取信息、收發(fā)電子郵件等等),通過觀察,他們對上網(wǎng)很感興趣。很多學(xué)生曾問我:老師,這些東西是從哪里來的呀?是誰做的呀?怎樣發(fā)布到Internet上的呀?那些動畫是怎么做的呀?等等。由此可見,他們對網(wǎng)站的設(shè)計也一定有興趣、有信心。為了使本節(jié)課內(nèi)容更好的讓學(xué)生吸收,我特提前(上節(jié)課)給他們介紹了FrontPage軟件(包括菜單的介紹、創(chuàng)建站點)。
六、教學(xué)資源及輔助手段、工具:
資源:對一個下載好的優(yōu)秀學(xué)生的網(wǎng)站進(jìn)行分析、講解 網(wǎng)頁制作工具:FrontPage
七、教學(xué)過程:
教師活動
引入
在因特網(wǎng)這個信息的海洋中我們發(fā)現(xiàn)許許多多內(nèi)容豐富、創(chuàng)意新穎、設(shè)計獨特的網(wǎng)站,不知道你見到這樣漂亮可人的網(wǎng)站是否有點心動,你是否也想動手做一個嗎?
提出問題:你們是否找到了適合你口味的網(wǎng)站或特別能打動你的主頁?選擇幾個學(xué)生來說說。
正課
首先打開自己先前做好的網(wǎng)站,一定要做的漂亮,能吸引住學(xué)生的注意力,同時也讓學(xué)生表現(xiàn)出對你的欽佩,對你的崇拜,這樣學(xué)生才有信心跟你學(xué),并且學(xué)好。
問題1:這是一個什么樣的網(wǎng)站?(指內(nèi)容)
問題2:這個網(wǎng)站提供了一些什么功能?
問題3:想不想知道這個網(wǎng)站我花了多少時間完成的嗎?
首先讓學(xué)生猜猜老師花了多少時間完成的。以第三個問題引出了我們今天要講的內(nèi)容,告訴學(xué)生制作一個網(wǎng)站應(yīng)該如何著手,需要分成多少個步驟來完成。首先要確定主題,然后查找資料,最后再動手制作。所以說,制作一個網(wǎng)站是一個長期的工作,而不是一朝一夕之事,只有通過不斷地改進(jìn)、完善才能做出一個成功的網(wǎng)站。
1、做好需求分析
學(xué)生活動
學(xué)生都在說著自己看到的一些優(yōu)秀網(wǎng)站,其中包括內(nèi)容方面、界面方面、設(shè)計風(fēng)格方面等等。
對于親自動手制作一個網(wǎng)站,學(xué)生表現(xiàn)出了很大的興趣,都想一顯身手。
學(xué)生的目光一下子集中到了這個網(wǎng)站上了。
學(xué)生通過觀察,依次回答了老師提出的問題。
學(xué)生都在議論紛紛,有的說2~3天,有的說5~6天,有的說……
在建站之前首先要明確的是建站的目的和網(wǎng)站將要面對的對象,在課堂中做一個簡單的調(diào)查,進(jìn)行歸納總結(jié)。
2、確定網(wǎng)站的主題。
創(chuàng)建網(wǎng)站前要先確定站點的主題,只有主題確定之后才會有目的的去尋找相關(guān)的資料,否則就像一只無頭蒼蠅到處亂竄,所以確定站點的主題是非常重要的,同學(xué)要慎重考慮好。
思考:你們想做一個關(guān)于什么內(nèi)容的網(wǎng)站呢?可以從自身的興趣、特長、愛好出發(fā)來確定站點的主題。
通過這么一個小思考,活躍了課堂的學(xué)生紛紛提出了自己的想法 學(xué)生議論:
有的學(xué)生對散文詩比較感興趣,想做一個關(guān)于散文詩欣賞的網(wǎng)站,有的學(xué)生是追星族,想做一個關(guān)于明星、歌星方面的網(wǎng)站,有的學(xué)生對軍事很感興趣,所以想做一個關(guān)于軍事武器方面的網(wǎng)站,各有氣氛,同時也為今后的工作提前做了準(zhǔn)備。各的想法,可謂包羅萬象。
小結(jié):站點的主題最好是自己擅長或者喜愛的內(nèi)容,這樣制作過程中才不會覺得無聊或力不從心,制作的內(nèi)容才能夠豐富多彩,更能吸引人。
3、確定網(wǎng)站名稱
將學(xué)生根據(jù)主題的選擇的相似,分成小組開展活動。選擇恰當(dāng)?shù)木W(wǎng)站名稱是建
讓學(xué)生不斷地到報刊、網(wǎng)上收設(shè)網(wǎng)站的重要步驟。列出一些讓學(xué)生評價。集資料、圖像、圖標(biāo)等素材,將學(xué)小結(jié):給網(wǎng)站取名就像是給人取名、生收集到的優(yōu)秀的素材放在校園給公司取名一樣,第一要與主題緊密相關(guān),網(wǎng)上供大家使用。第二要有意義,第三要上口、悅耳、易記。此外取名時還要注意你的名稱是否合法、合理、合情。
三、布置任務(wù):
①要根據(jù)自己的情況確定好網(wǎng)站的主題和名稱。
②根據(jù)主題收集一些資料。
第五篇:學(xué)校網(wǎng)站的規(guī)劃與設(shè)計
摘要:做好一個網(wǎng)站,可以全面宣傳,展示學(xué)校風(fēng)采、優(yōu)點與特色,發(fā)布學(xué)校的活動安排等信息內(nèi)容,使學(xué)生及家長增加對學(xué)校的了解,增強學(xué)生、家長與學(xué)校之間的聯(lián)系,在Internet網(wǎng)上,讓學(xué)生及家長及時得到學(xué)校發(fā)布的重要信息,同時也幫助了學(xué)校完成部分教學(xué)事務(wù),提高辦事效率,給學(xué)生、家長與學(xué)校最方便的聯(lián)系橋梁。在這里學(xué)生及家長也可以提出意見及想法,互通教學(xué)之間的意見想法,更加有效的提高教學(xué)質(zhì)量,學(xué)生需要哪樣的教學(xué)方式能夠更好的吸收與接納?這些都能成為學(xué)校的參考,以便更加的提高學(xué)校的辦學(xué)及教學(xué)水平。
關(guān)鍵字: Internet 校園網(wǎng) ASP技術(shù)
Dreamweaver
一、校園網(wǎng)發(fā)展現(xiàn)狀
Internet的迅速發(fā)展,極大地推動了我國的網(wǎng)絡(luò)建設(shè)。我國先后建立了中科院互聯(lián)網(wǎng)(NCFC)、中國教育科研網(wǎng)(CERNET)、中國公用計算機互聯(lián)網(wǎng)(CHINANET)、中國金橋信息網(wǎng)(CH工NAGBN)等四大網(wǎng)絡(luò)。特別是中國教育科研網(wǎng)(CERNET)的發(fā)展,極大地促進(jìn)了學(xué)校校園網(wǎng)的建設(shè)。社會網(wǎng)絡(luò)大環(huán)境的影響、有關(guān)教育部門的支持、校領(lǐng)導(dǎo)的重視以及教師和學(xué)生的積極要求,使得校園網(wǎng)的建設(shè)如魚得水,非常順利。據(jù)統(tǒng)計己經(jīng)建成的校園網(wǎng),其布點范圍從幾百個到幾千個不等,在技術(shù)上是跟得上國際發(fā)展潮流的。校園網(wǎng)的開通,不僅改變了傳統(tǒng)的教學(xué)模式、教學(xué)方法和教學(xué)手段,促進(jìn)了教育觀念和教學(xué)思想的轉(zhuǎn)變,而且拓寬了教師和學(xué)生的視野,有利于培養(yǎng)學(xué)生的創(chuàng)造性思維,提高學(xué)生獲取信息、分析信息、處理信息的能力和適應(yīng)現(xiàn)代社會的能力。校園網(wǎng)的開通,從根本上促進(jìn)了教學(xué)、科研人員之間的信息交流、資源共享、科學(xué)計算和科研合作,成為學(xué)校教育和科研工作最重要的基礎(chǔ)設(shè)施。
中國教育和科研計算機網(wǎng)的建設(shè)直接引導(dǎo)和推動了校園網(wǎng)。截至目前,這一網(wǎng)絡(luò)已經(jīng)通達(dá)內(nèi)地的160個城市,聯(lián)網(wǎng)的教育機構(gòu)和科研單位達(dá)900多個,聯(lián)網(wǎng)主機120萬臺,網(wǎng)絡(luò)用戶800多萬,成為國內(nèi)僅次于中國電信的第二大互聯(lián)網(wǎng)絡(luò)。中國教育和科研計算機網(wǎng)己經(jīng)成為世界上最龐大的‘校園網(wǎng)’。
在這樣的一個背景下,我校本著從實際出發(fā)、節(jié)省的原則,在條件具備的前提下,決定組建校園網(wǎng)絡(luò),與Internet互連,并自行建立自己的校園網(wǎng)站(http://004km.cn)為滿足我校日益增長的辦學(xué)、科研、培訓(xùn)的需要。
二、規(guī)劃原則
經(jīng)過一學(xué)期的準(zhǔn)備,本著以學(xué)校教育教學(xué)需求為前提,講究方便、實用和易管的原則,現(xiàn)初步將學(xué)校網(wǎng)站欄目做如下規(guī)劃和設(shè)置:
(一)首頁規(guī)劃
網(wǎng)站首頁,就是用戶進(jìn)入網(wǎng)站看到的第一個網(wǎng)頁。首頁是網(wǎng)站的門面,首頁制作質(zhì)量直接影響到用戶對網(wǎng)站的整個印象。一般首頁制作占整個制作時間的30%左右,所以在首頁制作時要多花些功夫。按照網(wǎng)頁設(shè)計的版塊、字體和色彩搭配方案對首頁進(jìn)行“精雕細(xì)刻”。使首頁達(dá)到簡潔明快的風(fēng)格,簡單的表格,令人愉快的色彩搭配,協(xié)調(diào)的文字,瀏覽速度快,易于導(dǎo)航,經(jīng)常保持新鮮感,使訪問者賞心悅目。網(wǎng)站主頁采用靜、動互相結(jié)合的方式,即靜態(tài)的主畫面和動態(tài)的圖片相結(jié)合,體現(xiàn)學(xué)校的勃勃生氣,靜態(tài)主頁方式介紹學(xué)校風(fēng)采、優(yōu)點特色、信息發(fā)布,對于新聞留言等,就得利用ASP與數(shù)據(jù)庫結(jié)合的技術(shù)建立數(shù)據(jù)庫查詢管理系統(tǒng),采用交互式的動態(tài)的web畫面來實現(xiàn)。
(1)、首頁內(nèi)容模塊。
首頁分模塊進(jìn)行制作,一般的站點有這樣一些內(nèi)容模塊:站點名稱、動態(tài)廣告條、主菜單、新聞、校長寄語、網(wǎng)站導(dǎo)航、校園公告、友情鏈接等。首頁選擇哪些模塊,實現(xiàn)哪些功能,是否需要添加其它模塊,這都根據(jù)學(xué)校網(wǎng)站主題和內(nèi)容來確定。內(nèi)容模塊確定后,按照首頁設(shè)計的版面,發(fā)揮網(wǎng)頁制作人員的創(chuàng)意和想象力,制作出比較滿意的網(wǎng)頁。
(2)根據(jù)上面的設(shè)計思想進(jìn)行分析,按照系統(tǒng)開發(fā)的基本觀點對網(wǎng)站進(jìn)行分解,從內(nèi)容上可對網(wǎng)站作如下劃分:
學(xué)校概況:包括學(xué)校概況、學(xué)校榮譽、領(lǐng)導(dǎo)風(fēng)采、校園快訊以及部分圖片
等內(nèi)容。
教學(xué)動態(tài):包括學(xué)期計劃、考試信息、教研動態(tài)、實驗安排、教學(xué)總結(jié)等
子項欄目。
教學(xué)資源:包括教學(xué)研究、教學(xué)論文、教學(xué)課件、經(jīng)驗交流等子項欄目。
教師之窗:包括教工生活、教師主頁、教師風(fēng)采、教育信息、教研組信息
等子項。
學(xué)校天地:包括校園生活、校園之星、學(xué)生風(fēng)采、學(xué)生作品、學(xué)習(xí)交流等
子項。網(wǎng)絡(luò)德育:包括規(guī)章制度、德育科研、心理輔導(dǎo)、社會活動、教育法規(guī)、學(xué)生評語、住校生管理、國旗下講話等子項。
衛(wèi)生保健:包括送你健康、生活保健、生活急救、健康課程、心理茶室等欄目。
電腦學(xué)堂:包括新手學(xué)堂、軟件應(yīng)用、硬件知識、網(wǎng)頁制作、軟件下載等
欄目。
校園留言:通過留言板與學(xué)生家長聯(lián)系,有利于家校溝通,意見互換。
三、開發(fā)工具的選用及介紹
Active Server Pages:“動態(tài)服務(wù)器網(wǎng)頁”,一般簡稱為“ASP”,ASP之所以能受到大家的重視與使用的原因,主要在于所產(chǎn)生的執(zhí)行結(jié)果都是標(biāo)準(zhǔn)的HTML格式,而且這些程序是在網(wǎng)絡(luò)服務(wù)端中執(zhí)行,使用一般的瀏覽器(如IE 或Netscape)都可以正確地獲得ASP的“執(zhí)行”結(jié)果,并且將這ASP執(zhí)行的結(jié)果直接在瀏覽器中“瀏覽”,不像VBScript或 JavaScript是在客戶端(Client)的瀏覽器上執(zhí)行,若使用VBScript來設(shè)計程序,客戶端(Client)在IE瀏覽器中可以顯示程序執(zhí)行的結(jié)果,可是,客戶端(Client)若使用Netscape瀏覽器就無法顯示VBScript的執(zhí)行結(jié)果。
常用的一般代碼編輯程序,如Windows記事本,就可以編輯。當(dāng)然,其他網(wǎng)頁發(fā)展工具,例如,F(xiàn)rontPage Express、FrontPage、Dreamweaver等也都可以;不過還是建議你用記事本來編寫,既省時又方便,調(diào)試可選用Dreamweaver等可視編輯軟件。當(dāng)然你若全是靜態(tài)頁面??刹挥胊sp動態(tài)服務(wù)器技術(shù)。而我校編寫的網(wǎng)頁功能較多,所以我選擇了ASP結(jié)合Dreamweaver組建了本網(wǎng)站。
四、制作技巧
(一)版面設(shè)計
版面設(shè)計是整個網(wǎng)站構(gòu)思過程中最重要的一部分,因為好的版面布局給瀏覽者不但會留下好的第一印象,而且還會帶來一個好的心情。學(xué)校站點的版面設(shè)計可以是明快、亮麗型;可以是古樸、大方型;可以是凝重、整齊型等。
就像傳統(tǒng)的報刊雜志編輯一樣,可以將網(wǎng)頁看作一張報紙、一本雜志來進(jìn)行排版布局。雖然動態(tài)網(wǎng)頁技術(shù)飛速發(fā)展,但是靜態(tài)的網(wǎng)頁版面設(shè)計基礎(chǔ)依然是必須學(xué)習(xí)和掌握的。它們的基本原理是共通的,領(lǐng)會要點,便可舉一反三,觸類旁通。
(1)創(chuàng)意草案
草案的形成決定著將來網(wǎng)頁的基本面貌,類似一個設(shè)計創(chuàng)意。它往往來自于一些現(xiàn)有設(shè)計作品、圖形圖像素材的組合、改造、加工。其思維方式有兩種:借鑒模仿和逆向重組。
構(gòu)思伊始,設(shè)計者可能會受現(xiàn)存的一些網(wǎng)頁設(shè)計的影響,借鑒現(xiàn)有的設(shè)計樣式是很自然的事,但不能照抄照搬。吸取成功作品中的一些視覺元素及其組合方式,加入自己的新元素,形成新的組合,這種借鑒模仿可以比較順利地產(chǎn)生網(wǎng)頁方案的雛形。逆向重組是利用反向思維來完成設(shè)計和創(chuàng)作,把現(xiàn)有作品的視覺元素的性質(zhì)加以改變、重組,與自己的素材結(jié)合而產(chǎn)生新的設(shè)計作品。比如,原有作品的背景色是黑色的,你把它改成白色,就會變成另外一個樣子。也就是說將某一視覺元素中的某一描述參數(shù)加以改變,從而實現(xiàn)新的設(shè)計作品。
由此可見,設(shè)計者的工作很像作曲家創(chuàng)作音樂作品,需要從民間音樂中尋找素材,把一首歌謠創(chuàng)作成一首樂曲,把單獨的樂曲發(fā)展成一個樂章。應(yīng)該說明的是,借鑒模仿和逆向重組都是對視覺元素的量的改變,至于變化到什么程度,需要有專業(yè)的眼光、素養(yǎng)才能把握住。你可以用一張白紙和一支鉛筆,把你最初的創(chuàng)意畫出來。這屬于創(chuàng)造階段,不講究細(xì)膩工整,不必考慮細(xì)節(jié),只以粗陋的線條勾畫出創(chuàng)意的輪廓即可。盡你的可能多畫幾張,最后選定一個滿意的作為繼續(xù)創(chuàng)作的腳本。
(2)粗略布局
在草案的基礎(chǔ)上,將你確定需要放置的功能模塊安排到頁面上。功能模塊我們在前面已提過,主要包含學(xué)校標(biāo)志、主菜單、新聞、校長寄語、網(wǎng)站導(dǎo)航、校園公告、友情鏈接等。注意,這里我們必須遵循突出重點、平衡協(xié)調(diào)的原則,將學(xué)校標(biāo)志、主菜單等最重要的模塊放在最顯眼、最突出的位置,然后再考慮次要模塊的排放。
(3)最后定案
將粗略布局精細(xì)化、具體化。在布局過程中,我們可以遵循的原則有: ①平衡:指畫面的圖像文字的視覺效果在左右、上下幾個方位基本相等,分布勻稱。
②呼應(yīng):在不平衡的布局中的補救措施,使一種元素同時出現(xiàn)在不同的地方,形成相互的聯(lián)系。
③對比:利用不同的色彩、線條等視覺元素相互映襯,造成畫面的多種變化,達(dá)到豐富視覺的效果。
④疏密:疏,是指畫面中元素稀少(甚至空白)的部分;密,是指畫面中元素繁多的部分,在網(wǎng)頁設(shè)計中就是空白的處理運用,太滿、太密、太平均是任何版式設(shè)計的大忌,適當(dāng)?shù)氖杳艽钆淇梢允巩嬅娈a(chǎn)生節(jié)奏感,體現(xiàn)出網(wǎng)站的格調(diào)與品位。
以上的設(shè)計原則,雖然枯燥,但是如果能運用到頁面布局里,效果就大不一樣了。比如,網(wǎng)頁的白色背景太虛,則可以加些色塊;版面零散,可以用線條和符號串聯(lián);左面文字過多,右面則可以插一張圖片保持平衡;經(jīng)過不斷的嘗試和推敲,一個嶄新的設(shè)計方案便完成了。若你的美學(xué)差一點,也可請個美學(xué)好點的老師幫助你。
(二)圖文及頁面的制作
網(wǎng)頁制作要圖文并茂,很多文字性的內(nèi)容如標(biāo)題、主菜單欄目名都可以處理成圖像形式,這不但克服了不同平臺上的文字兼容性問題,而且頁面也顯得非常美觀、精制,引人入勝,對訪問者有較強的吸引力。
文字處理方法和Word 相同,在這里就不再多述。圖片可以通過掃描儀或數(shù)碼相機獲得,再復(fù)制到網(wǎng)頁上直接使用,也可以將圖片經(jīng)過Photoshop 或Fireworks藝術(shù)加工后再使用。動畫可以自己動手用Flash 制作,也可以在互聯(lián)網(wǎng)的動畫寶庫中下載。當(dāng)然使用的前提是要和自己做的色調(diào)一樣。
制作時應(yīng)該注意:為了使頁面瀏覽下載速度快,就要盡可能地減少頁面的數(shù)據(jù)量,減少圖像和動畫的數(shù)量,特別是大的圖像和動畫;盡量減少表格嵌套,不要把所有的內(nèi)容都放在一個大表格里;頁面保存必須在根目錄下各建和頁面名稱相同的文件夾,以存放每一頁的圖片等網(wǎng)頁素材,這也方便了我們以后的管理和維護(hù)。
子頁的制作,其方法和首頁制作相同,都要遵循首頁制作一些規(guī)則。在制作一級子頁時,首先要考慮子頁的個數(shù)和每個子頁的名稱,然后將制作好的首頁分別另存為每個一級子頁的名稱,把它們作為新建的一級子頁面,這樣,一級子頁面的標(biāo)題和導(dǎo)航以及版面信息就設(shè)置完畢。只需要在相應(yīng)的子頁面里修改相應(yīng)的內(nèi)容即可,從而大大地提高了子頁面的制作速度。一級子頁頁面的顯示盡量采用新建窗口的形式,這使用戶在等待頁面下載的同時還可以繼續(xù)瀏覽其它內(nèi)容。
在網(wǎng)頁制作方面還有許多技術(shù)細(xì)節(jié),諸如如何適應(yīng)不同的瀏覽器,在不同的分辨率下保持網(wǎng)頁不變形,如何減少垃圾代碼等等。首頁相比其它頁面來說,技術(shù)上要求更加嚴(yán)格,決不能出錯?,F(xiàn)在有不少網(wǎng)站教學(xué)類的網(wǎng)站,如:網(wǎng)頁教學(xué)網(wǎng)(http://004km.cn)可多多參考,不斷提升自己的制作水平。
五、網(wǎng)頁(站)的調(diào)試 一切前期工作做好后,我們要做的事就是要調(diào)試網(wǎng)頁,看看有沒有做的不理想,不成功的地方,網(wǎng)頁的調(diào)試,我們經(jīng)常使用的方法有多種,如直接本機預(yù)覽、在網(wǎng)絡(luò)上應(yīng)用網(wǎng)頁代碼調(diào)試器在線預(yù)覽(http://www.tool.la/WebDebugger)、安裝iis服務(wù)器組件調(diào)試?,F(xiàn)為大家介紹其中兩種我們經(jīng)常用的方法。
(一)本機直接預(yù)覽
本機直接預(yù)覽就是在制作時直接按預(yù)覽按扭。如在Dreamweaver中,選擇“文件”→“在瀏覽器中預(yù)覽” →“iexplore”即可。或直接按快捷鍵“F12”亦可。還可在根目錄中找到想要預(yù)覽的htm文件,雙擊就可預(yù)覽。
(二)安裝iis服務(wù)器組件調(diào)試
IIS(Internet Information Server,互聯(lián)網(wǎng)信息服務(wù))是一種Web(網(wǎng)頁)服務(wù)組件,其中包括Web服務(wù)器、FTP服務(wù)器、NNTP服務(wù)器和SMTP服務(wù)器,分別用于網(wǎng)頁瀏覽、文件傳輸、新聞服務(wù)和郵件發(fā)送等方面,它使得在網(wǎng)絡(luò)(包括互聯(lián)網(wǎng)和局域網(wǎng))上發(fā)布信息成了一件很容易的事。
IIS組件的添加我們在此不再贅述,安裝好iis后,點擊“開始”→“程序” →“管理工具” →“Internet信息服務(wù)”,選擇“默認(rèn)網(wǎng)站”右擊,選擇“屬性”修改主目錄。轉(zhuǎn)到“主目錄”窗口,再在“本地路徑”輸入(或用“瀏覽”按鈕選擇)好自己網(wǎng)頁所在的“D:Wyweb”目錄。若是動態(tài)首頁要自行添加首頁文件名:轉(zhuǎn)到“文檔”窗口,再按“添加”按鈕,根據(jù)提示在“默認(rèn)文檔名”后添加自己網(wǎng)頁的首頁文件名“index.asp”。否則無法預(yù)覽。
安裝好后,我們打開IE瀏覽器,在地址欄輸入http://127.0.0.1或http:// localhost之后再按回車鍵,此時就能夠調(diào)出你自己網(wǎng)頁的首頁,則說明設(shè)置成功!這時便可像在Internet上一樣訪問自己的頁面。若有想要修改的地方,找到相應(yīng)的htm文件名重新修改即可,直到滿意為至。
總之,做好一個網(wǎng)站,可以全面宣傳,展示學(xué)校風(fēng)采、優(yōu)點與特色,發(fā)布學(xué)校的活動安排等信息內(nèi)容,使學(xué)生及家長增加對學(xué)校的了解,增強學(xué)生、家長與學(xué)校之間的聯(lián)系,在Internet網(wǎng)上,讓學(xué)生及家長及時得到學(xué)校發(fā)布的重要信息,同時也幫助了學(xué)校完成部分教學(xué)事務(wù),提高辦事效率,給學(xué)生、家長與學(xué)校最方便的聯(lián)系橋梁。在這里學(xué)生及家長也可以提出意見及想法,互通教學(xué)之間的意見想法,更加有效的提高教學(xué)質(zhì)量,學(xué)生需要哪樣的教學(xué)方式能夠更好的吸收與接納?這些都能成為學(xué)校的參考,以便更加的提高學(xué)校的辦學(xué)及教學(xué)水平。