第一篇：《體驗網站規劃與設計》教學反思

《體驗網站規劃與設計》教學反思

《體驗網站規劃與設計》教學反思

今天上午，我在高二（1）班上了一節公開課，上課的內容是《體驗網站規劃與設計》。整個教學過程以師生訪問分析網站為主線，采取分組討論、小組活動進行。教學中以任務驅動、自主學習，交流學習以及引領展示的模式，將規劃過程分解為幾個任務，根據所學知識，完成對網站規劃選題、域名、欄目及藝術風格的規劃與設計進行學習，并將各小組任務完成的情況以學案—《網站規劃與設計方案》的形式呈現出來。通過展示學生設計方案，對學生成果給予評價與肯定，激發學生進一步學習的興趣，培養學生主動思考、積極參加團結協作。

成功之處，本節課教學環節完整，對三維目標把握較好，同時認真的對學情進行了分析。本節課，對學高二火箭班的學生，我注重了學生發散性思維、語言表達能力、邏輯推理思維的培養，同時引導學生學會鑒賞、學生聆聽、學會尊重，學生在較短的時間內能夠很好的完成教學各環節的實踐，最終形成了完成的方案，且能很好的陳述。

不足之處，本節課，整個教學過程都是需要網絡支撐，由于網絡突然出現問題，而心中又想達到理想的課堂，希望給學生一個完整的教學過程，導致課堂的暫時中斷，而此后壓縮了學生討論和展示成果的一些時間，后面的教學時間和節奏略顯蒼促，課堂小節也不是很到位。

經驗總結：在教學過程中，我也考慮到網絡和電的問題，但是心向往對課堂存理想化狀態，實際上不然，不想發現的事終究發生了，以此，不管是哪種級別的公開課，都要著兩種備案才可，以免出現課堂教學事故而讓自己陷入囧境。

第二篇：《規劃設計網站》教學設計

八年級下冊

八年級下冊

八年級下冊

八年級下冊

八年級下冊

第三篇：網站規劃與設計心得

第一次接觸網站規劃與設計，而且是自己參與設計一個網站，所以非常興奮，從前期網站主題的確定與相關內容的分析到網站的設計，每個隊員都在積極努力，出謀劃策，每個人都在經歷一場頭腦風暴。

1.確定主題。制作網站首先確定主題，我們想做一個租書網站，所以就上網瀏覽了許多優秀 租書網站和有名的主題網站。

2.設計主頁。主頁的設計是整個網站的靈魂，構思導航欄的分類，然后是整體規劃，每一版 塊都有其個性的色彩，清晰明了，便于閱讀瀏覽，我們就構思大致分幾部分。首頁、熱門閱讀、傳統閱讀、散文詩歌、國外文學等等，每一部分又分幾小部分，內容比較充分，多樣。確定導航欄的各個分類標題之后對于建立二級子網尤為重要。在頁面設計時，主要考慮整體布局、視覺平衡、頁面尺寸和頁面框架等四個方面的因素。保持網站的整體設計風格統一一致，避免凌亂的思維方式，要做到有步驟、有計劃的設計和制作。

3.素材的搜集。主頁的導航欄設計好后，接下來就是對主頁導航欄的各個內容進行資料的收 集，我采用大量的資料收集再對資料進行塞選，得到最適合導航欄內容的資料。網頁是否生動、別具特色，還需強調文本、圖片、flash小動畫或gif動畫的編輯以及聲音和視頻等的處理和加工是否保持相對的一致性。素材的選擇，要符合網站的主題，然后放入站點底下，進行圖文的鏈接和排版。

4.實現網頁間的鏈接。做好各個子網和首頁后，接下來就是通過模板的鏈接，將整個網站中 的網頁鏈接起來，過程其實很簡單，主要是把要鏈接的文字和圖標選擇在選擇工具欄的鏈接按鈕最后選擇自己要鏈接的網頁單擊確定便可以了。

第四篇：網站規劃教學設計

網站規劃教學設計

