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