網頁制作論文范文

前言：我們精心挑選了數篇優質網頁制作論文文章，供您閱讀參考。期待這些文章能為您帶來啟發，助您在寫作的道路上更上一層樓。

第1篇

建構主義理論指導下的課堂教學

筆者從建構主義教學觀和教學實踐出發，設計出了一套符合這門學科特點的教學與管理模式：把整個教學過程分成三個階段，全部在計算機教室開展，針對不同的教學內容和教學環節采用不同的教學方式，邊講邊練，即案例引導教學階段、任務驅動實踐階段和項目合作課程設計階段，如圖1所示。這三個階段中教師是引導者，學生是知識的構建者。教師與學生之間，學生相互之間必須密切配合［4］1.展示效果。課堂上，首先把與本節知識內容相關的案例效果及功能展示給學生，通過素材和網頁效果的對比，激發學生的想象能力。2.分析操作任務。在教師的引導下，對案例進行模塊化分析。分析案例時一般包括兩個方面：一個是利用以往知識可以處理的效果；另一個是本次教學內容處理的效果。分析案例的目的在于溫習以往知識和引出本節課教學知識點。學生在分析案例的同時，一方面不斷形成新的理論視野，增長案例分析的技巧；另一方面探索思考理論如何運用于實際，從而及時、有效地促進了理論向實踐的轉化，真正達到理論與實踐的結合，有利于加強文科專業學生的實踐動手能力。3.知識講解與操作示范。在講解過程中注重基礎知識的傳授和基本技能的培養，同時介紹網頁制作中的相關規范和標準，并且注意總結一些實用的技巧。這種教學方式目的明確、形式生動，學生帶著問題聽課，學習興趣和效果明顯提高。教師要實際操作案例，在操作過程中把以往的知識點簡單回顧，并著重介紹新知識點，即講述相關理論知識。把書本上的相關知識通過案例的形式直接展示給學生，學生不但容易理解理論內容，同時，也了解知識的實際用途。4.課堂同步實踐。理論與實踐交融，知識與感悟同步。學生真正掌握技術在于自己是否能夠獨立完成實踐操作，在學生實際操作的過程中，教師應從旁指導、及時糾正，學生只有在依靠自我的力量去解決學習問題的過程中獲得了成功的體驗，才能進一步激發他們的學習熱情。5.課程設計。學生結合所學網頁設計制作知識與自己的興趣或擅長等自擬主題，制作出符合一定要求的網站。每個項目小組由4到5人組成，推選出項目經理，負責小組的項目策劃和成員分工。通過討論、交流與合作，小組成員各盡所能，取長補短，共同完成任務。這樣，既調動了學生的積極性，實踐了所學的知識，又培養了團結協作的能力。將課程設計記入學生的平時成績，從而給學生在該課程的學習上施加一定的壓力，促進其更好地學習。6.歸納總結。教師對學生的操作表現做出講評，對學生在網頁設計中的共性問題進行糾正，不斷規范學生的網頁設計。并與學生共同詳細討論和總結案例中所用到的理論知識和操作技巧。表揚其優點，指出其錯誤，可以鞏固教學效果，彌補學習漏洞，并有助于學生之間的學習交流。教師以“案例”引路，引導學生邊學邊練，以“任務”驅動自主完成學習任務。以“項目”促進理論知識與實際操作結合。教師的“教”與學生的“學”圍繞一個目標，學生充分發揮自己學習主動性和創造性，多種教學方法結合不但解決了課時少、知識點多、實效差、與實踐應用相脫離等問題，而且還充分調動了學生學習的積極性，使學習過程成為一個人人參與的創造性實踐活動，更好地培養了學生創造性思維和發現問題、解決問題的能力［5］。

考核與評價方式

采用課程設計與上機考試結合的考核方式，上機考試從題庫中按出題方案組出若干數量試卷，每位學生隨機抽取其中一套進行考試。“網頁設計與制作”這門課程對于制作網頁的基礎理論和實際操作能力都有比較全面的要求，所以考試當中應當兼顧這兩個方面，理論部分注重學生對網頁制作基本知識、基本理論的掌握，采用選擇、判斷等客觀題的方式進行，為學生進一步的學習夯實基礎。實踐部分要求學生利用給定素材，包括考題所需的圖片、背景和其他輔助圖片、相關考題內容的文字資料、考題要求等，完成規定技術要求的網站創意設計與制作。一個好的考核方式不僅有利于全面真實地反映學生的學習水平，而且有利于反映教學中的問題，以便教師能夠及時作出相應調整［6］。