一、教學準備：

1．選取一些學生制作的優秀網站，以備上課演示時用。2．配置校園網Web服務器

3．準備好校園內部BBS，為班內互評作準備。

二、教學目標：

1．以網站欣賞為主線，介紹網站設計思想,使學生初步了解網站設計的整體構思。

2．學會如何規劃、構思一個網站。

三、教學重點、難點：網站的整體構思

四、教材內容分析

本節課內容為高中第二冊第一章第一節內容，它是進行網頁制作的前提工作，其重點在于創建網站的幾個步驟，即網站設計的整體構思。在這部分內容中，要求動腦思考的內容比較多，所以對于本節課內容只在于讓學生了解網站設計的完整過程，不能急于求成，暫時只要他們能夠策劃出簡單的網站就可以了。

五、教學對象分析

本節課的教學對象為高一年級第二學期的學生。在上學期，他們已經掌握了信息技術的基礎知識、windows的基本操作、字處理軟件的應用，掌握了上網的相關操作（如：接入Internet、瀏覽網頁，從因特網上獲取信息、收發電子郵件等等），通過觀察，他們對上網很感興趣。很多學生曾問我：老師，這些東西是從哪里來的呀？是誰做的呀？怎樣發布到Internet上的呀？那些動畫是怎么做的呀？等等。由此可見，他們對網站的設計也一定有興趣、有信心。為了使本節課內容更好的讓學生吸收，我特提前（上節課）給他們介紹了FrontPage軟件（包括菜單的介紹、創建站點）。

六、教學資源及輔助手段、工具：

資源：對一個下載好的優秀學生的網站進行分析、講解 網頁制作工具：FrontPage

七、教學過程：

教師活動

引入

在因特網這個信息的海洋中我們發現許許多多內容豐富、創意新穎、設計獨特的網站，不知道你見到這樣漂亮可人的網站是否有點心動，你是否也想動手做一個嗎？

提出問題：你們是否找到了適合你口味的網站或特別能打動你的主頁？選擇幾個學生來說說。

正課

首先打開自己先前做好的網站，一定要做的漂亮，能吸引住學生的注意力，同時也讓學生表現出對你的欽佩，對你的崇拜，這樣學生才有信心跟你學，并且學好。

問題1：這是一個什么樣的網站？（指內容）

問題2：這個網站提供了一些什么功能？

問題3：想不想知道這個網站我花了多少時間完成的嗎？

首先讓學生猜猜老師花了多少時間完成的。以第三個問題引出了我們今天要講的內容，告訴學生制作一個網站應該如何著手，需要分成多少個步驟來完成。首先要確定主題，然后查找資料，最后再動手制作。所以說，制作一個網站是一個長期的工作，而不是一朝一夕之事，只有通過不斷地改進、完善才能做出一個成功的網站。

1、做好需求分析

學生活動

學生都在說著自己看到的一些優秀網站，其中包括內容方面、界面方面、設計風格方面等等。

對于親自動手制作一個網站，學生表現出了很大的興趣，都想一顯身手。

學生的目光一下子集中到了這個網站上了。

學生通過觀察，依次回答了老師提出的問題。

學生都在議論紛紛，有的說2~3天，有的說5~6天，有的說……

在建站之前首先要明確的是建站的目的和網站將要面對的對象，在課堂中做一個簡單的調查，進行歸納總結。

2、確定網站的主題。

創建網站前要先確定站點的主題，只有主題確定之后才會有目的的去尋找相關的資料，否則就像一只無頭蒼蠅到處亂竄，所以確定站點的主題是非常重要的，同學要慎重考慮好。

思考：你們想做一個關于什么內容的網站呢？可以從自身的興趣、特長、愛好出發來確定站點的主題。

通過這么一個小思考，活躍了課堂的學生紛紛提出了自己的想法 學生議論：

