動(dòng)漫網(wǎng)頁設(shè)計(jì)

摘要本論文主要論述了本人所做畢業(yè)設(shè)計(jì)課題《動(dòng)漫網(wǎng)頁制作》的技術(shù)背景，設(shè)計(jì)理念，概要設(shè)計(jì)，詳細(xì)設(shè)計(jì)以及最后效果展示等方面的內(nèi)容，通過網(wǎng)站系統(tǒng)工程建設(shè)思想突出網(wǎng)站建設(shè)框架概念。隨著時(shí)代的發(fā)展以及技術(shù)的進(jìn)步，互聯(lián)網(wǎng)在人們的生活中占比越來越多，人們的許多活動(dòng)因?yàn)橛辛嘶ヂ?lián)網(wǎng)而越發(fā)的便捷，其中包括有金融、娛樂、科研以及新聞等等。而隨著用戶的需求逐漸增加，越來越多的網(wǎng)站運(yùn)營而生，比如動(dòng)漫網(wǎng)頁，游戲網(wǎng)頁，電影網(wǎng)頁等等。而網(wǎng)站則是由一個(gè)個(gè)小小的網(wǎng)頁組合而成，沒有網(wǎng)頁就沒有強(qiáng)大的網(wǎng)站。目前雖然有許多形形色色的網(wǎng)頁，但是許多網(wǎng)頁的頁面不夠簡潔，太過于繁瑣，因此為了優(yōu)化各種用戶的使用我決定設(shè)計(jì)一個(gè)頁面簡潔，內(nèi)容充實(shí)的動(dòng)漫網(wǎng)頁頁面簡單操作方便的同時(shí)優(yōu)化用戶使用感受。因此我的目標(biāo)是做一個(gè)頁面簡潔，內(nèi)容充實(shí)的動(dòng)漫網(wǎng)頁。網(wǎng)頁實(shí)現(xiàn)的基本模塊有顯示新推出的動(dòng)漫和最近比較火的動(dòng)漫信息以及倍受喜愛的動(dòng)漫人物信息等等。動(dòng)漫愛好者們可以通過導(dǎo)航欄尋找自己喜歡的動(dòng)漫內(nèi)容。關(guān)鍵詞：動(dòng)漫網(wǎng)頁；2MySQL；3Dreamweaver；網(wǎng)頁制作

