每個人都曾試圖在平淡的學習,、工作和生活中寫一篇文章,。寫作是培養(yǎng)人的觀察、聯(lián)想,、想象,、思維和記憶的重要手段。相信許多人會覺得范文很難寫,？下面我給大家整理了一些優(yōu)秀范文，希望能夠幫助到大家,，我們一起來看一看吧,。

制作交互網(wǎng)頁教學設計篇一

一、教材分析

本課是frontpage中一節(jié)基礎內容課,，也是frontpage以后知識學習的鋪墊,。本節(jié)課以制作一個簡單網(wǎng)頁為教學任務，學習目的明確,，步驟清楚,，希望完成任務而初步掌握簡單制作步驟的指導思想。同時對學生網(wǎng)頁的創(chuàng)作能力,、網(wǎng)頁布局和色彩搭配能力進行激發(fā)與培養(yǎng),。并為其以后進一步學習網(wǎng)頁制作而打下良好的基礎。本節(jié)課的重點是網(wǎng)頁常用編輯器以及網(wǎng)頁設計布局,，難點是網(wǎng)頁的設計及布局,。教師重點在導，學生重點在實踐與創(chuàng)新,。為了合理利用上課時間,，將用已有部分拓展知識和演示范例利用網(wǎng)絡下傳至學生機，以利于學生上課的實踐與創(chuàng)新,。

二,、學情分析

我校的大部分學生在小學就接受過系統(tǒng)的信息技術課程學習，具備了一定的計算機操作能力,，加上初

一,、初二也學完了word execl powerpoint的知識，應該說學生都具備了一定的基礎,。但也有部分學生基礎沒有打好,，但基本的操作應該沒有多大問題。因此,，在教學過程中關于frontpage的打開與保存,，這里我讓學生自己去學習,，教師只給予必要的提示。而關于html 和講授網(wǎng)頁布局的過程時,，有必要要教師先演示一下,，這也是本節(jié)課的重難點。

三,、教學目標分析：

1,、知識目標：

通過本節(jié)的教學，學生將了解常用的網(wǎng)頁制作軟件,，掌握frontpage的操作界面,，并能親自嘗試做出簡單的網(wǎng)頁作品。

2,、過程與方法

學生將通過教師的引導,，學會通過自主的研究探索，主動獲取知識,，并運用知識解決問題,，逐步地培養(yǎng)自己的創(chuàng)新精神和實踐能力。這對于學生以后的進一步學習很有幫助,。具體過程：課題引入-----教師提示------學生上機自主學習------問題反饋-----教師演示-----學生完成作品-----優(yōu)秀作品點評-----教師小結-----鞏固練習-----課后探究,、實踐。

3,、情感、態(tài)度與價值觀 ① 活動教學激發(fā)學生學習frontpage的興趣,。

② 培養(yǎng)他們自主學習、互相協(xié)作的良好學習習慣以及自主創(chuàng)新精神。

4,、重點、難點

重點：了解常用的網(wǎng)頁制作軟件,，掌握frontpage的操作界面,。

難點：網(wǎng)頁的合理布局和色彩搭配。

四,、教法闡述

為了實現(xiàn)以上教學目標,，結合教材特點,，本課采用的主要教學方法有“任務驅動法”,、“創(chuàng)設情境法”等,。通過學生已經(jīng)受過的美術教育和信息技術教育（課程整合）,，創(chuàng)設一個inter網(wǎng)頁在線的情境（創(chuàng)設情境法）,，設置一個個任務，讓學生運用已學知識,，自己動手,，有機完成課堂設計的各種操作（任務驅動法）（包括：了解常用軟件的概況,，利用word對frontpage的操作界面熟練掌握,，完成自己的第一個網(wǎng)頁設計,。）以任務驅動的方式查漏補缺,，使教學內容合理流動，水到渠成,。教學中,，啟發(fā)、誘導貫穿始終,，充分調動學生的學習積極性,，注意調節(jié)課堂教學氣氛，使學生變被動學習為主動愉快的學習,，使課堂能在生動,、有趣、高效中進行,。

五,、學法指導

本課教給學生的學法是“接受任務——思考討論——合作操練”。建構主義學習理論強調以學生為中心,，要求學生由知識的灌輸對象轉變?yōu)樾畔⒓庸さ闹黧w,。故此本課教學過程中，巧妙設計,，讓學生帶著一個個任務通過課堂討論,、相互合作、實際操作等方式,，自我探索,，自主學習，使學生在完成任務的過程中不知不覺實現(xiàn)知識的傳遞,、遷移和融合,。

六、教學設計

1,、收集資料,，激發(fā)興趣。

在這一環(huán)節(jié)中,，教師利用課前準備好的前期省市獲獎網(wǎng)頁作品，并將之融合到課件中,。教師結合初中學生特點和鄉(xiāng)土教育,，故利用屏幕廣播播放《我的家鄉(xiāng)》和《思品齋》，讓學生共同欣賞,，從而引導學生的創(chuàng)作欲望,，激發(fā)其興趣。

設計意圖：通過網(wǎng)頁實例的導入,，將課堂氣氛調節(jié)得比較活躍,，讓學生更容易進入學習狀態(tài),，為以下的學習做好鋪墊。

2,、初識網(wǎng)頁制作軟件,。在激發(fā)了學生學習興趣后，教師趁勢提出：你們也想制作這樣的作品來表達自己的想法嗎,？順勢引出“三劍客”的概念,，引導學生了解常見的html編輯器。