有的學生對散文詩比較感興趣，想做一個關于散文詩欣賞的網站，有的學生是追星族，想做一個關于明星、歌星方面的網站，有的學生對軍事很感興趣，所以想做一個關于軍事武器方面的網站，各有氣氛，同時也為今后的工作提前做了準備。各的想法，可謂包羅萬象。

小結：站點的主題最好是自己擅長或者喜愛的內容，這樣制作過程中才不會覺得無聊或力不從心，制作的內容才能夠豐富多彩，更能吸引人。

3、確定網站名稱

將學生根據主題的選擇的相似，分成小組開展活動。選擇恰當的網站名稱是建

讓學生不斷地到報刊、網上收設網站的重要步驟。列出一些讓學生評價。集資料、圖像、圖標等素材，將學小結：給網站取名就像是給人取名、生收集到的優秀的素材放在校園給公司取名一樣，第一要與主題緊密相關，網上供大家使用。第二要有意義，第三要上口、悅耳、易記。此外取名時還要注意你的名稱是否合法、合理、合情。

三、布置任務：

①要根據自己的情況確定好網站的主題和名稱。

②根據主題收集一些資料。

第五篇：學校網站的規劃與設計

摘要：做好一個網站，可以全面宣傳，展示學校風采、優點與特色，發布學校的活動安排等信息內容，使學生及家長增加對學校的了解，增強學生、家長與學校之間的聯系，在Internet網上，讓學生及家長及時得到學校發布的重要信息，同時也幫助了學校完成部分教學事務，提高辦事效率,給學生、家長與學校最方便的聯系橋梁。在這里學生及家長也可以提出意見及想法，互通教學之間的意見想法，更加有效的提高教學質量，學生需要哪樣的教學方式能夠更好的吸收與接納？這些都能成為學校的參考，以便更加的提高學校的辦學及教學水平。

關鍵字： Internet 校園網 ASP技術

Dreamweaver

一、校園網發展現狀

Internet的迅速發展，極大地推動了我國的網絡建設。我國先后建立了中科院互聯網(NCFC)、中國教育科研網(CERNET)、中國公用計算機互聯網(CHINANET)、中國金橋信息網(CH工NAGBN)等四大網絡。特別是中國教育科研網(CERNET)的發展，極大地促進了學校校園網的建設。社會網絡大環境的影響、有關教育部門的支持、校領導的重視以及教師和學生的積極要求，使得校園網的建設如魚得水，非常順利。據統計己經建成的校園網，其布點范圍從幾百個到幾千個不等，在技術上是跟得上國際發展潮流的。校園網的開通，不僅改變了傳統的教學模式、教學方法和教學手段，促進了教育觀念和教學思想的轉變，而且拓寬了教師和學生的視野，有利于培養學生的創造性思維，提高學生獲取信息、分析信息、處理信息的能力和適應現代社會的能力。校園網的開通，從根本上促進了教學、科研人員之間的信息交流、資源共享、科學計算和科研合作，成為學校教育和科研工作最重要的基礎設施。

中國教育和科研計算機網的建設直接引導和推動了校園網。截至目前，這一網絡已經通達內地的160個城市，聯網的教育機構和科研單位達900多個，聯網主機120萬臺，網絡用戶800多萬，成為國內僅次于中國電信的第二大互聯網絡。中國教育和科研計算機網己經成為世界上最龐大的‘校園網’。

在這樣的一個背景下，我校本著從實際出發、節省的原則，在條件具備的前提下，決定組建校園網絡，與Internet互連，并自行建立自己的校園網站（http://www.tmdps.cn）為滿足我校日益增長的辦學、科研、培訓的需要。

二、規劃原則

經過一學期的準備，本著以學校教育教學需求為前提，講究方便、實用和易管的原則，現初步將學校網站欄目做如下規劃和設置：

（一）首頁規劃