第2篇

通過《網頁設計與制作》多年的教學發現，應用傳統的教學方式及考核方法學生只建立了的基礎的專業課程知識概念及單一的基本操作，并不能綜合應用操作技能完成某主題網站的設計與制作。為了建立以網頁設計與制作技能考核為主線的開放式、全過程的考核體系，提高學生綜合項目實踐能力，更好的與社會需求接軌。有必要對傳統的考核方式進行改革，同時經過多年教學探索，結合人才培養方案制定了以下的考核方案。

二、考核方案

1.考核方案的制定

本考核采取學生小組合作（每組2-3名學生）完成一個規定主題網站項目的方式展開。總成績由操作考核成績、項目報告成績兩部分組成，權重分別為70％、30％，每一項按百分制評分后依權重比例計入總成績，總成績不及格者必須重修本課程并重新參加考試。因本校的現有學期總評成績是由平時成績30%、期中成績30%、期末成績40%組成，為了與學校的評分要求接軌，將本次考試所得的總成績作為學校學期總評成績的期末成績部分。并在此說明平時成績30%部分是由學生本學期的課程作業完成情況、出勤及上課表現綜合評定。本考核方案中的操作考核、項目報告都有具體的考核方案，其中操作考核實施的具體要求以試卷形式展現，內容要求以表“操作考核內容”為中心，以考核學生綜合網站制作能力為基本思路，通過小組合作完成主題網站的設計與制作，具體要求在此省略。此外要求學生撰寫項目報告不僅讓學生明確各自的份內工作，同時要求學生善于思考、總結，每做一個項目都有所收獲。項目報告實施的具體要求涉及以下幾個方面的內容：

（1）項目實施過程。項目實施過程包括前期策劃、資料搜集、網頁制作。在前期策劃階段，要求小組共同確定網站名稱、網站風格（列舉網頁采用主要色彩及網頁色調定位）、網站欄目、站點目錄結構的內容以形成完整的網站規劃，在此規劃的指導下進行資料搜集、協作完成網頁制作。其中網頁制作中要求頁面美工設計階段介紹所用軟件及提供至少首頁效果圖截圖；靜態頁面制作階段要求繪制網頁布局的結構圖及標注尺寸；程序開發階段列舉所用的開發工具、對數據庫、表進行截圖，以及繪制程序開發頁面流程圖。

（2）項目總結。對本項目完成情況進行分析、總結，并介紹項目實施過程中的收獲及體會。在作品展示時要求各小組派出代表對作品進行介紹，總結，便于相互交流經驗。

（3）項目組介紹。對該項目組成員進行介紹及項目實施過程中的人員分工情況進行報告。體現小組合作開發項目的工作模式，讓學生明白實際工作中不僅需要具備較高的技術能力，還要有合作意識，與合作者之間有效、和諧的溝通。

2.考核方式

第3篇

【關鍵字】Frontpage創建站點、新建頁面、文字、超鏈接

現在流行的網頁制作軟件有很多，如Macromedia公司的Dreamweaver、微軟公司的Frontpage、還有AdobePagemill3.0--制作多框架，表單和Imagemap圖像的網頁工具、Netscape等等。其中Frontpage更以其功能強大、容易上手、界面親切而著稱。它采用所見即所得的方式編輯網頁，利用它可以輕松的組織、編輯網頁并將其到指定的站點上，而且在之后還能對更新情況進行監控以更新站點的內容。

工具準備好了，可根據你的個人喜好來選擇一些素材，如圖片、喜歡的文章等。現在就讓我們從第一步的建立站點來踏上建造網上家園之旅。

用FRONTPAGE創建站點是很容易的。首先，我們來看一下創建一個只包含一個網頁的站點。選擇“文件”菜單的“新建”選項，單擊“站點”命令，這時新建站點對話框就彈出來了，在“指定新站點位置”文本框中輸入新站點的位置，單擊“只有一個網頁的站點”圖標，單擊“確定”按鈕。這就建立好站點了，我們現在來看一下新的站點里有什么，單擊“視圖”工具條的“文件夾”按鈕。在文件夾列表里有一個網頁文件，名字叫做“index.htm”。我們知道，每一個站點都要有一個主頁，這個主頁也是一個網頁文件。瀏覽者訪問站點時首先進入的就是站點的主頁。主頁的名字在一般情況下就叫做“index.htm”。就是說我們新建只包含一個網頁的站點時，FRONTPAGE就自動為我們創建了站點的主頁了。這個新建的站點主頁時空的，我們可以向里面添加內容。