設計意圖：通過學生感興趣的問題設問,，吸引學生的注意力,，激發(fā)學生的學習興趣。

3,、層層攻關（任務驅動 逐步提高 分層教學）

欣賞過網(wǎng)頁,，教師就提出與學生共同制作簡單的網(wǎng)頁的想法。在授課中我安排了多次的動手制作活動,，制作難度由淺入深,，旨在通過學生自己動手動腦，形成自主探究進而創(chuàng)作的能力,。

（1）第一關：基本任務：邊學邊做,，牛刀小試

由于是初次制作，所以不易過難過復雜,，所以選擇了讓學生自主進入frontpage的界面,，因為有office前面知識做鋪墊，學生進入操作界面并可以在較短的時間內熟悉基本的操作界面,，又有助于形成學生內心的成就感,，提高學生繼續(xù)學習的積極性。后巡回輔導并觀察哪些學生用的方法最快,、最簡便,。

學生：自主學習、互相協(xié)作,，也可以參考教師已下傳上操作方法或正確樣例,。設計意圖：這是第一關任務，對于已有計算機操作基礎的學生來說相對較簡單,。所以我這里給出提示與操作方法后讓學生自己去過這第一關,。讓學生學會操作，并嘗試不同的操作方法來解決問題,。（2）第二關：進階任務：由學到創(chuàng),，拓展提升

在學習完成第一個環(huán)節(jié)后，教師趁勢提出html的概念,，實例中字體,、大小,、顏色變化，引導學生觀察普通,、html,、預覽的不同，以及相關的操作方法,。在此基礎上,，教師進一步設置了拓展問題，讓學生設計自己的網(wǎng)頁,，并通過簡單網(wǎng)頁的制作體會html的具體含義,。最后教師選擇相關學生進行總結，教師注意點評,。

學生：根據(jù)剛才學習的知識和教師提供的素材,。先完成自己的作品并與同學進行交流和溝通。學生通過不斷的實踐,，簡單修改html的方法,，并進行演示。

設計意圖：這是第二關任務,，其中html也是本節(jié)課的重難點,，所以教師先用一種常用方法演示html的內容，而修改讓學生自主學習完成,。同時讓學生相互進行交流,，有助于提高他們的學習積極性與成就感，又可以培養(yǎng)他們之間互相幫助學習的良好習慣,。方法多樣讓學生學會用不同的操作方法來解決實際問題,，但得讓他們自己去實踐，這有助于培養(yǎng)他們自主學習的良好習慣,。（3）第三關：挑戰(zhàn)任務：展翅高飛,，自由創(chuàng)作

在學習制作完第二個環(huán)節(jié)后，引導學生進入“網(wǎng)頁達人”的環(huán)節(jié),，本環(huán)節(jié)主要講解網(wǎng)頁的布局等知識,，由教師演示常見的網(wǎng)頁布局格式，并簡單的給學生進行點評和原理分析,。在此基礎上,，引導學生結合自己的上網(wǎng)經(jīng)歷仔細對比異同，同時歸納適合個人網(wǎng)頁的布局和顏色搭配方式,。

設計意圖：在第二關的基礎上，對出現(xiàn)的問題,，進行分析,、演示,。讓學生在掌握操作技術的基礎上對網(wǎng)頁布局和顏色搭配有進一步的認識，在此基礎上形成對學生審美觀的培養(yǎng),。完成第三關操作任務即完成自己的作品,。讓學生能設計出有創(chuàng)意的作品，培養(yǎng)他們的創(chuàng)新精神,?？紤]到學生之間的差異，在這里只對背景和圖片的接觸和了解,，讓計算機基礎好的一些學生能探索出新的知識操作,。

4、評價作品 教師總結 評價作品

（1）學生互評：通過教師設置的共享文件夾了解其他學生作品,，學生互相發(fā)表意見,。

（2）學生自己推薦：認為自己作品好的學生可以舉手向老師推薦。（3）教師總結評價：教師對學生們評價出的優(yōu)秀作品以及自己推薦的作品作評價并結合作品完成的時間前后評選出前5位優(yōu)秀作品并進行表揚,。

設計意圖：培養(yǎng)學生評價他人作品的能力,。互相欣賞作品可以讓學生來檢測自己的學習成果,，知道彼此之間的差距。讓學生有成就感,，從而激發(fā)學生的學習積極性,，進一步活躍了課堂氣氛。

教師總結

教師結合學生作品和上課的具體情況總結本節(jié)課的主要內容,，注意強調知識目標和情感態(tài)度價值觀的總結。

5,、知識競答大比拼

教師演示準備好的一個知識競答游戲，學生觀看大屏幕,，搶答題目,。設計意圖：用游戲形式的鞏固練習即讓學生對本節(jié)課的知識學習得到反饋,，進一步鞏固所學知識，又可以活躍課堂氣氛,。

6、課后探究實踐

教師給出提示,，引導學生自主學習,，充分挖掘他們的學習潛力

設計意圖：讓學生在課后有思考問題的空間，進一步激發(fā)他們學習frontpage的興趣,。培養(yǎng)他們自主學習計算機其他操作知識。

制作交互網(wǎng)頁教學設計篇二

《網(wǎng)頁的制作》教學設計

山東省昌樂二中 滕學梅

【學情分析】