網站首頁，就是用戶進入網站看到的第一個網頁。首頁是網站的門面，首頁制作質量直接影響到用戶對網站的整個印象。一般首頁制作占整個制作時間的30%左右，所以在首頁制作時要多花些功夫。按照網頁設計的版塊、字體和色彩搭配方案對首頁進行“精雕細刻”。使首頁達到簡潔明快的風格，簡單的表格，令人愉快的色彩搭配，協調的文字，瀏覽速度快，易于導航，經常保持新鮮感，使訪問者賞心悅目。網站主頁采用靜、動互相結合的方式，即靜態的主畫面和動態的圖片相結合，體現學校的勃勃生氣，靜態主頁方式介紹學校風采、優點特色、信息發布，對于新聞留言等，就得利用ＡＳＰ與數據庫結合的技術建立數據庫查詢管理系統，采用交互式的動態的web畫面來實現。

（1）、首頁內容模塊。

首頁分模塊進行制作，一般的站點有這樣一些內容模塊：站點名稱、動態廣告條、主菜單、新聞、校長寄語、網站導航、校園公告、友情鏈接等。首頁選擇哪些模塊，實現哪些功能，是否需要添加其它模塊，這都根據學校網站主題和內容來確定。內容模塊確定后，按照首頁設計的版面，發揮網頁制作人員的創意和想象力，制作出比較滿意的網頁。

（2）根據上面的設計思想進行分析，按照系統開發的基本觀點對網站進行分解，從內容上可對網站作如下劃分：

學校概況：包括學校概況、學校榮譽、領導風采、校園快訊以及部分圖片

等內容。

教學動態：包括學期計劃、考試信息、教研動態、實驗安排、教學總結等

子項欄目。

教學資源：包括教學研究、教學論文、教學課件、經驗交流等子項欄目。

教師之窗：包括教工生活、教師主頁、教師風采、教育信息、教研組信息

等子項。

學校天地：包括校園生活、校園之星、學生風采、學生作品、學習交流等

子項。網絡德育：包括規章制度、德育科研、心理輔導、社會活動、教育法規、學生評語、住校生管理、國旗下講話等子項。

衛生保健：包括送你健康、生活保健、生活急救、健康課程、心理茶室等欄目。

電腦學堂：包括新手學堂、軟件應用、硬件知識、網頁制作、軟件下載等

欄目。

校園留言：通過留言板與學生家長聯系，有利于家校溝通，意見互換。

三、開發工具的選用及介紹

Active Server Pages：“動態服務器網頁”，一般簡稱為“ASP”，ASP之所以能受到大家的重視與使用的原因，主要在于所產生的執行結果都是標準的HTML格式，而且這些程序是在網絡服務端中執行，使用一般的瀏覽器（如IE 或Netscape）都可以正確地獲得ASP的“執行”結果，并且將這ASP執行的結果直接在瀏覽器中“瀏覽”，不像VBScript或 JavaScript是在客戶端（Client）的瀏覽器上執行，若使用VBScript來設計程序，客戶端（Ｃlient）在ＩＥ瀏覽器中可以顯示程序執行的結果，可是，客戶端（Ｃlient）若使用Netscape瀏覽器就無法顯示VBScript的執行結果。

常用的一般代碼編輯程序，如Windows記事本，就可以編輯。當然，其他網頁發展工具，例如，FrontPage Express、ＦrontPage、Dreamweaver等也都可以；不過還是建議你用記事本來編寫，既省時又方便，調試可選用Dreamweaver等可視編輯軟件。當然你若全是靜態頁面。可不用asp動態服務器技術。而我校編寫的網頁功能較多，所以我選擇了ASP結合Dreamweaver組建了本網站。

四、制作技巧

（一）版面設計

版面設計是整個網站構思過程中最重要的一部分，因為好的版面布局給瀏覽者不但會留下好的第一印象，而且還會帶來一個好的心情。學校站點的版面設計可以是明快、亮麗型；可以是古樸、大方型；可以是凝重、整齊型等。

就像傳統的報刊雜志編輯一樣，可以將網頁看作一張報紙、一本雜志來進行排版布局。雖然動態網頁技術飛速發展，但是靜態的網頁版面設計基礎依然是必須學習和掌握的。它們的基本原理是共通的，領會要點，便可舉一反三，觸類旁通。