在文件列表里除了主頁之外，還有文件夾。新建站點時，FRONTPAGE都會在站點所在位置下新建兩個文件夾，一個是“images”另一個是“_private”。我們在編輯站點時可以在“image”文件夾里放置站點用到的圖片。“private”文件夾比較特殊，其中的文件對瀏覽者來說是隱含的，我們可以把一些不想讓瀏覽者看到的網頁文件放在這個文件夾里，比如：我們可以在這個文件夾里存放注冊用戶的個人信息。

盡管每一個站點都要有一個主頁，不過創建站點時我們仍然可以從一個空站點開始：選擇“文件”菜單的“新建”命令，單擊“站點”選項，在“新建站點”對話框里，我們可以選擇“空站點”圖標來創建一個空站點。“新建站點”對話框中還有許多其他圖標，這是FRONTPAGE提供的用來創建站點模板或向導。我們創建只有一個網頁的站點或者創建空站點，都是從頭開始來創建一個站點，這就好像蓋房子一樣，首先畫圖紙。然而，有許多的房子都具有相似的結構和用途，所以我們可以用一張圖紙蓋很多相似的房子，這樣就節省了許多工作。

同樣的，盡管站點的風格千差萬別但是有許多站點的功能和結構都是一樣的，如果我們從頭開始建立站點的話，就要做許多重復勞動，這時，我們就可以使用模板或向導來建立站點。模板和向導的作用就好像蓋房子的圖紙一樣，我們不必每次建立站點時都從頭開始。我們單擊“個人站點”圖標，用它可以迅速創建一個個人站點，輸入站點所在的位置，單擊“確定”按鈕，這樣我們剛就創建了個人站點。個人站點模板已經為我們規劃好了站點的目錄和建立了相關的頁面。現在我們點擊一下“文件夾”按鈕，雙擊index.htm圖標，

看，這就是我們的個人站點的主頁。哎，好象有許多文字都不對，沒關系，這些文字都是可以改變的，現在寫的是文字的用途，比如“主題”文字就是用來寫網站標題的地方，我們只要把它改為自己喜歡的標題就可以了。返回到“文件夾”模式，雙擊photo.htm。也可以把風景圖片換成自己的照片，只要在新建站點的基礎上進一步修改就可以做出自己的個人站點了。這不僅節省了許多力氣，同時也給了初學者一個良好的出發點。

那么模板和向導有什么區別呢？我們安裝軟件時，一步步的用對話框提示我們完成安裝過程的程序就是一個向導。在FRONTPAGE里，向導也是一種模板，不過它是一種特殊的模板，它會以對話框的形式輔助你完成站點的創建過程。

現在我們選擇“文件”菜單的“新建”選項，單擊“站點”命令，

你看，FRONTPAGE提供了兩個向導：公司展示向導、討論站點向導，使用起來都很方便，你有興趣也可以利用向導建立一個站點。

創建頁面最簡單的方法就是單擊FRONTPAGE“常用”工具欄的“新建”按鈕。它的右方有一個向下的小箭頭，它是用來選擇要新建什么，可以用“新建”按鈕新建網頁、站點、文件夾和任務。默認狀態下是新建網頁。

如果要新建網頁，可以不用向下箭頭鍵選擇，而直接單擊“新建”按鈕。不過使用文件菜單的“新建”命令來新建網頁能夠有更大的選擇。單擊文件菜單的“新建”命令，選擇“新建網頁”，在“新建”對話框里，可以看到FRONTPAGE提供的許多網頁模板，我們可以用這些模板來建立相應的網頁。在右下角的預覽框里可以看到選中模板的外觀。選擇“兩欄正文”網頁，這樣就創建了一個新的分為兩欄的網頁了。然后點確定。使用模板可以不用總是從空白網頁開始編輯，這樣就省力很多。

網上幾乎所以的網頁都使用圖片加以點綴，在網頁中插入適當的圖片，能夠產生圖文并茂的效果。

如果有一個圖形，怎么把它放到網頁上呢？

首先要看你的圖形是什么格式的，也就是它擴展名是什么只有擴展名為GIF和JPEG的圖形文件才能成為我們的頁面的一部分。因為這兩種圖形格式不僅應用廣泛，而且有利于節省存貯空間。如果圖形不是這種格式，使用了其它格式的圖形文件，在保存網頁時FRONTPAGE會提示做格式轉換，FRONTPAGE可以自動進行格式轉換。

現在可我們看看怎么插入圖形選擇“插入”菜單的“圖片”命令，單擊“來自文件”按鈕。