1.在學習網(wǎng)頁制作之前,，學生進行了網(wǎng)站的規(guī)劃與設計,，還沒有就網(wǎng)頁制作真正著手練習,，對frontpage的使用比較陌生,，但是已經(jīng)有word等軟件的操作基礎，很多基本的操作可以遷移過來,。并且，通過高一的學習與養(yǎng)成,，學習小組的整體意識已經(jīng)建立,，組內合作、組間競爭的氛圍已經(jīng)形成，所以可以采用先進行自主練習,，然后合作探究,，通過各組推薦的作品展示進行評價,，在展示的同時也提高了學生的技術水平,。

2.學生操作基礎不同,，接受能力不同,，可以充分發(fā)揮各小組“技術顧問”的作用,，幫助指導組內其他成員，共同完成學習任務?！緦W習目標】

1.熟練掌握網(wǎng)頁制作和美化的基本操作，提高操作和審美能力,； 2.大膽動手，積極實踐,，總結用網(wǎng)頁表達主題的技巧和方法,； 3.積極,、熱情地投入學習,，體驗網(wǎng)頁制作的快樂?！局攸c難點】

1.重點：利用表格對網(wǎng)頁進行布局,；網(wǎng)頁中的圖文設置及超鏈接的使用,。2.難點：網(wǎng)頁間超鏈接的建立?！窘虒W過程】

課前準備：提前做好小組座次安排,，由學科班長組織大家按組入座。

一,、展示導入,，明確學習目標（3分鐘）

1.展示精彩網(wǎng)頁（如北京大學、清華大學網(wǎng)站首頁）,，引導學生簡單分析網(wǎng)頁風格,。2.明確本節(jié)課學習目標與主要任務。

二,、指導與點撥（3分鐘）

1.分析北京大學網(wǎng)站首頁,，觀察其網(wǎng)頁布局（如圖），引導學生嘗試使用表格對網(wǎng)頁進行版面設計,。2.對網(wǎng)頁制作所用的基本操作進行點撥：（1）文字,、圖片的添加與調整（2）網(wǎng)頁背景的設置（3）超鏈接的建立

三、基本功練習（10分鐘）

1.任務：快速“克隆”示例網(wǎng)頁,。（素材發(fā)到桌面“基本功練習”文件夾中）

與word中的操作類似，注意遷移 2.要求：（1）先獨立練習（參考導學案的“操作導航”）,；嘗試一遍后可與組內同學小聲交流,，解決疑難問題；

（2）每組的“技術顧問”完成任務后可下座指導,；（3）完成后相互檢查超鏈接的效果,。

四、制作主題網(wǎng)頁（15分鐘）

1.任務：從桌面“主題網(wǎng)頁”文件夾給出的四個主題中選擇一個,，快速完成主題網(wǎng)頁的制作,；

2.具體要求參看導學案“實踐探究”部分；可兩人合作,，有能力者最好獨立完成,；

五、作品推選,、上傳：每組推選一個作品參加組間評選,，并將作品文件夾傳至ftp。

六,、精彩展示（10分鐘）各組派一代表向全班展示自己的作品,，并簡介操作要點。展示前,，引導全體學生積極思考以下問題：

1.你從展示作品中學到了什么,？有哪些可借鑒之處,？

2.你是否清楚各作品的效果是如何實現(xiàn)的？若有疑問,，及時提出,。3.能不能提出更好的修改建議？

注：1.學生展示過程中,，教師要引導大家規(guī)范操作,，對于重點加以強調。2.提醒學科班長記錄參與展示和積極質疑,、解答的同學,，匯入評價。

七,、完善提升：（5分鐘）

1.借鑒所展示作品的優(yōu)秀之處,，進一步完善自己的作品； 2.根據(jù)展示同學的演示,，將新學到的操作嘗試一遍,。

八、總結：

1.網(wǎng)頁制作要領：（1）靈活運用基本操作,；（2）版面設計清晰,、條理，或者有獨特之處,；（3）配色和諧,，給人美感；（4）超鏈接順暢,、自由,，方便使用。2.由學科班長公布本節(jié)課評價統(tǒng)計情況,。

【教學反思】

1.在學生自主練習過程中,，適時指導很重要，但教師一人肯定不能照顧全體學生,，所以充分發(fā)揮學習小組的“技術顧問”的作用很關鍵,。

2.在“制作主題網(wǎng)頁”環(huán)節(jié)，給學生準備四個不同的主題素材是很有必要的,，我們在進行教學設計時要考慮到學生個性,、興趣不同，并加以利用,，促進教學,。

3.對進行展示的同學要進行簡單培訓（或者對各組長進行培訓，由組長傳達到展示者）,，防止展示時只宣講他們網(wǎng)頁中的內容,，而忽略技術,，浪費寶貴的時間。4.課堂即時評價很重要,。學生初次接觸一個軟件,，要經(jīng)常收獲一點成就感才有進一步探索的欲望，這就需要我們教師注意發(fā)現(xiàn),、及時鼓勵,。學科班長記錄好大家的課堂參與情況，下課前公布,，這項工作若堅持下來,，對我們的教學會有很大促進。

制作交互網(wǎng)頁教學設計篇三

網(wǎng)頁制作的教學設計

一,、教學目標,、知道站點、主頁的概念,，能在指定位置建立只有一個網(wǎng)頁的站點,；、認識 frontpage 的界面,；,、掌握在主頁中插入文字、圖片,、水平線,；、掌握頁面文件與圖片的保存,。

二、教學重點,、能在指定位置建立只有一個網(wǎng)頁的站點（難點）,、能在頁面中插入文字、圖片,、水平線,、掌握頁面文件與圖片的保存（難點）

