網(wǎng)頁設(shè)計(jì)公選課心得感悟.doc

網(wǎng)頁設(shè)計(jì)與制作心得感想經(jīng)過十二周的網(wǎng)頁制作公選課，我們?cè)诰W(wǎng)頁世界里結(jié)束了一段美妙的旅程。代碼是它的語言，我們對(duì)待網(wǎng)頁這個(gè)網(wǎng)絡(luò)生活中司空見慣的事物有了新的見解。原來，我們上網(wǎng)頁沖浪的時(shí)候，只知道打開瀏覽器，享受豐富多彩的網(wǎng)絡(luò)社交活動(dòng)和欣賞精美的網(wǎng)頁，然而卻始終不知道它背后的秘密；然而現(xiàn)在，我們打開網(wǎng)頁卻知道它是一串一串代碼神奇的組合，它們經(jīng)過糅合加工，最終向我們展示出一個(gè)絢爛的虛擬世界。正如古話說：知其然，知其所以然。在以后，我們對(duì)于網(wǎng)絡(luò)生活有了一種新的界定。網(wǎng)頁不再是一幅幅精美的圖畫或是相片，而是庖丁解牛般的了解它的構(gòu)造，知道編程人員背后付出的努力。在享受網(wǎng)絡(luò)生活的同時(shí)，感謝那些網(wǎng)頁制作者們的付出汗水。鄧小平曾經(jīng)提筆寫道實(shí)踐是檢驗(yàn)真理的唯一標(biāo)準(zhǔn)。只有通過實(shí)踐，才能證明我們自己已經(jīng)掌握到的和了解我們自身的局限性以及不足的地方，這樣我們才能及時(shí)發(fā)現(xiàn)錯(cuò)誤，糾正錯(cuò)誤，才能在下一次的實(shí)踐中警醒自己不再犯一樣的錯(cuò)誤。在上完了十一周的理論課之后，老師給我們布置了一項(xiàng)對(duì)于我們網(wǎng)頁編輯初學(xué)者來說非?！捌D巨”的任務(wù)就是利用我們?cè)谑恢艿恼n堂教學(xué)中所掌握到的知識(shí)來親自制作一個(gè)網(wǎng)站。特別是對(duì)于網(wǎng)頁設(shè)計(jì)與制作這門課來說，它的特殊性在于它注重于實(shí)踐操作，理論知識(shí)一種輔導(dǎo)措施，只有親自實(shí)踐操作，在不同的瀏覽器中進(jìn)行檢測(cè)，才能發(fā)現(xiàn)問題，改善自己制作網(wǎng)頁的技巧和能力，才能進(jìn)一步的鞏固所學(xué)到的知識(shí)。所以，在上完理論課，聽完老師講授的制作網(wǎng)頁應(yīng)注意的要點(diǎn)，自己動(dòng)手親自做一個(gè)屬于自己的網(wǎng)站就是十分必要了。它可以檢驗(yàn)自己動(dòng)手操作能力，鞏固理論，是理論與實(shí)踐相結(jié)合。真正掌握學(xué)習(xí)制作網(wǎng)頁，而不只限于書本。首先在構(gòu)思網(wǎng)頁的整體構(gòu)造上，我參考我自己喜歡的作家韓寒的個(gè)人微博主頁（一個(gè)韓寒）。在界面風(fēng)格上，主要采取了它主要用的兩種鮮明顏色藍(lán)色和黃色的搭配。而且參照韓寒的個(gè)人主頁，”一個(gè)“的簡(jiǎn)潔元素理念。我將自己的網(wǎng)頁也設(shè)計(jì)的十分簡(jiǎn)潔明快，使人一目了然。整個(gè)網(wǎng)站一共分為十張網(wǎng)頁，其中一張是主頁，其余的九張都可以通過右側(cè)設(shè)計(jì)的導(dǎo)航欄回到主頁面。在站點(diǎn)文件夾，按照老師要求的規(guī)則命名為“學(xué)號(hào)+myweb”，主頁命名為“index.html”，其余的九張分別命名為“page+頁數(shù)”。站點(diǎn)文件夾中還包含其他兩個(gè)文件夾，一個(gè)是“images”文件夾，其中主要存放網(wǎng)頁中所用到的圖片資源，且圖片都經(jīng)過處理，大小合適，命名有規(guī)則。還有另外一個(gè)文件夾是“media”文件夾，其中主要存放網(wǎng)頁中所用到的媒體資源，包括mp3格式的音頻文件和swf格式的多媒體文件。在制作網(wǎng)頁的過程中，第一步就是規(guī)劃網(wǎng)頁的布局。根據(jù)上課所學(xué)到的知識(shí)以及課下自己查閱相關(guān)網(wǎng)頁制作的書籍，對(duì)網(wǎng)頁布局有了一個(gè)大致的了解。我采用的是div+css的技術(shù)來實(shí)現(xiàn)頁面布局和頁面效果。CSS用于控制網(wǎng)頁元素的外觀，其主要作用于分離頁面的樣式和結(jié)構(gòu)。CSS提供了豐富的樣式表現(xiàn)功能，如字體、段落、顏色、背景、布局等。使用DIV+CSS的布局方式改變了傳統(tǒng)html+table的布局方式。我在網(wǎng)頁中大部分采用的就是DIV和CSS來構(gòu)建網(wǎng)頁的布局。第二步就是收集素材，在確定我的網(wǎng)頁分為兩個(gè)部分之后，其中一個(gè)部分是介紹自己的高中，另外一個(gè)部分是介紹自己的主頁。所以我分兩個(gè)步驟來收集資料，其中在介紹自己的高中的部分頁面上，我主要搜集的是高中學(xué)校的照片和相關(guān)文字介紹。在介紹自己的界面上，我主要分為音樂、視頻、文字、照片來全方位的展示。因?yàn)樯婕暗膬?nèi)容比較多，所以搜集的資料相對(duì)而言也比較多。第三步就是處理收集到的素材內(nèi)容。首先將照片、文字、音頻分門別類的處理，存儲(chǔ)在不同的文件夾中。對(duì)照片的處理，我們首先用到的就是Photoshop和Fireworks，可以調(diào)整圖片的大小以及背景顏色等等；對(duì)于flash文件的處理我們則用到了adobe flash進(jìn)行相關(guān)的處理制作，并對(duì)制作完成的.fla文件生成swf的動(dòng)畫存儲(chǔ)在站點(diǎn)文件夾之中。并對(duì)相關(guān)的素材進(jìn)行合理的命名，以待使用。第四步就是在構(gòu)建的網(wǎng)頁輪廓中添加文本、圖片以及相關(guān)的媒體資源。確定他們?cè)谡军c(diǎn)文件夾之中，以防止自己在別的機(jī)器上不能正確瀏覽自己制作出來的網(wǎng)頁。在這一步驟之中，相對(duì)較難的是導(dǎo)航的制作。因?yàn)槲也捎玫氖莡l、tl標(biāo)簽制作導(dǎo)航，所以在布局上要更加的謹(jǐn)慎小心。以防止界面溢出，所以要更加的小心，并在不同瀏覽器上進(jìn)行檢驗(yàn)，以防出錯(cuò)。第五步就是制作完成整個(gè)網(wǎng)頁之后，進(jìn)行適當(dāng)?shù)木?jiǎn)壓縮。把不要的圖片、音樂和視頻資源移出站點(diǎn)文件夾，使站點(diǎn)文件夾里面沒有不用的素材來減少站點(diǎn)所占用的空間大小。并且在制作完成整個(gè)網(wǎng)站之后，我們還要測(cè)試網(wǎng)頁里的鏈接是否出錯(cuò)。我采取的是比較繁瑣的辦法，就是在網(wǎng)頁中一個(gè)一個(gè)的試驗(yàn)鏈接是否為死鏈。假如碰到死鏈，就繼續(xù)在Dreamweaver中修改。然后再進(jìn)行測(cè)試，直到網(wǎng)頁中不出現(xiàn)明顯的死鏈錯(cuò)誤。這個(gè)時(shí)候，一個(gè)相關(guān)的網(wǎng)頁就制作完成了?？偨Y(jié)一下我的整個(gè)網(wǎng)頁的制作過程，其中最麻煩的就是遇到無法解決的問題，這個(gè)時(shí)候，只有主動(dòng)上網(wǎng)求救，或者到專業(yè)的論壇