淺析響應(yīng)式網(wǎng)頁的設(shè)計與開發(fā)以計算機信息工程系網(wǎng)站為例-開題報告

《淺析響應(yīng)式網(wǎng)頁的設(shè)計與開發(fā)以計算機信息工程系網(wǎng)站為例-開題報告》由會員分享，可在線閱讀，更多相關(guān)《淺析響應(yīng)式網(wǎng)頁的設(shè)計與開發(fā)以計算機信息工程系網(wǎng)站為例-開題報告（8頁珍藏版）》請在裝配圖網(wǎng)上搜索。

畢業(yè)論文(設(shè)計)開題報告(由學(xué)生填寫)學(xué)生姓名 專業(yè) 計算機科學(xué)與 技術(shù) 班級 擬選題目 淺析響應(yīng)式網(wǎng)頁的設(shè)計與開發(fā)——以計算機信息工程系網(wǎng)站為例選題依據(jù)及研究意義一、選題依據(jù)信息時代正在飛速的發(fā)展，互聯(lián)網(wǎng)已經(jīng)融入到人們的生活，更是逐漸成為了人們生活中必不可少的一部分。如今，市場上出現(xiàn)了越來越多形狀、尺寸各異的移動設(shè)備，互聯(lián)網(wǎng)能像出現(xiàn)在你的臥室、書房、餐廳一樣，方便的出現(xiàn)在你的口袋、錢包里。隨著這些設(shè)備的興起，網(wǎng)站建設(shè)也隨之發(fā)生著轉(zhuǎn)變。響應(yīng)式 Web 設(shè)計由此綻放異彩。響應(yīng)式 Web 設(shè)計可構(gòu)造出在各種設(shè)備上都能正常工作的網(wǎng)站，并根據(jù)設(shè)備對布局進行功能和特征的調(diào)整。以前，為滿足移動用戶的需求，設(shè)計人員需要額外建立一個專門為移動設(shè)備設(shè)計的網(wǎng)站，更有的還為平板電腦建立了第三個網(wǎng)站。幸好，響應(yīng)式 Web設(shè)計能構(gòu)建一個既可運行在現(xiàn)在的設(shè)備，也可運行在未來的設(shè)備上的網(wǎng)站。更給力的是，可以讓它在較小、較大的屏幕以及介于兩者之間的屏幕上顯示不同的效果。采用響應(yīng)式 Web 設(shè)計方法，網(wǎng)站的布局可以根據(jù)不同的查看環(huán)境進行改變，對于更大的瀏覽器窗口，則有另外一些 CSS 規(guī)則控制相應(yīng)的布局。響應(yīng)式 Web 設(shè)計能鞏固自己的地位，并得以掀起一股網(wǎng)頁設(shè)計新標準的浪潮，從而變得日益重要是為什么呢？原因有以下幾點：1． 能兼容各種設(shè)備，而非使用傳統(tǒng)方式將用戶跳轉(zhuǎn)至設(shè)備專用網(wǎng)站。2． 無需在網(wǎng)站上設(shè)置跳轉(zhuǎn)，提高了轉(zhuǎn)換率和銷量。3． 具有提升搜索引擎排名的效果。4． 實現(xiàn)一站多用的效果，從而達到節(jié)省開發(fā)投入。5． 它配有優(yōu)化的分析程序，可處理響應(yīng)式報告并對應(yīng)多臺設(shè)備，將其分析及整合。6． 需要管理的內(nèi)容少，節(jié)省管理投入。7． 提升離線用戶體驗，管理員可抽出更多時間精力為不同設(shè)備的各種用戶提供更優(yōu)質(zhì)的服務(wù)。二、研究意義對于院系來說，建立自己的網(wǎng)站也有很多好處：1.有利于打造計算機信息工程系形象2.有利于推送豐富的院資訊信息3.有利于加強院系與用戶之間交互溝通，使用戶更加信任院系4.有利于豐富學(xué)校的院系文化而且，計算機信息工程系建立網(wǎng)站，有效地開發(fā)各種院系內(nèi)的信息與應(yīng)用資源，使院系的各種信息與應(yīng)用服務(wù)資源都將得到統(tǒng)一的跟蹤和整理，并經(jīng)過相應(yīng)的過濾和調(diào)整，使院系的建設(shè)更有效的開展。同時，計算機信息工程系建立網(wǎng)站使用戶通過網(wǎng)站首頁，學(xué)院簡介，院系內(nèi)部的工作指派，讓用戶清楚的了解到院系的各種工作情況，更可以吸引用戶，牽引用戶，便于院系的工作開展和社會推廣。再者，針對移動設(shè)備數(shù)量的不斷壯大，打造響應(yīng)式網(wǎng)站更新網(wǎng)頁布局，能夠盡可能的多增加和貼近用戶，響應(yīng)式 Web 布局在未來的網(wǎng)頁設(shè)計里將占有舉足輕重的位置。（1） 響應(yīng)式網(wǎng)頁可以避免重復(fù)的內(nèi)容發(fā)布，只需維護一個網(wǎng)站的后臺就行。（2） 現(xiàn)如今，移動設(shè)備用戶的數(shù)量已在 2014 年遠超電腦端用戶數(shù)量。（3） 響應(yīng)式 Web 設(shè)計能保持網(wǎng)頁原有的鏈接形式。（4） 這種設(shè)計沒有網(wǎng)頁版本的區(qū)分，實施 SEO 操作可以保持一致性。（5） 打開設(shè)備的大量出現(xiàn)，但用戶體驗不會降低，反而提升。（6） 一些大型瀏覽器（如谷歌）也鼓勵使用這種設(shè)計，網(wǎng)頁版本具有相同的HTML 和內(nèi)容，對于搜索引擎來說很好處理。（7） 一個企業(yè)不能正常顯示自己的網(wǎng)頁，只會給企業(yè)帶來眾多負面影響，也讓用戶對其留下不好的印象。響應(yīng)式網(wǎng)頁能夠滿足各種類型的移動設(shè)備的需求，能盡可能給所以終端客戶帶去最優(yōu)的訪問體驗。雖說如今也有專為平板電腦和手機打造的網(wǎng)頁，它們也能滿足客戶的訪問需求，但根據(jù)調(diào)查數(shù)據(jù)顯示，常用的移動終端有 230 多種不同的屏幕尺寸，我們不可能為每一種屏幕尺寸都設(shè)計一款相對應(yīng)的網(wǎng)頁，所以，響應(yīng)式網(wǎng)頁設(shè)計此時便體現(xiàn)出了其最有力的價值。選題研究現(xiàn)狀網(wǎng)站發(fā)展的現(xiàn)狀：至今為止，響應(yīng)式網(wǎng)頁設(shè)計還在被廣大設(shè)計師所推崇。這個掀起了網(wǎng)頁設(shè)計新標準浪潮的事物，在近幾年里，一次又一次的鞏固著自己的地位。隨著互聯(lián)網(wǎng)的迅速發(fā)展，網(wǎng)絡(luò)逐漸成為人們獲得信息和生活交流的一種重要方式。越來越多的人從用電腦查看新聞、瀏覽網(wǎng)頁、購買商品等行為轉(zhuǎn)變?yōu)槭褂秒S身攜帶的手機或平板電腦。這種情況出現(xiàn)后便需要網(wǎng)站自動切換適應(yīng)性的分辨率、圖像大小和腳本，響應(yīng)式網(wǎng)頁設(shè)計便能順利的解決這個問題。響應(yīng)式網(wǎng)頁發(fā)展現(xiàn)狀，下面從以下幾點闡述：（1） 響應(yīng)式網(wǎng)頁設(shè)計做了什么？它可以自動識別屏幕尺寸，從而調(diào)整出適合的網(wǎng)頁。網(wǎng)頁設(shè)計中強調(diào)模塊化，模塊化的設(shè)計要求模塊能夠“可拓展，無浸染” ，從而使得網(wǎng)頁在任何地方都能正常的顯示。響應(yīng)式網(wǎng)頁設(shè)計就是網(wǎng)頁在任何設(shè)備中都能正常適應(yīng)，而無需每一個設(shè)備都單獨拎出來做一個子網(wǎng)站。（2） 響應(yīng)式網(wǎng)頁設(shè)計解決了什么？它避免了重復(fù)內(nèi)容的發(fā)布，使得人們只需專心維護一個網(wǎng)站后臺即可，省時省力。同時，響應(yīng)式網(wǎng)頁設(shè)計沒有網(wǎng)頁版本之分，讓工作人員實施 SEO操作可以保持一致性。隨著用戶使用的移動設(shè)備數(shù)量不斷增多，響應(yīng)式網(wǎng)頁設(shè)計的要求也不斷趨于人性化，簡約化，也讓越來越多用戶使用其擁有的設(shè)備越來越方便。（3） 響應(yīng)式網(wǎng)頁設(shè)計還面臨著哪些難題？雖然響應(yīng)式網(wǎng)頁設(shè)計帶給人們諸多方便，它也具有一定的使用優(yōu)勢，但所謂事無絕對，響應(yīng)式網(wǎng)頁設(shè)計還是有它解決不了的難題。首先，它的一個致命傷在對 IE 的老版本支持不是很好，特別是老版 IE6?，F(xiàn)在很多用戶還在使用 IE6，若堅持使用響應(yīng)式網(wǎng)頁設(shè)計，那就不適合特定的網(wǎng)頁推廣了。再者，一些游戲、視頻網(wǎng)頁只能在 PC 端上打開。國內(nèi)有一些用戶提出，迪士尼公司網(wǎng)站上有很多網(wǎng)頁游戲，它能在 PC 端上玩，但卻不能在移動設(shè)備上使用，因此，也不能一味地選擇使用響應(yīng)式網(wǎng)頁設(shè)計方案，或許有時使用了也沒有太大意義，只會費時費力。研究內(nèi)容（包括基本思路、框架、主要研究方式、方法等）1、基本思路：通過查找資料，了解建立響應(yīng)式網(wǎng)頁的作用及特點。根據(jù)用戶的具體體驗和用戶所使用的移動設(shè)備，使得做出的頁面有能力去自動響應(yīng)用戶的設(shè)備環(huán)境。響應(yīng)式頁面開發(fā)的關(guān)鍵技術(shù)有幾方面，包括媒體查詢、流式布局、彈性圖片等。面對不斷發(fā)展的瀏覽器和上網(wǎng)設(shè)備，尋找一種可行的解決方案。它不需要服務(wù)器端，結(jié)合HTML、CSS、jQuery 等網(wǎng)頁開發(fā)技術(shù)就能達到良好的用戶體驗。采用 HTML5+CSS3 的響應(yīng)式頁面設(shè)計，可以兼容多種設(shè)備和屏幕。2、框架：1、響應(yīng)式網(wǎng)頁前端設(shè)計的基本概述2、響應(yīng)式網(wǎng)頁的優(yōu)勢分析3、響應(yīng)式網(wǎng)頁前端設(shè)計在需求、功能、風(fēng)格四個方面的分析4、可能遇到的問題和解決思路5、網(wǎng)頁的效果展示6、網(wǎng)站測試三、主要研究方式和方法：1.查詢相關(guān)資料，了解本次課題的研究意義?？梢陨暇W(wǎng)搜索或者是去圖書館查閱相關(guān)資料。 2.通過查詢資料了解該系統(tǒng)的需求，以及需要哪些東西。 3.設(shè)計出大體上的功能結(jié)構(gòu)。 4.通過進一步的了解，對每個網(wǎng)頁模塊進行細化，將每一步都想清楚。制定出每一步的做法和注意的地方。 5.對設(shè)計好的網(wǎng)頁進行調(diào)試，通過調(diào)試發(fā)現(xiàn)存在的問題并解決，從而達到完善系統(tǒng)的目的。 6.最后，整理各階段的設(shè)計記錄文檔，寫成論文稿。論文提綱(含論文選題、論文主體框架)論文題目：淺析響應(yīng)式網(wǎng)頁的設(shè)計與開發(fā)——以計算機信息工程系網(wǎng)站為例第 1 章 引言1.1 響應(yīng)式網(wǎng)頁前端發(fā)展現(xiàn)狀1.2 計算機信息工程學(xué)院的介紹1.3 計算機信息工程學(xué)院網(wǎng)站前端設(shè)計的需求分析1.4 響應(yīng)式網(wǎng)頁在計算機信息工程學(xué)院網(wǎng)站中的應(yīng)用第 2 章 網(wǎng)站前端開發(fā)系統(tǒng)設(shè)計2.1 網(wǎng)站目標2.2 網(wǎng)站功能結(jié)構(gòu)2.3 開發(fā)環(huán)境2.4 網(wǎng)站質(zhì)量需求第 3 章 制作網(wǎng)站的語言介紹3.1 Dreamweaver 網(wǎng)站編織 3.2 DIV+CSS 樣式表3.3 Jquery3.4 圖像、圖形設(shè)計 Photoshop 及 Illustartor第 4 章 院系網(wǎng)站的規(guī)劃與設(shè)計4.1 院系網(wǎng)站的功能設(shè)計4.2 院系網(wǎng)站的風(fēng)格設(shè)計4.3 院系網(wǎng)站的首頁設(shè)計4.4 院系網(wǎng)站的其他頁設(shè)計第 5 章 計算機信息工程學(xué)院網(wǎng)站的效果展示5.1 首頁展示效果5.2 其他頁面的效果展示第 6 章 網(wǎng)站的測試第 7 章 總結(jié)參考文獻致 謝主要參閱文獻[1]劉智惠，薛晶晶，盧倩蕓.面向不同設(shè)備的響應(yīng)式網(wǎng)頁設(shè)計——Web 移動圖書館[J].現(xiàn)代圖書情報技術(shù),2014(11).[2]譚富盛.校園網(wǎng)站的設(shè)計與開發(fā)[J].新課程學(xué)習(xí)(下),2012(07).[3]張利平.色彩情感特征與網(wǎng)站色彩定位[J].美術(shù)教育研究,2014(10).[4]國蘭.高校網(wǎng)站界面設(shè)計中的色彩應(yīng)用研究[D].東北林業(yè)大學(xué),2012.[5]孫小英.網(wǎng)頁設(shè)計中 CSS 樣式的應(yīng)用分析[J].軟件工程師,2013(12).[6]陳鳳芹.Dreamweaver 網(wǎng)頁設(shè)計與制作教學(xué)探討[J].中國教育技術(shù)裝備,2012.[7]楊彬.淺談響應(yīng)式網(wǎng)頁設(shè)計[J].遼寧行政學(xué)院學(xué)報,2014(05).[8]王愉，潘明明.響應(yīng)式網(wǎng)頁設(shè)計初探[J].北京印刷學(xué)院學(xué)報,2014(03).[9]唐駿開.HTML5 移動 Web 開發(fā)指南[M].北京電子工業(yè)出版社,2012.[10]韓紹鑫.基于 Dreamweaver 的網(wǎng)站設(shè)計與規(guī)劃[J].數(shù)字技術(shù)與應(yīng)用,2013(04).[11]龍奇.新一代網(wǎng)絡(luò)技術(shù)標準 HTML5 的研究[J].科技信息,2011(10).研究進程安排(包括提綱、一稿、二稿、定稿起訖時間)1、2016 年 7 月 12 日前，確定論文題目，并找指導(dǎo)老師進行溝通、協(xié)商、調(diào)整；2、2016 年 7 月 12 日前，下達任務(wù)書；3、2016 年 9 月 30 日前，搜索大量資料，進行閱讀整理，歸納總結(jié)，完成論文綜述和開題報告；4、2016 年 11 月 30 日前，整理相關(guān)資料，進行論文第一稿的撰寫，并及時與指導(dǎo)老師聯(lián)系，修改并完成第一稿；5、2017 年 1 月 15 日前，交論文二稿；6、2017 年 3 月 11 日前，交論文三稿；7、2017 年 4 月 8 日前，論文定稿、論文檢測報；其它說明指導(dǎo)教師是否同意開題簽名:年 月 日院（系）教學(xué)負責人簽署簽名:年 月 日