三、學情分析

學生已經(jīng)學習了 word,、powerpoint 與上網(wǎng)瀏覽信息,，對計算機的基本操作（word 中文檔的編輯，網(wǎng)頁的瀏覽等）比較熟練,。這使得學生主動探索,、自主學習成為可能。每位學生必須完成基本任務,，有能力的學生還可以完成提高篇的學習,，以充分發(fā)揮學生的積極性與自主性,。

四、教學方法

在教學中,，一方面采用比較教學的方法,，促進學生知識的遷移；另一方面,，提供學生一個導學課件,，讓學生根據(jù)這個網(wǎng)絡環(huán)境下的課件自己探索學習，以滿足不同層次學生的需求,。

五,、教學過程設計

教師活動： 1、引入課題：（激發(fā)興趣,，活躍氣氛）

同學們喜不喜歡上網(wǎng),？經(jīng)常上新浪、西祠胡同等,，有沒有同學知道新浪,、西祠胡同稱做什么？（網(wǎng)站）

瀏覽新浪網(wǎng)站,，瀏覽的第一個頁面稱為什么,？（主頁）

我們還可以瀏覽其它的頁面，點擊超鏈接瀏覽,，當鼠標變成手指的形狀時有超鏈接,。

問題 1 ：網(wǎng)站是不是就是網(wǎng)頁？用自己的語言描述一下網(wǎng)站的概念（網(wǎng)站包含多個網(wǎng)頁,，通過超鏈接把不同的頁面鏈接起來）

問題 2 ：網(wǎng)頁是不是就是主頁,？(第一個頁面稱為主頁 , 網(wǎng)站設計者可以確定哪一個是主頁 , 主頁的文件名一般為： , 主頁也是網(wǎng)頁)

設計網(wǎng)站一般必須經(jīng)過兩個步驟，首先是在計算機里做好,，然后發(fā)布在 internet 上,，讓所有的人訪問瀏覽。

今天我們學習用 frontpage 建立站點,，制作一個主頁,。

先來研究一下沒有發(fā)布的網(wǎng)站 , 打開教師做的網(wǎng)站

問：同學們看到了什么？（文件夾）

總結：

可以這樣理解網(wǎng)站：在資源管理器里,，網(wǎng)站表現(xiàn)為一個文件夾,，里面存放的是所有與網(wǎng)站相關的文件。

打開主頁,，瀏覽頁面,，這是老師做的一個導學課件，將幫助大家完成學習任務。

請學生瀏覽教師課件,，了解學習任務,、新建站點

fp 的啟動

問：與 word 比較，有什么不同,？

（增加了視圖區(qū),，編輯區(qū)有三個窗口）

總結：

視圖區(qū)：多種視圖模式是為了方便網(wǎng)站的管理。制作網(wǎng)頁時,，必須在網(wǎng)頁視圖中編輯頁面

普通窗口：鼠標在閃動,，可編輯、修改頁面,，所見即所得的方式

預覽窗口：瀏覽器中出現(xiàn)的效果,，與 powerpoint 中的 “ 放映幻燈片 ” 類似。

html 窗口：編寫 html（超文本標記語言,，它是描述網(wǎng)頁內容和外觀的標準,。）

打開導學軟件，根據(jù)步驟,，示范建立只有一個網(wǎng)頁的站點,，強調新站點的位置、路徑的正確輸入,，站點的名稱,。

（教會學生利用導學課件，根據(jù)導學軟件完成任務）

任務 1 ：學生根據(jù)導學課件,，在 d: 建立自己站點

教師巡視指導

請一位學生示范如何建立站點 , 教師總結

問：在文件夾列表中看到了什么,？

分析多出的文件夾列表欄，多了一個文件夾,，里面有兩個子文件夾和主頁,，圖片存放在 images 文件夾中）、編輯主頁與保存主頁

看效果圖,，請學生分析主頁中的元素

總結：鮮明的主題,，如：我的世界、我的寵物等,，有分割頁面的水平線,，與主題相關的圖片,，對網(wǎng)站的簡單介紹

根據(jù)導學軟件,，學生完成任務 2 ：設計主頁、保存主頁與圖片

教師巡視指導,、總結反饋

請學生示范,，講解如何插入圖片（來自剪貼畫與來自文件）、插入水平線,，如何保存

總結：必須切換到 “ 普通 ” 窗口下編輯

主頁的保存中存在問題：

單擊 “ 文件 ”----“ 保存 ” 或工具欄的 “ 保存 ” 按扭,，彈出一個對話框,，保存嵌入式文件，改變文件夾,，圖片必須保存在本站點 images 文件夾中 , 便于站點的管理,。、請學生繼續(xù)完成自己的主頁,，有能力的同學完成提高篇

教師巡視指導,、教師與學生共同評價總結

展示學生作品，教師與學生共同評價

請學生總結今天的學習內容：建立包含一個頁面的站點,，主頁的設計與保存,。

學生活動：學生回答問題、學觀察鼠標指針,、學生回答問題,、學生觀察網(wǎng)站的表現(xiàn)形式、齊聲回答,、學生瀏覽課件,，并了解本節(jié)課的學習任務、學生觀察 fp 界面與 word 的不同,、學生回答,、學生觀察教師演示不同編輯窗口的區(qū)別。學生上機操作,，在指定位置建立自己站點,、請先做好的學生當小老師，輔導其它學生,。學生回答,、學生操作，同桌互相幫助,，并參考教師做的課件,，利用網(wǎng)絡環(huán)境下的課件自己探索學習，滿足不同層次學生的需求,、學生總結

