《網(wǎng)頁設計》課程設計報告書.docx

信息工程學院網(wǎng)頁設計與制作 課程設計報告書 指導教師： 汪強 專業(yè)班級： 11軟件2班 姓 名： 蘇 強 學 號： 1132104218 日 期： 2012年 6月 4日 2012年 6月 10日 一、設計目的網(wǎng)頁設計與制作課程設計是在學生學習網(wǎng)頁設計與制作課程后，結(jié)合HTML語言、Photoshop圖像處理、Flash動畫制作及Dreamweaver網(wǎng)頁制作等進行的實踐性教學環(huán)節(jié)。通過課程設計，幫助學生鞏固所學知識，強化HTML語言的基本概念及HTML網(wǎng)頁的設計與實現(xiàn)，提高網(wǎng)頁設計與制作的能力，熟悉圖像處理、動畫制作的設計與實現(xiàn)，為后續(xù)課程的學習和實踐打下一定基礎。二、設計任務1、設計題目：利用所學知識，制作個人Blog網(wǎng)站。2、學生設計的內(nèi)容與要求：（1）以學習小組（2至3人左右為一組）為單位，查閱相關(guān)資料，共同探討，相互交流，互幫互助，完成一個高質(zhì)量的設計作品。（2）網(wǎng)站不少于5個子網(wǎng)頁，各網(wǎng)頁具體內(nèi)容為：“基站導航”主頁、“個人簡介”子頁、“心情日志”子頁、“作品展示”子頁、“聯(lián)系留言”子頁；（3）“基站導航”主頁界面美觀，必須要有圖片、flash等內(nèi)容（且其中1個圖片或flash必須含有“11軟件1/2班”Loge設計或個人藝術(shù)簽名設計），各導航條鏈接正確；（4）“個人簡介”子頁界面美觀，用表格或框架搭建頁面布局；（5）“心情日志”子頁界面美觀，要求心情日志內(nèi)容不少于3篇，頁面中設計錨點鏈接；（6）“作品展示”子頁界面美觀，圖片或flash必須為個人原創(chuàng)作品，數(shù)量不少于4件；（7）“聯(lián)系留言”子頁界面美觀，用表單設計頁面。3、設計報告的內(nèi)容和要求設計報告的內(nèi)容應包括基于“個人Blog”的構(gòu)成與實現(xiàn)方案，并提交作品成果。三、設計內(nèi)容（不少于8頁）1.個人Blog網(wǎng)站框架構(gòu)成及綜述 我的個人Blog網(wǎng)站是由一個主頁和4個子頁構(gòu)成。主頁是博客，子頁是個人簡介，心情日志，作品展示和聯(lián)系留言。2.各網(wǎng)頁設計分析與說明（圖、表及文字說明）根據(jù)老師的要求，我是和趙玉祥一組的，所以我們使用的模塊都是一樣的。個人主頁篇： 首先講解的是“個人主頁”，在個人主頁上首先使用Photoshop 制作了我們班級的Logo。我們是11軟件二班，我們用心和每一位同學相處，每個人都心向一處，有一個共同的心，共同的夢想。這是我設計這個Logo的寓意。接下來的是一個個人博客的標題圖標。我給我博客空間的名字是“傻豬”。呵呵呵， 貌似有些賣萌。再看下Logo和標題圖的總體效果吧。 總體來看，顏色搭配的不是很好看，沖擊感太強了。所以不是太滿意。 自然，每個網(wǎng)頁都有一個導航條，我的網(wǎng)頁也不例外。在網(wǎng)頁中，我特地的開辟了一個版塊，加入了滾動字，是我自己寫的，想給全班同學看的一句話，我希望我們班的明天會更好。 在博客網(wǎng)頁的，左下角。寫了一句名言警句，摘自于互聯(lián)網(wǎng)，先看下效果吧。之所以選這個名言，我是希望我們這些大學生不要太過于頹廢了，要有所追求，要有理想，要有一顆積極向上的心。在博客網(wǎng)頁的正中位置，我希望凸顯出一些我自己的個性化的東西，于是乎就想到了前幾年發(fā)布在優(yōu)酷網(wǎng)上的個人視頻。以上是我博客主頁的一些主要內(nèi)容，做的不好，請多多包涵。謝謝！個人簡介篇: 個人見解的頁面，主體上和博客首頁是一樣的，只是稍微改了一點。唯一改變的是，將個人的視頻換成了個人的一些簡介。 在網(wǎng)頁中我配備了一首背景音樂 Bigbang-最后的問候 這首歌我覺得動感，符合我的個性，所以在個人網(wǎng)頁中以這首歌為背景音樂。心情日志篇： 在一個博客中個人的一些博文肯定是少不了的，在此就借取了網(wǎng)上的一些精彩文章。為了方便讀者的閱讀，就在頂部設置了一些錨點，極大的方便了讀者的閱讀。以下是一些正文，我們一起欣賞一下。 做堅強的自己 繁花似錦，煙花已盡。 柏拉圖的永恒以上是，我從互聯(lián)網(wǎng)上的轉(zhuǎn)載的一些的精美文章，這既是我的 心情日志了 ，謝謝觀賞。作品展示篇： 根據(jù)老師上課所說的一些，PS、Flash的一些技法，我也慢慢的模仿了一些作品，也只是粗糙的模仿，希望多多包涵。呵呵呵。以下是一些我的作品。這是模仿老師上課時的直升機動畫。（只改變了飛機的行動路線）這個作品純屬是copy老師的作品，只是在原有基礎上稍加改動了一些。對于一些老師教給我們的技法來看，我覺得，學這些技術(shù)型的學科，必須有一個良好的積極動手以及勤記筆記的習慣，因為技法太多，學得多了就忘了前面的，所以好記性不如爛筆頭，技術(shù)的東西一定要多練，才能熟練，才能做到游刃有余。留言板篇： 作為一個博客，得有一個和瀏覽網(wǎng)頁者的一個互動與交流，所以留言板就孕育而生了。 我的留言板網(wǎng)頁做的很簡單，也是和主頁格式差不多，只有些許變化。 這是留言板頁面的主要部分，主要運用到Dreamweaver中的文本域，和表單，按鈕，等一些操作。技法簡單，但是很實用。以上就是我的整個博客所有網(wǎng)頁的一些概況了，做的不好，還請多多包涵。4.設計心得與體會 通過這一次的網(wǎng)頁設計作業(yè)來說，我收獲真的很大，不僅讓我認識到我現(xiàn)在的知識的局限性和有界性，更讓我意識到了緊迫感，因為我們到現(xiàn)在學的只是一些皮毛而已，卻讓我們操作的如此費勁，那么在以后的社會上，一個弱肉強食，適者生存的社會，我們該如何去面對？所以說這次的作業(yè)不僅是在教育課程上給了我很大的教育外，也在面對以后的社會思想上給了我很大的警示。 這次的作業(yè)也給了我些許的安慰，因為我畢竟做出來了，不管做得怎么樣，美觀不