在默認情況下，FRONTPAGE認為你要插入的圖片總是放在你建立的站點的目錄或它的子目錄下的。可以說,站點就是一個目錄。我們把編輯的許多網頁文件放在同一個目錄下，我們稱這個目錄為站點的主目錄。這些網頁引用的圖形一般也放在這個目錄下。當然，我們也可以在這個目錄下建立其他的子目錄，再把所有的圖形放在子目錄里。所以搜索下拉列表只允許在主目錄和主目錄下的子目錄進行選擇。

如果要插入的圖片不在主目錄下,在“選擇文件”對話框中進行選擇。選擇好文件以后，單擊“確定”按鈕，回到“圖形”對話框。單擊“確定”按鈕，圖形就插入了。現在單擊“常用”工具欄的“保存”按鈕。在“另存為”對話框中輸入新的web頁文件的名字，單擊“保存”按鈕。出現了一個對話框,因為我們剛才插入的文件不在站點內，現在FRONTPAGE要把它復制到站點內，可是使用什么名字，放在站點的哪個目錄下呢，就要在這設置了，單擊“改變文件夾”按鈕，另外這兒還在需要時對圖形的格式進行轉換。單擊“位置”按鈕，在默認情況下，圖形被保存在站點的主目錄下，現在我們選擇IMAGE目錄，單擊“確定”按鈕。回到“嵌入式文件”窗口，再單擊“確定”。這樣，圖形就保存在站點內了

我們還可以從INTERNET上插入一個圖形。選擇“插入”菜單的“圖片”命令，在URL欄內輸入圖片的地址，單擊“確定”按鈕。由于是插入網上的圖片，因此在插入圖形以后，應該保存一下網頁，使圖形存到站點內。

您可能說,我不會畫畫，插入圖片容易，可是編輯圖片就不容易了。沒關系，FRONTPAGE自己帶有許多剪貼畫，你可以把它們插入到自己的網頁。選擇“插入”菜單的“圖片”命令，選擇“剪貼畫”。你看，各種剪貼畫都分類放好了。你可以自由地選擇。不過，插入后別忘了保存網頁，把剪貼畫復制到站點目錄下。

一般我們插入的圖形總是和文本在一起的，所以調整圖形和文本的對齊方式很重要。在默認情況下，圖形自動與文本的底部對齊。這一個網頁，由于默認的對齊效果，頁面出現了大量的空白。這時就要調整圖形的對齊屬性。在圖形上單擊鼠標右鍵，選擇“圖片屬性”，選擇“外觀”選項卡我們把對齊方式調整為“左對齊”。使用圖形可以使網頁更加豐富多彩，而且我們還可以用圖形來建立超鏈接，使網頁相互聯系起來。怎么用圖形來建立鏈接呢？其實圖形超鏈接只要在建立超鏈接時選擇圖形就可以了。首先選中超鏈接的圖形，單擊箭頭圖形，單擊“常用”工具欄“超鏈接”按鈕，選擇主頁文件“頁面1.htm”，單擊“確定”按鈕.在普通模式中，按住CTRL鍵，單擊箭頭圖形，就跳到主頁頁面了。

如果我們要在圖片上加上文字，單擊圖形工具欄“文本”按鈕，現在圖形中就出現了一個文本框，輸入：“計算機軟件”按一下Esc鍵，取消文字編輯，就選中文字框了，調整文本框到合適的位置，單擊頁面其他區域，文字就添加成功了。

如果我要修改單擊一下要修改的文字，這時文字作為一個整體被選中了，再點一下文字，這時文本框里有光標閃爍，你可以編輯文本了，重新輸入：“計算機硬件”，在頁面其他區域單擊。文字就修改完成了。

怎樣使文字更豐富、活潑呢？一個簡單的方法就是使用“格式”工具欄。

字體設置：選上文字，打開格式工具欄的“字體”下拉列表框，在里面選擇相應的字體就可以了。如果瀏覽網頁的人使用的計算機沒有設置的字體？瀏覽器會用系統默認的字體代替你設置的字體。不過，使用常用字體是一個好習慣。

字號設置：在“格式”工具欄“字號”下拉列表框中選擇相應字體就可以了

工具欄上的B、I、U圖標的作用是：

按下B按鈕，被選中的文字就會變為粗體

按下I按鈕，被選中的文字就會變為斜體

按下u按鈕，被選中的文字就會帶下畫線

字的顏色：單擊“格式”工具欄“字體顏色”按鈕旁的向下箭頭，選擇適當的顏色，字的顏色就改變了。