注：課件中包含每一個操作過程的操作步驟及拓展的知識,、基本任務與提高任務的效果圖。

點評：

教學課題 “ 網(wǎng)頁制作 ” 作為初中階段的最后一部分內容,，難度較大,，教學的深度較難掌握。這就要教師在備教材的基礎上,，同時還要備學生,，做到對學生的情況有較為深刻地了解，以便很好地完成教學任務，達到預期的教學效果,。根據(jù)教材和《中小學信息技術課程指導綱要（試行）》中的精神,，本課應以 “ 任務驅動 ” 的方式完成，一方面教會學生了解和熟悉具體軟件的基本功能,，另一方面又能主動地掌握并深入學習思考,。尋著這個思路授課教師在課前作了大量的課前準備制作出了相應的教學課件 “ 網(wǎng)頁制作 ”。

一,、調動學生的學習熱情,，變被動學習為主動學習

整個教學過 程張云 老師采取了 “ 引導加任務驅動 ” 的模式進行。首先教師進行導入,，導入概念,，強調概念；再引導學生學習課件的使用,，引導他們讀懂課件中的第一個任務：建立一個只有一頁的網(wǎng)站,，（此處若能引導學生，由學生來完成,，減少老師的操作,，效果會更好），然后讓學生模仿第一步的操作進行下面內容的學習,，完成導學材料中給出的一個個任務,。

二、突出重點,，及時點評

張云 老師在引導學生進行學習,、操作后，就主動地去觀察和發(fā)現(xiàn)學生中出現(xiàn)的問題,，甚至于課前對可能出現(xiàn)的問題,，也進行有預見性地準備；發(fā)現(xiàn)問題及時點評,。（點評分為個別點評和全班點評,，點評不等于教師將操作過程演示一遍。張云 老師在點評建成的網(wǎng)站時,，重點若再突出些,，介紹再清楚些，效果會更好,。比如：站點中內容說明不夠清楚等,。）

三、發(fā)揮學生的協(xié)作學習精神

張云 老師在教學過程中,，對有困難的學生進行個別輔導,，同時還需發(fā)揮學生的協(xié)作學習的精神，充分調動學生學習的積極性,，讓學有余力的學生充當 “ 小老師 ”,，從而體會到學習的樂趣。（整個教學過程中,，這點做地不夠,，沒有充分地讓師生互動起來）

四、重點突出,、目標明確

最后,，張 老師在整個教學過程中，應再突出教學重點,，明確本節(jié)課的任務,。（課前的導入，最好給出教學目標,，課后的小結應讓學生總結他本堂課學習到哪些知識,，所以感覺這節(jié)課重點不突出，內容分散,。）

五,、教學效果較好

由 于張云 老師在課前對本課作了大量的準備工作，課件制作效果較好,，所以學生完成情況很好,，教學任務完成情況較好。

制作交互網(wǎng)頁教學設計篇四

網(wǎng)頁設計和制作策劃書

總體可以分為以下幾點：

1,、建設企業(yè)網(wǎng)站所遵循的一般原則

（1）完整性原則,。企業(yè)網(wǎng)站是企業(yè)在互聯(lián)網(wǎng)上的經(jīng)營場所，應該為用戶提供完整的信息和服務：網(wǎng)站的基本要素合理,、完整,；網(wǎng)站的內容全面、有效,；網(wǎng)站的服務和功能適用,、方便；網(wǎng)站建設與網(wǎng)站運營維護銜接并提供支持,。

（2）系統(tǒng)性原則,。同時提供設計方案。設計實施單位應充分了解企業(yè)文化和企業(yè)機構及管理信息等基本情況,，對營銷目標,、行業(yè)競爭狀況、產(chǎn)品特征,、用戶需求行為以及網(wǎng)站推廣運營等基本問題等要素融入到網(wǎng)站建設方案中,。

（3）簡單性原則,。在保證網(wǎng)站基本要素完整的前提下，盡可能減少不相關的內容,、圖片和多媒體文件等,，使得用戶以盡可能少的點擊次數(shù)和盡可能短的時間獲得需要的信息和服務。

（4）友好性原則,。網(wǎng)站的友好性包括三個方面：對用戶友好——滿足用戶需求,、獲得用戶信任；對網(wǎng)絡環(huán)境友好——適合搜索引擎檢索,、便于積累網(wǎng)絡營銷資源,；對經(jīng)營者友好——網(wǎng)站便于管理維護、提高工作效率,。

（5）適應性原則,。企業(yè)網(wǎng)站的功能、內容,、服務和表現(xiàn)形式等需要適應不斷變化的網(wǎng)絡營銷環(huán)境,，網(wǎng)站應具有連續(xù)性和可擴展性。

2,、網(wǎng)站優(yōu)化

網(wǎng)站優(yōu)化包括三個方面：對用戶獲取信息優(yōu)化,、搜索引擎優(yōu)化、網(wǎng)站維護優(yōu)化,。

（1）網(wǎng)站欄目結構合理,，欄目設置不要過于復雜；

（2）網(wǎng)站導航清晰且全站統(tǒng)一,，通過任何一個網(wǎng)頁可以逐級返回上一級欄目直到首頁,；

（3）網(wǎng)頁布局設計合理，網(wǎng)站設計符合用戶瀏覽習慣,；

（4）重要文字信息盡可能出現(xiàn)在網(wǎng)頁靠前位置,；