（1）創意草案

草案的形成決定著將來網頁的基本面貌，類似一個設計創意。它往往來自于一些現有設計作品、圖形圖像素材的組合、改造、加工。其思維方式有兩種：借鑒模仿和逆向重組。

構思伊始，設計者可能會受現存的一些網頁設計的影響，借鑒現有的設計樣式是很自然的事，但不能照抄照搬。吸取成功作品中的一些視覺元素及其組合方式，加入自己的新元素，形成新的組合，這種借鑒模仿可以比較順利地產生網頁方案的雛形。逆向重組是利用反向思維來完成設計和創作，把現有作品的視覺元素的性質加以改變、重組，與自己的素材結合而產生新的設計作品。比如，原有作品的背景色是黑色的，你把它改成白色，就會變成另外一個樣子。也就是說將某一視覺元素中的某一描述參數加以改變，從而實現新的設計作品。

由此可見，設計者的工作很像作曲家創作音樂作品，需要從民間音樂中尋找素材，把一首歌謠創作成一首樂曲，把單獨的樂曲發展成一個樂章。應該說明的是，借鑒模仿和逆向重組都是對視覺元素的量的改變，至于變化到什么程度，需要有專業的眼光、素養才能把握住。你可以用一張白紙和一支鉛筆，把你最初的創意畫出來。這屬于創造階段，不講究細膩工整，不必考慮細節，只以粗陋的線條勾畫出創意的輪廓即可。盡你的可能多畫幾張，最后選定一個滿意的作為繼續創作的腳本。

（2）粗略布局

在草案的基礎上，將你確定需要放置的功能模塊安排到頁面上。功能模塊我們在前面已提過，主要包含學校標志、主菜單、新聞、校長寄語、網站導航、校園公告、友情鏈接等。注意，這里我們必須遵循突出重點、平衡協調的原則，將學校標志、主菜單等最重要的模塊放在最顯眼、最突出的位置，然后再考慮次要模塊的排放。

（3）最后定案

將粗略布局精細化、具體化。在布局過程中，我們可以遵循的原則有： ①平衡：指畫面的圖像文字的視覺效果在左右、上下幾個方位基本相等，分布勻稱。

②呼應：在不平衡的布局中的補救措施，使一種元素同時出現在不同的地方，形成相互的聯系。

③對比：利用不同的色彩、線條等視覺元素相互映襯，造成畫面的多種變化，達到豐富視覺的效果。

④疏密：疏，是指畫面中元素稀少(甚至空白)的部分；密，是指畫面中元素繁多的部分，在網頁設計中就是空白的處理運用，太滿、太密、太平均是任何版式設計的大忌，適當的疏密搭配可以使畫面產生節奏感，體現出網站的格調與品位。

以上的設計原則，雖然枯燥，但是如果能運用到頁面布局里，效果就大不一樣了。比如，網頁的白色背景太虛，則可以加些色塊；版面零散，可以用線條和符號串聯；左面文字過多，右面則可以插一張圖片保持平衡；經過不斷的嘗試和推敲，一個嶄新的設計方案便完成了。若你的美學差一點，也可請個美學好點的老師幫助你。

（二）圖文及頁面的制作

網頁制作要圖文并茂，很多文字性的內容如標題、主菜單欄目名都可以處理成圖像形式，這不但克服了不同平臺上的文字兼容性問題，而且頁面也顯得非常美觀、精制，引人入勝，對訪問者有較強的吸引力。

文字處理方法和Word 相同,在這里就不再多述。圖片可以通過掃描儀或數碼相機獲得，再復制到網頁上直接使用，也可以將圖片經過Photoshop 或Fireworks藝術加工后再使用。動畫可以自己動手用Flash 制作，也可以在互聯網的動畫寶庫中下載。當然使用的前提是要和自己做的色調一樣。

