動漫網頁設計_第1頁
動漫網頁設計_第2頁
動漫網頁設計_第3頁
動漫網頁設計_第4頁
動漫網頁設計_第5頁
已閱讀5頁,還剩10頁未讀 繼續免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

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

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

結束語通過這次網頁設計,激發了我對于網頁制作的學習興趣,能夠調動我的學習自覺性,提供了自己動腦、動手能力,也教會了我運用網絡資源。結合教材以及老師的指導創作出了具有個人風格、個性的網頁。總的來說,整個大學的學習過程讓我學會了很多知識,在網頁設計的這幾天時間中,充分利用這次的設計機會,全身心的投入到了網頁的世界里去,去不斷地學習,去探索,同時也去不斷的充實和完善自我,在網絡的世界里逐漸美化自己的人生!同時也檢驗了我這幾年來學習的理論和專業知識的成果。讓我了解了真正開發一個網站需要具備的知識和能力,并且經驗的積累對于開發行業來說也是十分重要的。在開始設計網頁之

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網頁內容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間,僅對用戶上傳內容的表現方式做保護處理,對用戶上傳分享的文檔內容本身不做任何修改或編輯,并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容,請與我們聯系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論