（5）字體清晰，css風格協(xié)調一致,；

（6）最多3次點擊可到達產(chǎn)品詳細內容頁面,；

（7）通過網(wǎng)站任何一個網(wǎng)頁不超過3次點擊可達到站內其他任何一個網(wǎng)頁；

（8）遵照搜索引擎為管理員提供的網(wǎng)站優(yōu)化指南,，通過網(wǎng)站結構和內容等基本 要素的優(yōu)化為搜索引擎檢索信息提供方便,，不采用任何被搜索引擎視為垃圾信息的方法和欺騙搜索引擎的方式（如堆積關鍵詞、用戶不可見文本,、頁面跳轉,、復制網(wǎng)頁等等）；

（9）網(wǎng)站首頁,、欄目首頁及產(chǎn)品內容頁面均有一定的文字信息量,；

（10）每個網(wǎng)頁有獨立的,、可概括說明該網(wǎng)頁核心內容的網(wǎng)頁標題（而不是全站或者一個欄目共用一個網(wǎng)頁標題）；

（11）每個網(wǎng)頁有獨立的,、與該網(wǎng)頁內容相關的meta標簽設計（包括description和keywords）,；

（12）每個網(wǎng)頁有獨立的url；

（13）產(chǎn)品內容頁面url盡可能簡短且體現(xiàn)出產(chǎn)品屬性,；

（14）產(chǎn)品/企業(yè)新聞詳細內容頁面是獨立網(wǎng)頁不是彈出窗口；

（15）對于產(chǎn)品品種多的企業(yè)網(wǎng)站,，要有合理的產(chǎn)品分頁方式,；

一網(wǎng)站名稱

綠色的靈動

二主題思想：

讓原創(chuàng)精神穿越人群，在綠色的靈動中尋找創(chuàng)意,。

三個人分工

1,、主頁制作：（謝龍、李金洪,、王海灝---環(huán)藝四班）

2,、設計模板制作：謝龍 廣告模板制作：李金洪攝影模板制作：王海灝

3、網(wǎng)頁設計策劃書：（謝龍,、李金洪,、王海灝---環(huán)藝四班）

四設計網(wǎng)頁前的市場分析

1、原創(chuàng)作品的意思就是內容不是抄錄別人的,，而完全是自己創(chuàng)作的,，包括原創(chuàng)文學、原創(chuàng)音樂等等,。

原創(chuàng)作品是對既定參照物的懷疑與否定,，是在刷新固有的經(jīng)典界面之后呈現(xiàn)出破土而出的生命氣息，是在展現(xiàn)某種被忽視的體驗,，并預設著新的可能性,；原創(chuàng)是可經(jīng)過、可停留,、可發(fā)展的新的存在,，是新的經(jīng)典的原型，具有集體共識的社會價值,。

原創(chuàng)作品不是對既定狀態(tài)的完善與提升,，也不是對已有的存在的另類注解；注解可以發(fā)展原創(chuàng),，但不產(chǎn)生原創(chuàng),。原創(chuàng)作品也不是形式的突圍表演，不是先鋒理念的夸張與變異,；反叛的行為具有對既定秩序與價值的否定,，但不指向原創(chuàng)以及原創(chuàng)作品,。

通過我的創(chuàng)作活動產(chǎn)生的具有文學、藝術或科學性質而以一定物質形式表現(xiàn)出來的一切智力成果（即作品）,，并且內容不是抄錄別人的,，而完全是自己創(chuàng)作的稱為原創(chuàng)作品。

2,、人群分析：原創(chuàng)一直作為一種青年人群的喜愛,，中年人和青年人也是原創(chuàng)產(chǎn)品的主要創(chuàng)作群體。綠色能給青少年兒童一種生機和活力,，能為失落者帶來新的希望,，讓原創(chuàng)精神穿越人群。

五,、創(chuàng)新點——綠色與原創(chuàng)

分析：綠色為植物的色彩,，綠色的明視度不高，刺激性不大,，對生理作用和心理作用都極為溫和,，因此人對綠色的嗜好范圍很大，給人以寧靜,、休息,、使之精神不易疲勞。剛好也是大自然草木的色,，所以綠色意味著自然,、生命、生長,，同時綠色也象征著和平,。在交通信號中又象征著前進與安全。

原創(chuàng)作品是對在刷新固有的經(jīng)典界面之后呈現(xiàn)出破土而出的生命氣息,，是在展現(xiàn)某種被忽視的體驗,，并預設著新的可能性；原創(chuàng)是可經(jīng)過,、可停留,、可發(fā)展的新的存在，是新的經(jīng)典的原型,，具有集體共識的社會價值,。

六、建設網(wǎng)頁的目的及功能定位

1,、建立網(wǎng)頁是為了和大眾共享自己的原創(chuàng)作品并開展業(yè)務,，是個人市場開拓的延伸。

2,、根據(jù)網(wǎng)頁功能,，確定網(wǎng)頁能夠達到宣傳和讓客戶更好的了解原創(chuàng)的目的,。

七、網(wǎng)頁內容及實現(xiàn)方式

根據(jù)網(wǎng)頁的目的確定網(wǎng)頁的結構導航,。

1,、一般網(wǎng)頁應該包括：首頁、設計,、攝影,、廣告、聯(lián)系方式,、在線留言等內容,。內容包括：作品展示、視頻,、背景音樂及留言板塊,。

2,、根據(jù)網(wǎng)頁的目的及內容確定網(wǎng)頁整合功能,。

八、網(wǎng)頁設計