目錄TOC\o"1-2"\h\u31813摘要 一、前言隨著社會(huì)信息網(wǎng)絡(luò)化的發(fā)展，人們獲取信息的途徑越來越依賴與Intrenet。同時(shí)休閑娛樂方式也發(fā)生了巨大的改變，從之前的棋牌喝茶，到現(xiàn)在各種各樣的娛樂方式，每個(gè)人都有不一樣的休閑活動(dòng)，對于那種部分休息時(shí)間就像在家里看看電視的人來說，視頻、動(dòng)漫就成了不可或缺的一部分，以前只能從電視上來看視頻，翻來覆去的換臺(tái)也就那么幾個(gè)能看的節(jié)目，現(xiàn)在可不一樣了，現(xiàn)在的視頻光每個(gè)分類你就眼花繚亂，根本看不過來，所以在這個(gè)時(shí)代的發(fā)展下，各種各樣的視頻網(wǎng)站孕育而生，并且隨著互聯(lián)網(wǎng)的繼續(xù)發(fā)展網(wǎng)絡(luò)上的視頻種類越來越多，同時(shí)越來越多的視頻成為了VIP用戶的專屬，導(dǎo)致有些用戶感興趣的視頻無法在線觀看和瀏覽，同時(shí)隨著互聯(lián)網(wǎng)視頻的發(fā)展，動(dòng)漫的傳播越來越廣泛，能夠足不出戶在家看到各個(gè)國家的動(dòng)漫，動(dòng)漫網(wǎng)站運(yùn)營而生。而對于喜歡看動(dòng)漫的用戶群體來說動(dòng)漫網(wǎng)站則更容易獲得青睞。二、動(dòng)漫發(fā)展前景（一）發(fā)展前景根據(jù)中研網(wǎng)的分析2020年，我國動(dòng)漫產(chǎn)業(yè)產(chǎn)值已經(jīng)突破2000億元。這是一個(gè)什么概念？這標(biāo)志著動(dòng)漫行業(yè)正在以一個(gè)難以想象的速度飛快發(fā)展，推動(dòng)動(dòng)漫的發(fā)展的同時(shí)也能夠推動(dòng)國家的經(jīng)濟(jì)發(fā)展，根據(jù)中研網(wǎng)上獲取的資料從2009年開始國家每年都會(huì)進(jìn)行全國動(dòng)漫企業(yè)認(rèn)定工作，目前，全國共有924家國家認(rèn)定的動(dòng)漫企業(yè)，其中國家重點(diǎn)認(rèn)定的動(dòng)漫企業(yè)有43家。而且根據(jù)用戶群體的調(diào)查來看動(dòng)漫網(wǎng)站的用戶群體趨于年輕化多以95后與00后居多，隨著時(shí)間的推動(dòng)，動(dòng)漫的受眾群體將會(huì)越來越龐大，并且隨著用戶粘性的不斷增強(qiáng)，用戶的消費(fèi)潛力將進(jìn)一步的被挖掘，根據(jù)以上資料說明動(dòng)漫網(wǎng)站的發(fā)展前景十分良好。并且中國曾經(jīng)的水墨畫動(dòng)畫在全世界也是數(shù)一數(shù)二的，曾經(jīng)使得動(dòng)漫大國日本的動(dòng)漫作家宮崎駿來到中國取經(jīng)，并且水墨畫的經(jīng)典作品十分之多比如《小蝌蚪找媽媽》《大鬧天宮》《葫蘆兄弟》《神筆馬良》《黑貓警長》《天書奇譚》《阿凡提》《女媧補(bǔ)天》等等許多精彩的動(dòng)畫，但是隨著時(shí)間的流逝，以及國家技術(shù)的進(jìn)步，水墨動(dòng)畫越來越沉寂了，但是近幾年的國產(chǎn)動(dòng)畫也有了許多代表作品比如《大圣歸來》《姜子牙》《傭之城》《魁拔系列》《大魚海棠》《哪吒之魔童降世》等等，但是我也希望隨著動(dòng)漫的發(fā)展能夠讓中國曾經(jīng)的水墨動(dòng)畫重新回到大眾的視野。而且隨著國家對進(jìn)口影片配額限制的改動(dòng)，將會(huì)有越來越多的境外動(dòng)畫電影和國產(chǎn)動(dòng)畫電影同臺(tái)競技，這個(gè)舉動(dòng)能夠促進(jìn)國產(chǎn)動(dòng)畫電影技術(shù)水平及創(chuàng)新性的提升。因?yàn)橐陨系脑蛩晕沂挚春脛?dòng)漫網(wǎng)站的發(fā)展前景，因此想要制作一個(gè)理想的網(wǎng)頁。（二）目的我制作動(dòng)漫網(wǎng)頁的目的有三，之一是想讓更多的動(dòng)漫愛好者能夠免費(fèi)看動(dòng)漫，根據(jù)我對現(xiàn)在幾個(gè)有名的視頻網(wǎng)站的觀察，發(fā)現(xiàn)了現(xiàn)在的視頻網(wǎng)站很多類容都需要VIP才能觀看，而且有很多的廣告，我便想制作一個(gè)完全免費(fèi)并且沒有廣告的動(dòng)漫網(wǎng)頁，以便于更過的動(dòng)漫愛好者可以愉快的在互聯(lián)網(wǎng)上觀看自己喜歡的動(dòng)漫。之二試想要改變現(xiàn)在很多網(wǎng)站的繁瑣布局，因?yàn)楝F(xiàn)在很多視頻網(wǎng)站內(nèi)容過于復(fù)雜，對找尋自己感興趣的類型很不方便，所以想要改變這個(gè)設(shè)計(jì)讓頁面更加的簡單易懂，以此來達(dá)到自己想要改變?nèi)缃褚曨l網(wǎng)站繁瑣布局的目的。之三是想為中國的動(dòng)漫行業(yè)發(fā)展貢獻(xiàn)自己的一份微薄之力。因?yàn)楝F(xiàn)在的動(dòng)漫更加的多元化將更有意識(shí)創(chuàng)作面向全年齡觀眾的動(dòng)畫電影，同時(shí)兼顧低幼市場，使低齡向動(dòng)畫電影和成人向動(dòng)畫電影、合家歡向動(dòng)畫電影并駕齊驅(qū)，為創(chuàng)作者和觀影者都提供廣闊的空間，進(jìn)一步推動(dòng)電影市場的多元化。使我再電影市場多元化的進(jìn)程中出一份微薄的力量。同時(shí)我也希望能夠通過這次機(jī)會(huì)提升一下自己的網(wǎng)頁編寫水平，來為以后的工作打好基礎(chǔ)，并且這方面也是我所感興趣的，所以我十分開心能夠在自己力所能及的范圍內(nèi)為互聯(lián)網(wǎng)用戶建立一個(gè)免費(fèi)的動(dòng)漫網(wǎng)站。三、分析（一）用戶需求根據(jù)各大現(xiàn)有視頻網(wǎng)站的分析，新的網(wǎng)頁將配備登錄系統(tǒng)，用戶只需要點(diǎn)擊登錄，輸入自己的賬號(hào)密碼即可進(jìn)入自己的賬戶，系統(tǒng)會(huì)根據(jù)賬號(hào)的喜好推薦合適的動(dòng)漫登陸系統(tǒng)中還有觀看歷史功能，方便用戶查看自己的觀看記錄。同時(shí)配備了動(dòng)漫的推薦排行榜單，在榜單上的動(dòng)漫都是最近的大火動(dòng)漫，通過與用戶賬號(hào)之間的聯(lián)系，推薦的動(dòng)漫都是符合用戶喜好的，為不知道看什么的動(dòng)漫愛好者提供了更多的選擇性。在網(wǎng)頁的最右邊還配備了搜索功能，用戶只需要將自己想看的動(dòng)漫名稱輸入進(jìn)搜索欄中，再點(diǎn)擊搜索按鈕，頁面即可跳轉(zhuǎn)到用戶搜索的動(dòng)漫頁面去，省去了挨個(gè)查找的煩惱，為用戶的使用提供了便捷。并且設(shè)置了動(dòng)漫類容的分類選項(xiàng)，只需要點(diǎn)擊自己想看的分類，網(wǎng)頁便會(huì)跳轉(zhuǎn)到相應(yīng)的頁面，該頁面中的動(dòng)漫全是符合該分類的，可以篩選自己想看類型的動(dòng)漫，這樣就可以不用一頁一頁的去翻找自己想看的動(dòng)漫。同時(shí)該網(wǎng)站還具備下載選項(xiàng)，用戶在瀏覽過該動(dòng)漫后如果覺得喜歡便可點(diǎn)擊右方的下載按鈕將動(dòng)漫下載到自己的手機(jī)中，方便用戶們將喜歡的動(dòng)漫現(xiàn)在到手機(jī)中離線觀看，這樣在電梯中也能在動(dòng)漫的世界中暢游。在具備以上功能的情況下我想添加一個(gè)評論功能，用戶只需點(diǎn)擊評論便可看到其余用戶對該動(dòng)漫的評價(jià)來看見其余用戶對該動(dòng)漫的觀點(diǎn)，這樣的話動(dòng)漫愛好者就可以在觀看動(dòng)漫前了解到其他人對該動(dòng)漫的客觀評價(jià)。當(dāng)然，留言板功能必不可少，這個(gè)功能是加深動(dòng)漫愛好者之間溝通的最好方式，用戶只需要點(diǎn)擊留言板在留言板中輸入自己想要留下的話，比如對網(wǎng)站有哪些期望，網(wǎng)站哪些方面做得不好，需要了解那些動(dòng)漫資訊之類的，其余的用戶便能了解到該用戶的需求，并可以與其溝通，我們也能及時(shí)獲取用戶對于該網(wǎng)站的意見，并及時(shí)的維護(hù)網(wǎng)站，提高用戶的使用體驗(yàn)。而且網(wǎng)頁的布局我希望更加的簡潔，可以一眼看過去就知道自己想要的功能在什么位置，優(yōu)化了用戶的使用體驗(yàn)，而且簡潔的頁面也能給用戶帶來更好的使用感受，我希望我做的網(wǎng)頁是一個(gè)一眼看過去只有動(dòng)漫，沒有其他東西的網(wǎng)頁，這樣的網(wǎng)頁才是動(dòng)漫愛好這喜歡的網(wǎng)頁。用戶們需要的只是一個(gè)使用方便，頁面簡潔，能夠滿足日常所需，以及能夠隨時(shí)觀看與隨時(shí)交流的網(wǎng)站。（二）經(jīng)濟(jì)可行性根據(jù)動(dòng)漫對經(jīng)濟(jì)的影響發(fā)現(xiàn)，全球的動(dòng)漫產(chǎn)業(yè)本身就在增長并且在動(dòng)漫產(chǎn)業(yè)中動(dòng)畫電影市場對經(jīng)濟(jì)發(fā)展的貢獻(xiàn)最為矚目，近幾年上映的動(dòng)漫電影數(shù)量是一年比一年多，比如哆啦A夢系列、大偵探皮卡丘、瘋狂原始人2、哪吒之魔童降世、姜子牙等等動(dòng)漫，其中包括了徐國近幾年精彩的國產(chǎn)動(dòng)漫，但是更多的還是國外的動(dòng)漫電影。隨著國內(nèi)緊急的發(fā)展，動(dòng)漫市場也面臨這巨大的挑戰(zhàn)，隨著動(dòng)漫企業(yè)的增多，市場面臨著供不應(yīng)求，動(dòng)漫行業(yè)有進(jìn)一步洗牌的強(qiáng)烈可能，但好在一些動(dòng)漫細(xì)分市場仍然有較大的發(fā)展空間，信息化技術(shù)將成為核心競爭力！根據(jù)研究來看，在2017年，世界動(dòng)畫電影產(chǎn)業(yè)規(guī)模已經(jīng)達(dá)到2540億美元并持續(xù)保持增速，預(yù)計(jì)到2020年將達(dá)到2700億美元，產(chǎn)業(yè)各領(lǐng)域平均增速約為2%。除此之外，與動(dòng)漫產(chǎn)業(yè)緊密相關(guān)的國際IP授權(quán)產(chǎn)業(yè)發(fā)展增速不減。2017年世界授權(quán)產(chǎn)業(yè)規(guī)模達(dá)到2716億美元，同比增長3.3%。授權(quán)金規(guī)模達(dá)到145億美元，同比增長2.6%。亞洲、拉美等分別增長6.2%和7.6%，是增長最快的地區(qū)。中國近幾年的動(dòng)漫產(chǎn)業(yè)增長也是十分的迅速，與巴西和日本并列為增長最快的國家。經(jīng)過幾十年的發(fā)展，動(dòng)漫這個(gè)行業(yè)已經(jīng)成熟起來，然而真正靠動(dòng)漫賺錢的大頭其實(shí)是與動(dòng)漫相關(guān)的周邊、玩具、飾品、以及各種應(yīng)用之物等等，動(dòng)畫越火IP越大。國產(chǎn)動(dòng)畫品牌《熊出沒》已有成功案例，其衍生品年產(chǎn)值達(dá)25億元。據(jù)了解，“熊出沒”的衍生品現(xiàn)有3000多款，合作超過200多個(gè)授權(quán)商。隨著中國的信息發(fā)展，動(dòng)漫行業(yè)越發(fā)的受歡迎，并帶動(dòng)了與動(dòng)漫相關(guān)的眾多企業(yè)經(jīng)濟(jì)發(fā)展，同時(shí)也促進(jìn)了國家的經(jīng)濟(jì)。2017年，我國國內(nèi)動(dòng)漫產(chǎn)業(yè)產(chǎn)值已經(jīng)達(dá)到了1700億元人民幣，占國內(nèi)生產(chǎn)總值比重達(dá)到0.2%，預(yù)計(jì)到十三五末期，國內(nèi)動(dòng)漫產(chǎn)業(yè)產(chǎn)值要達(dá)到2500億元人民幣。并且以動(dòng)漫為主玩具，飾品以及相關(guān)周邊也有著十分龐大的經(jīng)濟(jì)市場，并且隨著用戶黏性的逐漸增強(qiáng)，用戶的消費(fèi)水平也會(huì)有所提高，所以推動(dòng)動(dòng)漫發(fā)展可以帶動(dòng)國家的經(jīng)濟(jì)發(fā)展，就經(jīng)濟(jì)可行性來說，制作動(dòng)漫網(wǎng)頁是可行的。（三）技術(shù)可行性在代碼編寫方面我選擇Dreamweaver8提供了功能全面的編碼環(huán)境，支持手工編寫HTML代碼，也提供可視化編輯功能快速地創(chuàng)建網(wǎng)頁，其強(qiáng)大的功能使用戶大大地提高了網(wǎng)頁制作的效率，而網(wǎng)頁的美化方面我將使用Photoshop這個(gè)軟件來美化網(wǎng)頁，Potoshop是一個(gè)擁有強(qiáng)大美化圖片功能的軟件，網(wǎng)頁的數(shù)據(jù)庫則使用MySQL，使其更加的符合我的設(shè)計(jì)初衷，來達(dá)到想要的效果。網(wǎng)頁的材料也可以在互聯(lián)網(wǎng)上查找。根據(jù)用戶需求分析我們可以得出，用戶在使用動(dòng)漫網(wǎng)頁時(shí)的主要目的是能夠在線或者離線觀看動(dòng)漫并且能夠與其他的動(dòng)漫愛好者相互交流溝通。因此主要實(shí)現(xiàn)功能為：顯示動(dòng)漫信息、能夠提供在線或離線觀看動(dòng)漫、留言本三個(gè)板塊。因此我選擇MySQL為存放信息的數(shù)據(jù)庫，因?yàn)镸ySQL使用的SQL語言是用于訪問數(shù)據(jù)庫最常用的標(biāo)準(zhǔn)化語言。而且MySQL使用簡單，操作方便，并且數(shù)據(jù)庫體積小、速度快、總體擁有成本低、開放源代碼等等，許多中小型的網(wǎng)站開發(fā)都會(huì)選擇MySQL作為網(wǎng)站數(shù)據(jù)庫。而且MySQL還有許多其他的優(yōu)點(diǎn)，比如：支持AIX、FreeBSD、HP-UX、Linux、MacOS、NovellNetware、OpenBSD、OS/2Wrap、Solaris、Windows等多種操作系統(tǒng)、提供TCP/IP、ODBC和JDBC等多種數(shù)據(jù)庫連接途徑等等，并且MySQL的數(shù)據(jù)庫處理功能也非常的強(qiáng)大，能夠處理擁有上千萬條記錄的大型數(shù)據(jù)庫，因此我選擇MySQL作為該網(wǎng)頁的數(shù)據(jù)庫。所以根據(jù)自己掌握的技術(shù)與材料而言，制作一個(gè)動(dòng)漫網(wǎng)頁是可行的，所以技術(shù)可行性與經(jīng)濟(jì)可行性都可行，網(wǎng)頁制作開始。四、網(wǎng)頁的建設(shè)流程（一）網(wǎng)頁是什么網(wǎng)頁是什么呢？網(wǎng)頁是構(gòu)成一個(gè)網(wǎng)站的基本元素，是承載各種網(wǎng)站應(yīng)用的平臺(tái)。同時(shí)網(wǎng)頁也是一個(gè)包含HTML標(biāo)簽的純文本文件，它可以存放在世界任何一個(gè)角落的計(jì)算機(jī)中，同樣也是萬維網(wǎng)中的一“頁”，是超文本標(biāo)記語言格式。是一個(gè)適用于萬維網(wǎng)和網(wǎng)頁瀏覽器的文件，它存放在世界某個(gè)角落的某一部或一組與互聯(lián)網(wǎng)相連的計(jì)算機(jī)中。html(超文本標(biāo)識(shí)語言)是web頁面的描述性語言，無論是在web上發(fā)布信息，或者是編寫可供交互的程序，都離不開html語言，可以說在網(wǎng)頁制作技術(shù)日新月異的今天，html語言是任何高級(jí)網(wǎng)頁制作技術(shù)的核心與基礎(chǔ)。網(wǎng)頁經(jīng)由網(wǎng)址(URL)來識(shí)別與訪問，當(dāng)我們在網(wǎng)頁瀏覽器輸入想要訪問的網(wǎng)址后，經(jīng)過一段復(fù)雜而又快速的程序，網(wǎng)頁文件會(huì)被傳送到用戶家的計(jì)算機(jī)，然后再通過瀏覽器解釋網(wǎng)頁的內(nèi)容，最后將網(wǎng)頁內(nèi)容清晰的展示給用戶。（二）前期策劃在制作網(wǎng)頁之前我前往各大現(xiàn)有動(dòng)漫網(wǎng)站獲取了很多相關(guān)的知識(shí)，并且根據(jù)現(xiàn)有的網(wǎng)站，同時(shí)我將許多如今網(wǎng)絡(luò)上大火的動(dòng)漫進(jìn)行整理，也在互聯(lián)網(wǎng)上查找了許多自己需要的素材。并且我將使用Dreamweaver、Html、MySQL、phtoshop等開發(fā)工具，Dreamweaver是創(chuàng)建專業(yè)網(wǎng)站的最佳工具，開發(fā)人員可以在一個(gè)開發(fā)環(huán)境下快速實(shí)現(xiàn)網(wǎng)站以及互聯(lián)網(wǎng)應(yīng)用程序的創(chuàng)建和管理。HTML，文檔的基本結(jié)構(gòu)，網(wǎng)頁中文本的處理方法，用來創(chuàng)建超鏈接、列表、框架、表格、表單等頁面元素的標(biāo)記，用來嵌入多媒體和腳本的標(biāo)記，CSS樣式的使用，以及DIV+CSS網(wǎng)頁布局方式。MySQL是一個(gè)存放信息的數(shù)據(jù)庫具備查詢、表、窗體、頁、宏、模塊、報(bào)表等功能。Phtoshop具有強(qiáng)大的圖像修飾功能，是一個(gè)圖片美化軟件，它可以用來制作、美化網(wǎng)頁的背景圖片，而且是可視化的操作，可以讓設(shè)計(jì)師更方便的進(jìn)行操作。（三）框架規(guī)劃、素材收集在框架方面我打算制作偏簡約，上方一個(gè)導(dǎo)航欄，導(dǎo)航欄的右上方是一個(gè)搜索功能，在導(dǎo)航欄的下方則是四個(gè)推薦動(dòng)漫的板塊，每一個(gè)板塊中都有許多熱門動(dòng)漫，在推薦板塊的右方則是動(dòng)漫的排行榜，用戶可以直截了當(dāng)?shù)目匆娮罱鼊?dòng)漫的排行，給用戶們提供了更多的選擇可能，目前的框架規(guī)劃就是如此。最上面一行是導(dǎo)航欄，下面的四個(gè)模塊是推薦的分類，然后左右邊的那一列是最近的動(dòng)漫排行，這種布局可以讓動(dòng)漫網(wǎng)友們一眼就看出最近比較火熱的動(dòng)漫以及上新的動(dòng)漫有哪些，也可以方便網(wǎng)友們自己選擇想看的動(dòng)漫類型，畫面布局顯得十分簡潔干凈。也能便于讓不知道看什么的用戶有所選擇，同時(shí)提供了動(dòng)漫的分類，讓用戶們可以直接點(diǎn)進(jìn)此分類的動(dòng)漫提高了用戶的使用體驗(yàn)。相關(guān)素材的整理主要是在互聯(lián)網(wǎng)上搜索自己所要的網(wǎng)頁信息，主要包括圖片、文字、動(dòng)漫相關(guān)的新聞、最近新推出的動(dòng)漫人物信息以及備受觀眾喜愛的動(dòng)漫信息等等。同時(shí)也去查詢相關(guān)的書籍，百度搜索動(dòng)畫的圖像資料。要想給瀏覽者帶來更好的使用體驗(yàn)就要盡可能多的收集相關(guān)資料，資料收集的越豐富之后制作網(wǎng)站就越容易，只有將資料收集的足夠完整才能讓網(wǎng)站更加的完善，這樣做出來的網(wǎng)站才能叫做一個(gè)好的網(wǎng)站。（四）網(wǎng)頁設(shè)計(jì)網(wǎng)站采用了Dreamewear的CSS樣式與div標(biāo)簽進(jìn)行主頁與副業(yè)的排版，通過運(yùn)用這個(gè)技術(shù)能夠清晰明了的看到網(wǎng)頁的各個(gè)布局。導(dǎo)航欄設(shè)計(jì)了七種熱門類型的漫畫分類板塊更加的便捷，使用戶能夠有更良好的使用體驗(yàn)，方便用戶直接進(jìn)入自己喜歡的分類進(jìn)行瀏覽，提高了用戶的使用效率。深(彩色版)深(彩色版)深(彩色版)深(彩色版)五、動(dòng)漫網(wǎng)頁制作（一）主頁規(guī)劃主頁的宗旨就是簡潔明了的將內(nèi)容完美的展現(xiàn)給瀏覽者，因此大部分內(nèi)容會(huì)被隱藏，而精華部分的內(nèi)容會(huì)被放在導(dǎo)航欄之下的四個(gè)推薦區(qū)域，導(dǎo)航欄使用div標(biāo)簽與CSS樣式進(jìn)行布局以達(dá)到理想布局效果，導(dǎo)航欄的幾大分類，用戶想選擇那種類型即可點(diǎn)擊進(jìn)去，頁面便會(huì)跳轉(zhuǎn)到相對應(yīng)分類的網(wǎng)頁，方便了用戶使用查找。如下圖圖5-1導(dǎo)航欄而推薦新番漫畫區(qū)域所推薦的的全是當(dāng)前比較火的新番動(dòng)漫，用戶可以直接點(diǎn)擊進(jìn)去便可觀看十分便捷。并且推薦漫畫下有該漫畫的分類，可以使用戶了解該動(dòng)漫是否是自己想要觀看的類型。如下圖圖5-2新番推薦區(qū)域還有登錄系統(tǒng)也放置在主頁，用戶進(jìn)入網(wǎng)頁后即可登錄自己的賬號(hào)觀看自己喜歡的類型動(dòng)漫。同時(shí)該賬號(hào)的歷史觀看記錄也會(huì)保存用戶之前看過的所有動(dòng)漫，方便用戶使用，提升了用戶的使用體驗(yàn)。最下方的則是留言板功能，用戶可以在這里留下自己的建議以及想了解的動(dòng)漫資訊，其他的用戶能夠看見留言板中的內(nèi)容，如果自己有興趣便可在留言板內(nèi)與其他用戶進(jìn)行溝通，同時(shí)通過留言板功能用戶的建議我們也能及時(shí)知悉并盡量完善。（二）副業(yè)規(guī)劃副頁宗旨則是詳細(xì)介紹此部動(dòng)漫的主要內(nèi)容，使其內(nèi)容簡潔明了，首先映入眼簾的便是該動(dòng)漫的名稱，在動(dòng)漫名稱下邊則是動(dòng)漫的內(nèi)容簡介以及該動(dòng)漫的分類，能夠讓用戶瞬間明白這部漫畫主要講了什么。如下圖圖5-3副頁規(guī)劃以及提供了該動(dòng)漫的集數(shù)供用戶選擇，在內(nèi)容介紹的下方便是該動(dòng)漫所有的集數(shù)，并且還有該動(dòng)漫的觀看記錄，可以看見用戶之前看到那一章節(jié)了，方便繼續(xù)之前的瀏覽，這樣也省去了許多查找之前記錄的時(shí)間，更加的人性化，優(yōu)化用戶使用體驗(yàn)。（三）網(wǎng)頁制作本次項(xiàng)目主要為了實(shí)現(xiàn)網(wǎng)頁的基礎(chǔ)功能，由搜索功能，用戶登錄功能，動(dòng)漫分類功能，動(dòng)漫推薦功能，動(dòng)漫熱度排行功能，留言板功能和上新動(dòng)漫推薦功能組成。首先使用Dreamewear建立一個(gè)網(wǎng)頁并創(chuàng)建大小為<h1>的標(biāo)題如圖圖5-4標(biāo)題代碼搜索框功能的實(shí)現(xiàn)，接著建立搜索框功能，搜索框用于搜索用戶需要尋找的動(dòng)漫，并將頁面跳轉(zhuǎn)至用戶搜索頁面，使用戶的使用更加的便捷。待搜索欄建立好后，選擇搜索欄代碼，點(diǎn)擊插入布局對象中的div標(biāo)簽，新建CSS規(guī)則并將其命名為navbar-header，并將規(guī)則定義為新建樣式表文件，確定后點(diǎn)擊保存，接著輸入自己想要的規(guī)格即可如下圖圖5-5搜索欄代碼導(dǎo)航欄的實(shí)現(xiàn)，為了讓頁面更加的簡潔并且為了讓用戶有良好的使用體驗(yàn)，在建立完搜索框后繼續(xù)建立該網(wǎng)頁的導(dǎo)航欄，導(dǎo)航欄功能用于對動(dòng)漫進(jìn)行分類，并優(yōu)化用戶使用體驗(yàn)，需要看什么類型直接點(diǎn)擊進(jìn)去即可。首先插入該動(dòng)漫分類的超鏈接并將每個(gè)導(dǎo)航欄按照該鏈接的分類進(jìn)行命名。接下來創(chuàng)建div標(biāo)簽，并將CSS樣式表命名為navbar-primary，如下圖所示圖5-6導(dǎo)航欄實(shí)現(xiàn)代碼新番推薦區(qū)域的實(shí)現(xiàn)，新番推薦區(qū)為想看動(dòng)漫但不知看什么的用戶提供了更加方便的選擇，并且在推薦區(qū)域中能夠一眼看出該推薦動(dòng)漫的所屬類型。首先將新番推薦四個(gè)詞插入為超鏈接，大小設(shè)置為<h3>并新建CSS樣式表，插入div標(biāo)簽為panel-headingclearfix。推薦漫畫區(qū)域的動(dòng)漫名稱設(shè)置大小為<h5>并插入該動(dòng)漫的超鏈接，并用div標(biāo)簽video-info依次對其進(jìn)行布局。而推薦漫畫下方的分類則使用推薦動(dòng)漫下面的標(biāo)簽使用<ahref="/type2/%E6%80%AA%E7%89%A9hits.html">怪物來達(dá)成。依次設(shè)置完后全選該分類插入另一個(gè)標(biāo)簽u1.thumbnail-groupclearfix如下圖圖5-7新番推薦區(qū)域如圖，在新番推薦區(qū)域建立完成后，接下來便是創(chuàng)建漫畫熱度排名板塊，熱度排名板塊能夠讓用戶直觀的發(fā)現(xiàn)最近的火熱動(dòng)漫，為不知看什么的用戶提供了選擇。熱度排名板塊的實(shí)現(xiàn)同樣先創(chuàng)建一個(gè)div標(biāo)簽與CSS樣式表panel-aside與u1.rank-groupclearfix，并挨個(gè)插入<li>標(biāo)簽與<span>標(biāo)簽，并創(chuàng)建該排名動(dòng)漫的超鏈接，如下圖所示圖5-9熱度排行板塊代碼（四）網(wǎng)頁測試將編寫好的網(wǎng)頁保存至桌面后，雙擊打開測試：通過測試發(fā)現(xiàn)網(wǎng)頁的布局以及有些功能并沒有沒有達(dá)到自己理想中的效果，原本預(yù)估橫向分類的導(dǎo)航欄變成了豎著的，推薦在導(dǎo)航欄下面的幾大板塊雖然做了出來但是全部都跑到了網(wǎng)頁的最左邊，毫無排版可言。網(wǎng)頁的登錄系統(tǒng)以及留言板功能也并沒有做出來，好在搜索功能成功的做了出來，這也算沒有完全失敗吧。目前自己掌握的技術(shù)沒有達(dá)到制作自己理想的登錄頁面，這方面后續(xù)會(huì)加強(qiáng)自己對網(wǎng)頁布局、登錄功能的完善、留言板功能的練習(xí)，爭取早日達(dá)到自己的理想布局。