制作時應該注意：為了使頁面瀏覽下載速度快，就要盡可能地減少頁面的數據量，減少圖像和動畫的數量，特別是大的圖像和動畫；盡量減少表格嵌套，不要把所有的內容都放在一個大表格里；頁面保存必須在根目錄下各建和頁面名稱相同的文件夾，以存放每一頁的圖片等網頁素材，這也方便了我們以后的管理和維護。

子頁的制作，其方法和首頁制作相同，都要遵循首頁制作一些規則。在制作一級子頁時，首先要考慮子頁的個數和每個子頁的名稱，然后將制作好的首頁分別另存為每個一級子頁的名稱，把它們作為新建的一級子頁面，這樣，一級子頁面的標題和導航以及版面信息就設置完畢。只需要在相應的子頁面里修改相應的內容即可，從而大大地提高了子頁面的制作速度。一級子頁頁面的顯示盡量采用新建窗口的形式，這使用戶在等待頁面下載的同時還可以繼續瀏覽其它內容。

在網頁制作方面還有許多技術細節，諸如如何適應不同的瀏覽器，在不同的分辨率下保持網頁不變形，如何減少垃圾代碼等等。首頁相比其它頁面來說，技術上要求更加嚴格，決不能出錯。現在有不少網站教學類的網站，如：網頁教學網（http://www.tmdps.cn）可多多參考，不斷提升自己的制作水平。

五、網頁（站）的調試 一切前期工作做好后，我們要做的事就是要調試網頁，看看有沒有做的不理想，不成功的地方，網頁的調試，我們經常使用的方法有多種，如直接本機預覽、在網絡上應用網頁代碼調試器在線預覽（http://www.tool.la/WebDebugger）、安裝iis服務器組件調試。現為大家介紹其中兩種我們經常用的方法。

（一）本機直接預覽

本機直接預覽就是在制作時直接按預覽按扭。如在Dreamweaver中，選擇“文件”→“在瀏覽器中預覽” →“iexplore”即可。或直接按快捷鍵“F12”亦可。還可在根目錄中找到想要預覽的htm文件，雙擊就可預覽。

（二）安裝iis服務器組件調試

IIS（Internet Information Server，互聯網信息服務）是一種Web（網頁）服務組件，其中包括Web服務器、FTP服務器、NNTP服務器和SMTP服務器，分別用于網頁瀏覽、文件傳輸、新聞服務和郵件發送等方面，它使得在網絡（包括互聯網和局域網）上發布信息成了一件很容易的事。

IIS組件的添加我們在此不再贅述，安裝好iis后，點擊“開始”→“程序” →“管理工具” →“Internet信息服務”，選擇“默認網站”右擊，選擇“屬性”修改主目錄。轉到“主目錄”窗口，再在“本地路徑”輸入（或用“瀏覽”按鈕選擇）好自己網頁所在的“D:Wyweb”目錄。若是動態首頁要自行添加首頁文件名：轉到“文檔”窗口，再按“添加”按鈕，根據提示在“默認文檔名”后添加自己網頁的首頁文件名“index.asp”。否則無法預覽。

安裝好后，我們打開IE瀏覽器，在地址欄輸入http://127.0.0.1或http:// localhost之后再按回車鍵，此時就能夠調出你自己網頁的首頁，則說明設置成功！這時便可像在Internet上一樣訪問自己的頁面。若有想要修改的地方，找到相應的htm文件名重新修改即可，直到滿意為至。

總之，做好一個網站，可以全面宣傳，展示學校風采、優點與特色，發布學校的活動安排等信息內容，使學生及家長增加對學校的了解，增強學生、家長與學校之間的聯系，在Internet網上，讓學生及家長及時得到學校發布的重要信息，同時也幫助了學校完成部分教學事務，提高辦事效率,給學生、家長與學校最方便的聯系橋梁。在這里學生及家長也可以提出意見及想法，互通教學之間的意見想法，更加有效的提高教學質量，學生需要哪樣的教學方式能夠更好的吸收與接納？這些都能成為學校的參考，以便更加的提高學校的辦學及教學水平。