布局簡單合理,，格調清新自然,，有藝術感；整體美觀協(xié)調,；網(wǎng)頁設計上有比較良好的用戶界面,，提倡原創(chuàng)，整體色彩和諧,，符合美感,，制作精美，個性鮮明,；創(chuàng)造性：主題表達形式新穎,，構思獨特；作品具有想象力和個性表現(xiàn)力,；內容,、結構設計獨到；作品創(chuàng)意獨特

1,、網(wǎng)頁美術設計要求,，網(wǎng)頁美術設計一般要與企業(yè)整體形象一致，要符合企業(yè)ci規(guī)范,。要注意網(wǎng)頁色彩,、圖片的應用及版面策劃，保持網(wǎng)頁的整體一致性,。

2,、在新技術的采用上要考慮主要目標訪問群體的分布地域,、年齡階層、網(wǎng)絡速度,、閱讀習慣等,。

（1）、在網(wǎng)站根目錄中開設images common temp 三個子目錄,，根據(jù)需要再開設media 子目錄,，images目錄中放不同欄目的頁面都要用到的公共圖片，例如公司的標志,、banner 條,、菜單、按鈕等等,；common 子目錄中放css,、js,、php,、include 等公共文件,；temp 子目錄放客戶提供的各種文字圖片等等原始資料；media 子目錄中放flash, avi, quick time 等多媒體文件,。

（2）,、在根目錄中原則上應該按照首頁的欄目結構，給每一個欄目開設一個目錄,，根據(jù)需要在每一個欄目的目錄中開設一個images 和media 的子目錄用以放置此欄目專有的圖片和多媒體文件,，如果這個欄目的內容特別多，又分出很多下級欄目,，可以相應的再開設其他目錄,。 目錄中的文件往往會比較多，建議以時間為名稱開設目錄,，將客戶陸續(xù)提供的資料歸類整理,。

（3）、除非有特殊情況,，目錄,、文件的名稱全部用小寫英文字母、數(shù)字,、下劃線的組合,，其中不得包含漢字、空格和特殊字符,；目錄的命名請盡量以英文為指導,，不到萬不得已不要以拼音作為目錄名稱，經(jīng)驗證明，用拼音命名的目錄往往連一天后的自己都看不懂,。

九,、網(wǎng)頁測試

網(wǎng)頁發(fā)布前要進行細致周密的測試，以保證正常瀏覽和使用,，主要測試內容：

1,、服務器穩(wěn)定性、安全性,。

2,、程序及數(shù)據(jù)庫測試，網(wǎng)頁兼容性測試,，如瀏覽器,、顯示器。

3,、文字,、圖片、連接是否有錯誤,。

少采用大型圖片,，用戶關心的信息在首頁體現(xiàn)，不應多次點擊,；

?首頁下載速度要快,；

?首頁有效信息量豐富,；

?首頁有標題,；

?提供一種以上外語鏈接頁面。

?主頁布局比整潔,，重要信息得以重點體現(xiàn),；

?打開網(wǎng)頁不宜彈出多個窗口，影響正常瀏覽,；

?不要刻意追求“創(chuàng)意”效果,，以至于很難理解網(wǎng)站要表達的意思。

頁面信息：

?重要信息完整,，如聯(lián)系方式和產(chǎn)品介紹等,；

?頁面信息足夠，減少多次翻頁,；

?去除與企業(yè)形象,、產(chǎn)品、促銷等方面無關的信息,；

?產(chǎn)品詳細介紹內容過少,；

?內容頁面沒有標題，或者全部使用公司名為標題；

?客戶能夠方便的及時維護補充,，保持其時效性,；

?不允許有無任何內容的欄目。

網(wǎng)頁字體和美工：

?注重美術效果,，但不必大量采用圖片,，影響網(wǎng)頁下載速度；

?注重美觀,，但有些連基本信息內容都不可用圖片格式,，影響基本信息獲取,； ?文字適中,、顏色明晰、不影響正常視覺,；

?頁面不應過于花哨,。

必須克服的問題：

（1）網(wǎng)站規(guī)劃和欄目設置要合理：主要表現(xiàn)在欄目設置不應有重疊、交叉,、或者欄目名稱意義不明確,，容易造成混淆，使得用戶難以發(fā)現(xiàn)需要的信息,，避免欄目過于繁多和雜亂,、網(wǎng)站導航系統(tǒng)混亂；

（2）重要信息完整：企業(yè)介紹,、聯(lián)系方式,、產(chǎn)品分類和詳細介紹、產(chǎn)品促銷等是企業(yè)網(wǎng)站最基本的信息,，企業(yè)網(wǎng)站上這些重要信息完整,；

（3）網(wǎng)頁信息量足夠：包括兩種情況：一種頁面上的內容，或者將本來一個網(wǎng)頁可以發(fā)布的內容不可分為多個網(wǎng)頁,，而且各網(wǎng)頁之間必須有相互鏈接,，不需要再次點擊主頁；另一方面是盡管內容總量不少,，但有用的信息少,，籠統(tǒng)介紹的內容多；

（4）欄目層次過深,。重要的信息應該出現(xiàn)在最容易被用戶發(fā)現(xiàn)的位置,，應盡可能縮短信息傳遞的渠道，以使企業(yè)信息更加有效地傳遞給用戶,；