結(jié)束語通過這次網(wǎng)頁設(shè)計(jì)，激發(fā)了我對于網(wǎng)頁制作的學(xué)習(xí)興趣，能夠調(diào)動(dòng)我的學(xué)習(xí)自覺性，提供了自己動(dòng)腦、動(dòng)手能力，也教會(huì)了我運(yùn)用網(wǎng)絡(luò)資源。結(jié)合教材以及老師的指導(dǎo)創(chuàng)作出了具有個(gè)人風(fēng)格、個(gè)性的網(wǎng)頁?？偟膩碚f，整個(gè)大學(xué)的學(xué)習(xí)過程讓我學(xué)會(huì)了很多知識(shí)，在網(wǎng)頁設(shè)計(jì)的這幾天時(shí)間中，充分利用這次的設(shè)計(jì)機(jī)會(huì)，全身心的投入到了網(wǎng)頁的世界里去，去不斷地學(xué)習(xí)，去探索，同時(shí)也去不斷的充實(shí)和完善自我，在網(wǎng)絡(luò)的世界里逐漸美化自己的人生！同時(shí)也檢驗(yàn)了我這幾年來學(xué)習(xí)的理論和專業(yè)知識(shí)的成果。讓我了解了真正開發(fā)一個(gè)網(wǎng)站需要具備的知識(shí)和能力，并且經(jīng)驗(yàn)的積累對于開發(fā)行業(yè)來說也是十分重要的。在開始設(shè)計(jì)網(wǎng)頁之