還可以對字體進行一些其他設置。選擇“格式”菜單的“字體”命令，在這里我們還可以作進一步的設置。這里除了“格式”工具欄可以做的設置以外，還可以設置許多效果。

“字符間距”選項卡：它是用來設置文字的間距的。單擊“間距”下拉列表，可以選擇字符的間距是普通、擴充還是緊縮的。選擇擴充，這時預覽框的文字間距就變大了。也可以調整間距大小來改變間距，輸入10，文字的間距就更大了。

“定位”下拉列表：在FRONTPAGE中每一行都有一個底線，定位就是指文字相對于底線的距離。也就是把文字上下移動，現在選擇“上移”，文字就向上移動了。預覽框中的黑線就是行的底線。

設計好的頁面，應該檢查它在瀏覽器中是否顯示正常。

方法是，一般只要切換到預覽模式就可以了。單擊“預覽”選項卡，在這個預覽模式下的顯示和在瀏覽器中的顯示是一樣的。但這并不意味著我們就不必用瀏覽器來檢查編輯的網頁了。因為即使是同一個頁面，可能在不同的瀏覽器中顯示會不太一樣。比如在INTERNETEXPLORER中是這樣顯示的，但是在NETSCAPE中又是那樣顯示的。所以，我們要在自己的機器上多裝幾個瀏覽器，用來檢查網頁的兼容性。

那么為什么不用不同的瀏覽器來檢查呢？選擇“文件”菜單的“在瀏覽器中預覽”選項，在瀏覽器列表框中選擇不同的瀏覽器。（以INTERNETEXPLORER5.0為例）單擊“確定”按鈕。就可以看到新建頁面在瀏覽器中的效果了。

怎樣才能自己做的網頁相互聯系起來呢?也就是說讓別人點頁面上的圖形或文本就跳轉到其他頁面呢？

在網頁里，我們把這種點擊后會進行頁面切換的網頁界面元素叫超鏈接。

先來看一下用文字來建立鏈接。

首先創建一個指向站點內其他網頁的超鏈接。

選擇“插入”菜單的“超鏈接”命令，在文件列表框內選擇“頁面1.htm”文件，注意在URL文本框中顯示了該文件的地址。單擊“確定”按鈕.超鏈接就制作成功了。我們切換到預覽模式（單擊預覽按鈕），當我們把鼠標指向“主頁”兩字時鼠標變成手形，單擊它，我們就切換到主頁了。

那么為什么不在普通模式下試呢？：因為普通模式主要是用來編輯網頁的，當我們在普通模式把鼠標指向“主頁”兩字時鼠標沒有變成小手狀，因此不能進行頁面切換。不過如果按住CTRL鍵，鼠標就變成了小手狀。這時單擊就可以進行切換了。也就是說在普通模式中按住CTRL鍵才能激活超鏈接。

我們也可以將超鏈接指向其他站點的網頁。選中作為超鏈接的文本，單擊“常用”工具欄的“超鏈接”按鈕，這和選擇插入菜單的超鏈接命令是一樣的。在“創建超鏈接”對話框里，在URL地址欄直接輸入要連接的網頁或網站的地址。如果不清楚要作超鏈接的地址，只要單擊URL地址框后面的放大鏡就可以用瀏覽器在INTERNET上查找要鏈接的網頁，FRONTPAGE會自動記錄你找到的地址。單擊“確定”按鈕就可以了。我們還可以改變已經設置好的超鏈接。首先確認是普通模式，在要改變的超鏈接下單擊鼠標右鍵，選擇“超鏈接屬性”命令，輸入新的URL地址就可以了。要想取消超鏈接，刪除所有URL地址框里的內容就可以了。還有一種超鏈接，可以鏈接電子郵件。這樣可以使你的網上朋友通過Email及時與你聯系，這是一個網站站長和網友交流的重要手段。先選中要作為超鏈接的文本，一般文本就是你的郵箱地址，單擊“超鏈接”按鈕，單擊“信封”按鈕，輸入你的郵箱地址，單擊“確定”按鈕，退出對話框，選擇“確定”，這時超鏈接就建立好了。我們試一下，切換到預覽模式，單擊郵件鏈接。

這樣我們就差不多完成了網頁的制作步驟，最后可將它到Web服務器上。站點前還要對它進行檢查工作，包括超鏈接，頁面等。

【參考文獻】

〈1〉喬春源，樊天岳等。信息技術。江蘇科學技術出版社，2001年7月。