導航:首頁 > 萬維百科 > 設計製作網頁實驗的實驗總結

設計製作網頁實驗的實驗總結

發布時間:2021-03-19 14:35:33

1、求一份網頁製作實訓總結,心得。追加50分

*

2、網站設計實訓總結

首先我要做的就是要選擇好題目和網站的風格,之後我就分步驟准備在製作網站前所要做好的准備工作。我瀏覽了中國美食網的一些特點,借監這些網站的優秀之處,不好的地方在自己的網站上加以改良,從而使自己的網站更加美觀。
回顧這次課程設計,至今我仍感慨頗多。的卻。從選題到開始製作,從理論到實踐,在實訓機房日子裡,可以說得是苦多於甜,但是可以學到很多很多的的東西,同時不僅可以鞏固了以前所學過的知識,而且學到了很多在書本上所沒有學到過的知識。

在選擇好題目和網站的風格之後,我就開始了實訓項目的進程,按照實訓方案的規定,先是將網站的總體策劃以書面的形式展現出來,通過老師審核之後,在相應的時間段找相關的素材,搜集與主題相關的文字、圖像等。再是設計網站的內容結構、目錄結構和鏈接結構,設計首頁及其頁面的版式結構。然後創建本地網站,建立網站的目錄結構。製作首頁、二級子頁、內容頁,創建超級鏈接。最後就是測試與瀏覽網頁,如果還有什麼不理想的地方再改進再預覽,如此反復,最後達到最好效果!

在此次網站的設計與製作過程中,難免會遇到過各種各樣的問題,這畢竟是第一次獨自設計網站、製作網站。但值得高興的是:在設計的過程中發現了自己的不足之處,對以前所學過的知識理解得不夠深刻,掌握得不夠牢固,沒有能完全達到自己預期的效果,還好通過老師的細心指導才能達到最終效果……

一周網頁設計與製作的實訓課程結束了,回顧這次課程設計實訓,至今我仍感慨頗多。的確,從選材到開始製作,從理論到實踐,在兩周的實訓日子裡,可以說得是苦多於甜,但是可以學到很多很多的的東西,同時不僅可以鞏固了以前所學過的知識,而且學到了很多在書本上所沒有學到過的知識。更懂得並親身體會到了理論與實際相結合的重要性,只有理論知識是遠遠不夠的,把所學的理論知識與實踐相結合起來,從理論中得出結論,才能真正為掌握技術,從而提高自己的實際動手能力和獨立思考的能力。

3、用ASP製作網頁的實訓報告總結

1. 實習內容及知識應用
1.1實訓內容以及進程安排
實訓內容:動態網站製作的學習及動態網站的製作
這次在3名指導老師的帶領下,我們主要學習了用2種現在比較流行的動態網站開發平台來開發網站:JSP平台與ASP.NET平台;JSP平台方面主要通過XX老師示範製作myblog個人博客網站而學習JSP平台的搭建、資料庫的連接、網站測試等內容;而ASP.NET平台主要通過XX老師和XX2位老師的指導,學習並搭建了ASP.NET平台,掌握了網頁三劍客製作動態網站的基本常識與方法,以及資料庫的連接、網站測試及Photoshop處理圖片等內容


進程安排

日期
日程安排
08年7月28日 確定小組組員,小組成員為:XX(組長),XX(組員)
08年7月29日 確定小組動態網頁開發平台為ASP.NET
08年7月30日 確定網站要實現的功能①
08年7月31日-8月5日 製作BBS網站
08年8月6日 測試BBS網站
08年8月7日-08年8月15日 製作電子商務網站
08年8月16日-8月17日 測試電子商務網站
08年8月18日-8月20日 提交網站給指導老師,聽取指導老師意見,完善網站
08年8月21日-8月22日 網站製作與小學期總結,寫小學期文檔
08年8月23日 提交小學期文檔,小學期實訓結束

