靜態(tài)網(wǎng)站設計報告模板

........專業(yè)...網(wǎng)頁設計報告學部：課程名稱：網(wǎng)頁設計根底專業(yè)：學號：姓名：指導教師：目錄一、簡介11.1介紹11.2制作工具21.3站點介紹31.4文件夾擺放簡介3二、布局簡介42.1首頁布局42.2個人中心布局工具42.3朋友布局52.4作品布局52.5學校布局52.6相冊布局6三、容介紹8四、制作心得11五、參考文獻12簡介1.1介紹我的是介紹自己的個人，總共15個頁面，其中導航上有6個，包括首頁、個人中心、朋友、作品、學校、相冊。首頁局部：介紹了自己的一些簡單的資料，其中有一份電子雜志，是平時的時候為了留作紀念做的，很想與教師和同學們分享。個人中心：關于自己的一些詳細的信息，以及在大學的一些變化，里面有兩個子網(wǎng)頁，通過圖片進入，包括我的家鄉(xiāng)和我的專業(yè)；我的家鄉(xiāng)是介紹荊州和荊州公安的一些信息，而專業(yè)就是介紹的電子商務方面的一些信息。朋友：包括三個子網(wǎng)頁，介紹我的三個好朋友，夢雪、麗婷和何立芝；好朋友有很多，只是因為時間原因，沒有多余的時間做更多的頁面去介紹，在后期的完善過程，會一一加上，因為做好不僅僅是因為它是作業(yè)、是考試，還是自己在大學的知識的積累和美好的回憶。作品：運用SPAY放置了自己的五篇隨便，平時很喜歡寫隨便，一段時間不寫，就覺得少了寫什么。當然，還包括自己喜歡的一些作家，很喜歡小嫻，喜歡她的文字，很真實，因此也用了一個頁面專門介紹小嫻。學校：這一局部我僅僅介紹了大學和高中，因為資源有限，沒有一些關于小學和初中的照片，也就沒方法詳細介紹。相冊這頁，是花了最多心思去做的一個頁面，其中的一個"鼠標經過圖片移動〞是在平時自學CSS的時候學到的知識，因為對制造有很大的興趣，所以，在平時有時間的時候，會在網(wǎng)上下載一些視頻和資料，用來自學。相冊：包含兩個子網(wǎng)頁，分別是班級相冊和家人相冊。在下面的介紹中，會仔細介紹。1.2制作工具Dreamweaver8.01.3站點介紹家鄉(xiāng)家鄉(xiāng)專業(yè)X小嫻小雪麗婷立芝高中班級家人個人首頁中心個人作品朋友學校相冊1.4文件夾擺放簡介在文件夾0琴里面分為6個子文件夾，命名如下列圖所示，為了讓讀者更快捷的進入我的，我將index頁放在了外面。布局簡介我的包括15個頁面，八種布局，最主要的運用上下、左右布局，再細分。TOC\o"1-2"\h\z\u2.1首頁布局：首頁布局采用的是左右構造，其中左分為上、中、下三局部，分別添加下拉式、圖片、日期三局部。右邊是簡單的背景加文字組成。大致布局如圖1.1圖1.12.2個人中心布局：個人中心主要是上下構造，其中上局部包括左中右，下局部包括四塊，分別以左上、左下、右上、右下命名，這樣的布局在感覺上很復雜，其實很簡單，比方下局部的四個塊狀，它的代碼是共同的。大致布局如圖2.1圖2.12.3朋友布局：朋友局部的布局很簡單，簡單的上下構造，簡單的利用圖片的固定位置來構造成上局部的左右構造。在我的家鄉(xiāng)頁面簡介中，也是運用的一樣布局。其布局如3.1圖3.12.4作品布局：作品局部運用的是上下構造，其中下局部分為左右兩塊，如下列圖4.1圖4.12．5學校簡介：學校局部的布局和三個朋友簡介頁面的布局是采用的一樣布局，都是運用的上下構造，其中上局部包括左右，這種布局與上面的作品布局很像，其大致構造如下列圖5.1圖5.12.6相冊布局：相冊布局采用的是左右構造，再對左局部劃分，劃分為上中下三局部，對右局部劃分為上下構造。這樣的布局在是視覺上可能較為凌亂，但是只要運用較為搭配的色彩，就不會有這種感覺。布局簡圖如6.1所示圖6.1另外的兩種布局較為簡單，即對center局部進展劃分，劃分為三到四局部。上6圖即為我的大致布局模式。為了能在不同的瀏覽器中顯示的效果比擬統(tǒng)一，在布局的時候，所以的布局都采用了上中下三局部的模式，其中在對center局部加以擴展，這樣的布局使所以的容伴隨著header、center、footer一起移動，這樣一來，就能到達預期的效果。書本上介紹的布局模式包括肯多，像一列寬度居中、兩列固定寬度、三列自適應、高度自適應等，這些布局模式在中都有用到。容介紹3.1首頁首頁簡單明了，讓讀者可以很直接的找到自己所需的分類其中，導航欄參加了彈出式菜單在鼠標滑過菜單時會有變化。同時在主頁中多處參加了超，用來方便瀏覽者來查找資料還有等。3.2吉他入門在吉他入門這一欄中采用了文本與圖片相結合的方式進展制作在吉他入門這一類中其他分欄根本采用同樣的圖文結合的方式進展制作與設計的3.3吉他教程在吉他教程分頁中，我依舊采用了圖文結合的方式進展設計與制作，不過在主頁的三個視頻連接和此分頁中的熱門視頻分欄中插入了視頻元素，還有熱門圖譜中的圖片元素3.4聯(lián)系我們在聯(lián)系我們這一分頁中只插入了一些文本與圖片3.5.意見反應意見反應分頁中插入了意見反應表，采用了表格——表單里面的容并在下面插入了提交和重置按鈕四制作心得這次的制作，是來打大學后的第二份，可是我覺得依然學到了很多知識，相比前一份，這一份不僅僅制作的時間較久，而且花了更多的心思，做一份關于自己的，相對而言，沒那么簡單，需要的素材是自己的，所做的布局要自己想，網(wǎng)上的個人，要么太復雜，要么太簡單，都不適合自己。在制作前，本來以為在課堂上學習的知識遠遠不夠我們做一份完整的，但是后來我發(fā)現(xiàn)我錯了，一個做下來，發(fā)現(xiàn)所用到的全是教師上課講過的。當然，還有些沒有用到的知識和自己在課外學到的知識。在制作的時候發(fā)現(xiàn)，Dreamweaver確實很強大。需要學習的去運用的東西還有很多，想要做出一份好的，必須對軟件足夠的熟悉，這點我做的還不夠，有些效果想要實現(xiàn)卻不知道如何去寫代碼，希望，在以后的學習過程中，能夠很好的運用那些沒用過的代碼，了解CSS的強大。在這里，很感謝王教師的教誨。缺乏之處：制作一份完整的，還需要登錄系統(tǒng)等后臺數(shù)據(jù)庫的連接，可是，因為時間還有技術原因，我的沒有插入登錄系統(tǒng)，我們有學習關于登陸頁面的制作，在課堂上我也有認真的完成相關的作業(yè)，可是，因為個人沒有必要用戶登錄和注冊，而且數(shù)據(jù)庫的也不完善，因此，選擇了放棄登錄頁面的插入。如果有必要，在學習了動態(tài)網(wǎng)頁制作后，我會在插入相關的登錄頁面，這樣，才算一個完整的。通過這次的制作，我學到了很多，不僅僅是知識與技術方面，還有其他很多，如色彩搭配，整體協(xié)調，集體精神等。這些，對于以后的學習生活，都會有幫助，畢竟這樣的時機不多，還是應該好好珍惜的。五、參考書籍：[1]C