（5）網(wǎng)站有利于促銷：通過網(wǎng)站向訪問者展示產(chǎn)品,、對銷售提供支持，有多種具體表現(xiàn)方式，如主要頁面的產(chǎn)品圖片,、介紹,、通過頁面廣告較好體現(xiàn)出企業(yè)形象或者新產(chǎn)品信息、列出銷售機構聯(lián)系方式,、銷售網(wǎng)店信息等,，或者具有積累內部網(wǎng)絡營銷資源和拓展外部網(wǎng)絡營銷資源的作用。

適應現(xiàn)在越多的網(wǎng)絡設備和應用的需要 ,；

是web發(fā)展的趨勢,。可以使web平滑的過渡到xml,。

3.使用xhtml 嚴密,。

與其它基于xml的標記語言、應用程序及協(xié)議進行良好的交互工

制作交互網(wǎng)頁教學設計篇五

網(wǎng)頁的制作

一,、教學題目：網(wǎng)頁的制作

二,、教學目標：

1、知道站點,、主頁的概念,，能在指定位置建立只有一個網(wǎng)頁的站點；

2,、認識frontpage的界面,；

3、掌握在主頁中插入文字,、圖片,、水平線；

4,、掌握頁面文件與圖片的保存,。

三,、教學重點：

1,、能在指定位置建立只有一個網(wǎng)頁的站點（難點）

2、能在頁面中插入文字,、圖片,、水平線

3、掌握頁面文件與圖片的保存（難點）

四,、教學難點：

在教學中,，一方面采用比較教學的方法，促進學生知識的遷移,；另一方面,，提供學生一個導學課件，讓學生根據(jù)這個網(wǎng)絡環(huán)境下的課件自己探索學習，以滿足不同層次學生的需求,。

五,、教學過程：

教師活動：

1、引入課題：（激發(fā)興趣,，活躍氣氛）

同學們喜不喜歡上網(wǎng),？經(jīng)常上新浪、西祠胡同等,，有沒有同學知道新浪,、西祠胡同稱做什么？（網(wǎng)站）

瀏覽新浪網(wǎng)站,，瀏覽的第一個頁面稱為什么,？（主頁）

我們還可以瀏覽其它的頁面，點擊超鏈接瀏覽,，當鼠標變成手指的形狀時有超鏈接,。

問題1：網(wǎng)站是不是就是網(wǎng)頁？用自己的語言描述一下網(wǎng)站的概念（網(wǎng)站包含多個網(wǎng)頁,，通過超鏈接把不同的頁面鏈接起來）

問題2：網(wǎng)頁是不是就是主頁,？(第一個頁面稱為主頁,網(wǎng)站設計者可以確定哪一個是主頁,主頁的文件名一般為：,主頁也是網(wǎng)頁)設計網(wǎng)站一般必須經(jīng)過兩個步驟，首先是在計算機里做好,，然后發(fā)布在internet上,，讓所有的人訪問瀏覽。

今天我們學習用frontpage建立站點,，制作一個主頁,。先來研究一下沒有發(fā)布的網(wǎng)站,打開教師做的網(wǎng)站 問：同學們看到了什么？（文件夾）總結：

可以這樣理解網(wǎng)站：在資源管理器里,，網(wǎng)站表現(xiàn)為一個文件夾,，里面存放的是所有與網(wǎng)站相關的文件。

打開主頁,，瀏覽頁面,，這是老師做的一個導學課件，將幫助大家完成學習任務,。請學生瀏覽教師課件,，了解學習任務。

2,、新建站點

frontpage的啟動 問：與word比較,，有什么不同？（增加了視圖區(qū),，編輯區(qū)有三個窗口）總結：

視圖區(qū)：多種視圖模式是為了方便網(wǎng)站的管理,。制作網(wǎng)頁時,，必須在網(wǎng)頁視圖中編輯頁面。

普通窗口：鼠標在閃動,，可編輯,、修改頁面，所見即所得的方式,。

預覽窗口：瀏覽器中出現(xiàn)的效果,，與powerpoint中的“放映幻燈片”類似。html窗口：編寫html（超文本標記語言,，它是描述網(wǎng)頁內容和外觀的標準,。）打開導學軟件，根據(jù)步驟,，示范建立只有一個網(wǎng)頁的站點,，強調新站點的位置、路徑的正確輸入,，站點的名稱,。

任務1：學生根據(jù)導學課件，在d:建立自己站點 請一位學生示范如何建立站點,教師總結,。問：在文件夾列表中看到了什么,？

分析多出的文件夾列表欄，多了一個文件夾,，里面有兩個子文件夾和主頁,，圖片存放在images文件夾中。

3,、編輯主頁與保存主頁

看效果圖,，請學生分析主頁中的元素

總結：鮮明的主題，如：我的世界,、我的寵物等,，有分割頁面的水平線，與主題相關的圖片,，對網(wǎng)站的簡單介紹

根據(jù)導學軟件,，學生完成任務2：設計主頁、保存主頁與圖片

4,、總結反饋

請學生示范,，講解如何插入圖片（來自剪貼畫與來自文件）、插入水平線,，如何保存

總結：必須切換到“普通”窗口下編輯 主頁的保存中存在問題：

單擊“文件”---“保存”或工具欄的“保存”按扭，彈出一個對話框,，保存嵌入式文件,，改變文件夾,，圖片必須保存在本站點images文件夾中,便于站點的管理。

5,、請學生繼續(xù)完成自己的主頁,，有能力的同學完成提高篇

六、小結：

展示學生作品,，教師與學生共同評價 請學生總結今天的學習內容：建立包含一個頁面的站點,，主頁的設計與保存。