說明:①經過討論,我們組決定建設2個網站來實現以下功能
網站1-BBS網站:在這個網站中,我們主要實現了站點日歷與站點搜索引擎2大功能。
網站2-電子商務網站:在這個網站中,我們主要實現了用戶注冊與登陸、購物車的實現、訂單的顯示等頁面。
1.2知識(點)應用以及經驗總結
這次製作2個網站主要應用的知識有以下:
⒈ 資料庫的創建
① Access資料庫的創建
Acess提供2種資料庫創建方式:一種是創建一個空資料庫,然後編輯數據表的內容;另一種使用資料庫自帶的模板創建;在動態網頁面中,一般應用第一種方式
② Access資料庫的打開方式
包括打開、只讀方式打開、獨占方式打開、只讀獨占方式打開
③ 利用設計器設計Access資料庫
利用Access資料庫里的設計器設計Access資料庫
④ 使用向導設計Access資料庫
通過Access的向導,經過一系列對話來設置Access資料庫
⑤ 通過輸入數據連接Access資料庫。
先輸入數據再確定欄位
⒉ 資料庫的連接
① ODBC連接資料庫
打開ODBC數據源管理器面板。 在windows XP中打開控制面板,再打開管理工具,找到數據源(ODBC),雙擊圖標打開管理器,選擇系統DSN。添加數據源,點擊添加按鈕,開始創建數據源,在接下來的對話框中選擇數據源的驅動程序,因我們使用的是Microsoft Access創建的資料庫,所以選擇Microsoft Access Driver(*.mdb)作為資料庫驅動程序。點擊完成按鈕,填寫數據源名,以簡單易記為原則,這里我們以userinfo(表名)來命名,注意不要沖突。說明填不填都無所謂,是描述這個資料庫的用途而已。點擊選擇按鈕,選擇你的資料庫文件。找到自己想添加的資料庫,選中即可。
② OLEDB連接資料庫
在Dreamweaver 中,可以通過在連接字元串中包含 Provider 參數來創建 OLE DB 連接。打開Dreameaver,在站點裡面先新建個ASP頁面(index.asp)。 在「應用程序」面板中選中「資料庫」標簽。只要我們在前面建立了站點,選擇了文檔類型(即我們選的ASP Javascript的),並且還測試了伺服器(http://localhost/newgn/);則當前我們看到就剩下第四步沒有打勾了。 那現在就點擊「+」號,選擇「自定義連接字元串」。在彈出來的「自定義連接字元串」對話框中,"連接名稱"隨便寫一個。「連接字元串」就要好好填寫了。當"使用此計算機上的驅動程序"時應用絕對路徑:DRIVER={Microsoft Access Driver (*.mdb)};DBQ=d: ewgndatabasecnbruce.mdb 否則「使用測試伺服器上的驅動程序」採用Mappath轉換路徑"Driver={Microsoft Access Driver (*.mdb)};DBQ="& server.mappath("/newgn/database/cnbruce.mdb"),點擊「測試」,出現成功對話框,成功連接資料庫後,在DW里其實是自動生成了一個連接文件。位置在自動生成的Connections文件夾中,名稱是你剛才在「自定義連接字元串」隨便敲的為命名asp文件。還可以注意到DW資料庫標簽內看到mdb文件內的各個欄位。
⒊ 動態網頁開發技術
① 記錄集的定義
分為簡單記錄集定義與高級記錄集定義,簡單記錄集的定義使用戶不必用SQL語句查詢而快速定義記錄集。高級記錄集定義則通過SQL語來定義記錄集。
② 記錄集的綁定
記錄集(查詢)的綁定。在網頁中插入一個表單,並輸入需要插入到資料庫的相關內容,然後通過記錄集(查詢)功能來實現表單和資料庫的相互協調使用,並實現「動態」功能
③ 重復區域伺服器行為
伺服器行為其實一段VB代碼,為了方便用戶對記錄集的操作,DW中將常用代碼進行封裝,命名為伺服器行為。而重復區域伺服器行為相當於一個FOR循環函數
④ 設置記錄集導航條
添加記錄集導航條以分頁的方式用來顯示重復區域伺服器行為顯示有限的記錄
⒋XML動態網頁製作
① XSLT
XSLT 是一種用於將 XML 文檔轉換為 XHTML 文檔或其他 XML 文檔的語言,XSLT 用於將一種 XML 文檔轉換為另外一種 XML 文檔,或者可被瀏覽器識別的其他類型的文檔,比如 HTML 和 XHTML。通常,XSLT 是通過把每個 XML 元素轉換為 (X)HTML 元素來完成這項工作的。
⒌伺服器的配置
① 站點存放點的創建
打開電腦,在D盤下建立一文件夾newgn(這個夾子就是你的站點存放點了),並且在裡面建幾個子文件夾(就好似你網站的子目錄)。
② 建立虛擬目錄
回到newgn的根目錄,右鍵選擇「共享和安全」(其實是快速地建立虛擬目錄)
③ 設置IIS的虛擬目錄
出現屬性對話框後,選擇「Web共享」標簽,點選「共享文件夾」,出現共享別名對話框,選擇默然設置,確定即可
⒍利用Dreamweaver創建站點
選擇「編輯站點」,在彈出的屬性框中選「高級」標簽,從「分類」中先選「本地信息」,右窗口中設置站點名稱,本地根文件夾,然後設置遠程信息,訪問選擇「本地/網路」,遠端文件夾仍選擇站點文件夾d: ewgn,再接著「測試伺服器」,「伺服器模型」暫為ASP vbscript,「訪問」本地/網路,「測試伺服器文件夾」仍是站點文件夾d: ewgn,「URL前綴」在http://localhost後面添加「newgn/」,添加的東西就是設置的虛擬目錄,這時,站點定義基本結束,點擊確定。出現「編輯站點」對話框,「完成」即可。
⒎利用FIREWORKS處理圖片
利用FIREWORKS處理一些圖片和製作一些GIF動畫圖片

經驗總結:
利用Dreamweaver做ASP動態網站主要為以下幾步:
①網站伺服器配置
②資料庫設置
③資料庫顯示
④建立注冊系統
⑤建立登陸系統
⑥美化網站

2. 實習心得
{要求500字以上}
l 過程、功能需求、菜單設計、界面設計、資料庫設計、知識的應用技巧、團隊合作感受等(指導教師可按實習內容進行要求並自行增加內容)
本次小學期期實訓,我們小組主要製作了2個動態網站,而製作這2個動態網站的主要過程是:
⒈個人博客網站
①站點的定義
②資料庫的連接
③製作站點搜索引擎及搜索結果頁面
④製作日誌列表
⑤製作BLOG首頁面,基本頁面設計
⑥定義並綁定記錄集
⑦界面的美化
⑧設置重復區域
⑨指定日期的日誌內容頁面
⑩日誌具體內容頁面-日誌內容和回復及日誌回復功能
⒉電子商務網站
①站點的建立和連接字元串
②用戶登陸及用戶登陸信息顯示頁面
③錯誤信息頁面設計
④創建模板
⑤添加登陸頁面的嵌入框架
⑥用戶注冊頁面的實現
⑦添加「密碼」比較驗證的代碼
⑧製作最新產品導航條與滾動產品導航條
⑨產品展示的實現
⑩用戶購物車:限制用戶登陸、添加購物車程序、購物車鏈接、刪除購物車
而這2個網站實現的功能大不相同,前者為一個博客網站,主要實現了站點搜索引擎、日誌列表、站點日期等內容;後者為一個電子商務網站,主要實現了用戶登陸、用戶注冊、密碼驗證、產品展示以及用戶在線購物等內容;剛確定製作網站的時候,本設想將2個網站整合在一起,但由於技術和其他原因,這個目的沒能實現。
製作動態網站,資料庫最重要,在我們小組這次製作網站的過程中,花時間最多的地方就是資料庫-資料庫的建立、資料庫與網站的連接、記錄集的綁定、資料庫安全等等,由於時間的關系,我們小組這次採用的是Acess資料庫,它與其他資料庫相比較相對來說操作比較簡單。在資料庫的製作中,這次我們小組遇到的難題主要是採用OLEDB連接資料庫的方法,這個難題的關鍵之處是在於如何利用 Provider 參數來創建 OLEDB 連接,我們在網上搜索了大量資料並在XX老師的幫助下終於學會了如何使用OLEDB連接資料庫。
總結這次小學期實訓,這次2個網站能這么順利的完成,離不開老師的幫助和小組成員的努力,雖然這次小學期實訓我們小組只有2人,但是我們是一個有效率、有組織、有團隊精神的小組,有效率在於小組製作網站中分工明確、討論有目的;有組織在於小組成員能按時、有質量的完成自己的分工任務,值得一提的是這次小學期網站開發的大部分時間在小學期實訓教室而我們小組成員還從未擅自曠課、上課遲到、早退等違紀行為;有團隊精神在於我們小組實訓過程中的共進退,從不因為自己分工任務提前完成而拉下其他組員,我們意識到小組是一個有組織、有記錄、有共同目的的集體而不是一個由分散的個人組成的團體,在這次小學期實訓中之所以提出小組分工這是鍛煉小組組員的個人能力培養,而幫助有困難的組員這充分培養了組員之間的默契和團隊協作能力。
這次是畢業前最後的一次小學期實訓,也是自己做投入、最用心的一次實訓,與以前的小學期相比,以前的小學期都是以掌握某種實訓技能為主,而這次小學期則不僅掌握了動態網站的製作技術而且還製作出了自己的成果,自己非常高興。經過這次小學期,我領悟到任何東西都要「學以至用」,學習了還不行還要看自己掌握了沒,掌握了還不行還要看自己熟練了沒,熟練了還不行還要做出一定成果。即將畢業,能接受這么一次有意義的小學期實訓感覺很充實。
網址:www.liuboxue.cn

4、跪求:網頁設計實訓個人總結

《網站設計與製作》實訓報告
X學院 XX班 XX X號
一.實訓時間:
2010年6月7日到2010年6月13日二.實訓地點:
科實南213
三.實訓組員:
XXX、XXX
四.實訓目標:
以金華農特產為主題,製作網站,通過綜合實訓進一步鞏固、深化和擴展學生的理論知識與專業技能。
五.實訓策劃:
這一周,我們要進行《網站設計與製作》實訓,我們認為做網站前最主要的是確定主題、框架和標題欄的設計。因此我們相互討論之後,確定製作以「健康」為主題的「林安健康網」,但在之後的資料收集和網頁的框架的建設中,我們發現出了問題,在確認無法做出效果後,我們決定放棄這個主題,重新建立以「水果」為主題,以我們的名字連體命名的「林安水果網」。以下是我們的策劃內容:
1.確定主題。製作網頁,首先是確定主題,金華有許多特色水果,水果產品豐富,,經過考慮,確定以金華水果品種為主題的網站 ,建立一個簡單的介紹金華水果的網站,專業介紹一些金華地區優秀的水果市場和銷售渠道等。我們本次間的網站基本以綠色為基點,綠色是生命的顏色,綠色代表著生機勃勃,所以本站以綠色為風格,讓整個網站充滿綠的生機。
2.設計主頁。主頁的設計是整個網站的靈魂,構思導航欄的分類,然後是整體規劃,每一版塊都有其個性的色彩,清晰明了,便於閱讀瀏覽,我們構思大致分幾部分,首頁,特價專區,優質水果,果樹栽培,婺城商場,金東商場,客戶中心,聯系我們,意見反饋等板塊,再加入個別網站等,每一部分又分幾小部分,內容比較充分,多樣。確定導航欄的各個分類標題之後對於建立二級子網尤為重要,我們運用Photoshop CS3技術來設計出導航欄,再用Fireworks CS3或Photoshop CS3技術製作切片,建立導航欄,將整體的主頁效果建立起來。
3.資料的搜集。主頁的導航欄設計好後,接下來就是對主頁導航欄的各個內容進行資料的收集,我們採用大量的資料收集再對資料進行塞選,得到最適合導航欄內容的資料。素材的選擇,要符合網站的主題,圖片的大小要符合模板的輪廓,我們將不符合模板的用Photoshop處理編輯,然後放入站點底下,進行圖文的鏈接和排版。
4. 建立模板和庫。此次網站建設中我們決定大量運用模板和庫,運用模板和庫對於建立網站提供便利同時也為我們減少大量的工序。本次水果網的建設主要採用兩個模板,各具風格,樣式標准。
5.各個子網頁的建立。我們設計好模板後只要在可編輯區依次編輯所需資料就可,運用模板建立子網頁少了很多工序,為我們節省大量的時間。盡管我們建立了模板,但我們在建立子網時很小心,因為一張圖片的大小插入就有可能破壞整個模板的結構尤其在使用表格時,因此我們對所插入的圖片和表格都得進行測量,做到不影響網站整體的美觀。
6.實現網頁間的鏈接。做好個格子網和首頁後,接下來就是通過模板的鏈接,將整個網站中的網頁鏈接起來,過程其實很簡單,主要是把要鏈接的文字和圖標選擇在選擇工具欄的鏈接按鈕最後選擇自己要鏈接的網頁單擊確定便可以了。通過模板建的幾張網頁其實超鏈接都不怎麼用鏈接,只需要修改模板上的鏈接就可以了,這也是通過模板新建網頁的好處,省去一張一張超級鏈接的時間了。做好這一步後,網站基本算是建好了。
7.向靜太網頁插入動態效果。在基本建好網頁中的插入層和時間軸,製作其動態效果,讓整個網頁充滿生機。我們在網上進行flash素材的收集,通過Flash CS3設計出主題下的風格動態效果。然後插入到靜態網頁中,使網頁更加生動形象。
六.實訓心得:
通過這半年的學習實踐中 和老師的指導下以大量明晰的操作步驟和典型的應用實例,教會我們。使更豐富全面的軟體技術和應用技巧,使我們真正對所學的軟體融會貫通。所以我結合所學專業的內容製作了企業水果網站,作為實習的成果。其內容是多樣化的。製作網頁用的軟體是Deamweaver CS3軟體。它提供了網頁和表單的動態生成到企業級的解決方案。主圖是一個網頁的門面,它能體現出這個網頁的整體風格。
製作網頁,首先是確定主題,經過再三考慮,就做了個關於金華水果的網站 ,要對這些有些了解,於是確定主題,做一些類似的網站,但考慮到,現在網路上好多類似的網站,但有些內容不適合我們大學生閱讀,對於我們來說有點不實際,根據這種情況,最後決定建立一個簡單的介紹金華水果的網站,專門介紹一些金華地區優秀的水果市場和銷售渠道等。於是網站主題確立。
然後是整體規劃,每一版塊都有其個性的色彩,清晰明了,便於閱讀瀏覽,大致分幾部分,首頁,特價專區,優質水果,果樹栽培,婺城商場,金東商場,客戶中心,聯系我們,意見反饋等板塊,再加入個別網站等,每一部分又分幾小部分,內容比較充分,多樣。
再後是收集資料與素材,大量瀏覽相關網站,收集關於金華水果的圖片,進行Photoshop CS3圖片處理和排版,插入好的文章和圖片等,還有參考一些好的網站的布局,特色,顏色搭配,背景圖等。
再後是設計網頁圖片,用flash製作網友調查表,用Photoshop製作靜態圖片。再後是建立站點,和製作網頁了,使用dreamweaver製作。
首頁內容精彩豐富,首頁主要是導航作用。首頁製作時,時刻考慮著網頁的基本原則:統一,連貫,分割,對比及和諧的原則,內容統一,都是為了主題服務,一個網站強調的就是一個整體,只有圍繞一個統一的目標所做的設計才是成功的;連貫,頁面之間關系連貫,統成一體;每版內容都自成一體,顏色各異,便於瀏覽;整個網頁有動有靜,顏色不同,形成對比,不呆板,富有生氣;顏色各異,但又不同之中又相同,渾然一體。
簡潔實用: 這是非常重要的,網路特殊環境下,盡量以最高效率的方式將用戶所要想得到的信息傳送給他就是最好的,所以要去掉所有的冗餘的東西。使用方便:同第一個是相一致的,滿足使用者的要求,網頁做得越適合使用,就越顯示出其功能美;頁面用色協調,布局符合形式美的要求: 布局有條理,充分利用美的形式,是網頁富有可欣賞性,提高檔次。當然雅俗共賞是人人都追求的。
利用我們所學的模板設計,製作更完美的頁面。將動態網頁與靜態網頁結合起來
再後,調試過程,好多次本來在Deamweaver CS3里好好的,把字調的好好的,位置很對,可在瀏覽器里御覽就出毛病了,不是靠上了,就是靠下了,很不老實,經過再三調試,整理,加了好多表格,終於滿意了。
通過溫本周的實訓,發現自己還有很多的不足。就框架的應用很難把握,切片也很難合理切割,當插入圖片的時候把原有的模板給撐破了,精確定位很重要。因為學藝不精,所以不會網頁的代碼設計,只能通過網路三劍客綜合使用。不過也實踐中也學到了很多知識,比如原本不知道網頁設計還需要切片,表格的嵌套是非常重要的,模板的應用時非常便捷的。還有一些行為中的效果也是蠻不錯的。所以這次實訓還是很有意義的。

5、網頁製作div+css實驗報告

DIV+CSS是網站標准(或稱「WEB標准」)中常用術語之一,通常為了說明與HTML網頁設計語言中的表格(table)定位方式的區別,因為XHTML網站設計標准中,不再使用表格定位技術,而是採用DIV+CSS的方式實現各種定位。SEO是指搜索引擎優化,主要就是通過對網站的結構、標簽、排版,關鍵字等各方面的優化,使搜索引擎更容易抓取網站的內容,並且讓網站的各個網頁在等搜索引擎中獲得較高的評分,從而獲得較好的排名。DIV+CSS網頁布局對SEO有很重要的影響。具體來看到底有什麼好處呢?
DIV+CSS的網頁布局對SEO的好處一、不存在表格的嵌套問題
很多「網站如何推廣」的文章中稱,搜索引擎一般不抓取三層以上的表格嵌套,這一點一直沒有得到搜索引擎相關的官方證實。我的幾項實驗結果沒有完全出來,但根據目前掌握的情況來看,Spider爬行Table布局的頁面,遇到多層表格嵌套時,會跳過嵌套的內容或直接放棄整個頁面。
使用Table布局,為了達到一定的視覺效果,不得不套用多個表格。如果嵌套的表格中是核心內容,蜘蛛(Spider)爬行時跳過了這一段沒有抓取到頁面的核心,這個頁面就成了相似頁面。網站中過多的相似頁面會影響排名及域名信任度。
DIV+CSS的網頁布局對SEO的好處二、精簡的代碼
使用DIVCSS布局,頁面代碼精簡,這一點相信對XHTML有所了解的都知道。觀看更多的HTML教程內容。
代碼精簡所帶來的直接好處有兩點:一是提高蜘蛛(Spider)爬行效率,能在最短的時間內爬完整個頁面,這樣對收錄質量有一定好處;二是由於能高效的爬行,就會受到蜘蛛(Spider)歡迎,這樣對收錄數量有很大好處。

而DIV+CSS布局基本上不會存在這樣的問題,從技術角度來說,XHTML在控制樣式時也不需要過多的嵌套。
這雖然沒有得到確認,但還是建議使用Table布局的朋友們,在設計時盡可能的不要使用多層表格嵌套,SEOer(seo工作者們)們在文章中說明了這一點,相信他們也不是沒有依據。
DIV+CSS的網頁布局對SEO的好處三、對搜索引擎的排名
基於XTHML標準的DIV+CSS布局,一般在設計完成後會盡可能的完善到能通過W3C驗證。截止目前沒有搜索引擎表示排名規則會傾向於符合W3C標準的網站或頁面,但事實證明使用XTHML架構的網站排名狀況一般都不錯。
DIV+CSS的網頁布局對SEO的好處四、提高網頁的訪問速度
DIV+CSS布局較Table布局減少了頁面代碼,載入速度得到很大的提高,這在蜘蛛(Spider)爬行時是非常有利的。過多的頁面代碼可能造成爬行超時,蜘蛛(Spider)就會認為這個頁面無法訪問,影響收錄及權重。
真正的SEOer(seo工作者們)不只是為了追求收錄、排名,快速的響應速度是提高用戶體驗度的基礎,這對整個搜索引擎優化及營銷都是非常有利的。

換一個角度拋開DIV+CSS對SEO的有利影響.單獨來講這種div+css布局也是很有益的,可以說是實下是最流行的網頁布局方式.可是加快我們網站的速度,便於管理與修改.當然div+css布局也有不完善的方面,比如說,他的css樣式表與各種瀏覽器之間的不兼容問題.當然如果你是div+css高手的話相信這個不難吧!

與設計製作網頁實驗的實驗總結相關的知識