隨著移動(dòng)互聯(lián)網(wǎng)的發(fā)展,市面上的移動(dòng)終端種類(lèi)越來(lái)越多,為了讓學(xué)校的網(wǎng)頁(yè)適應(yīng)各種新媒體移動(dòng)終端,加強(qiáng)網(wǎng)頁(yè)信息化建設(shè),論文研究Web UI（Website User Interface）相關(guān)技術(shù),將其應(yīng)用在我校數(shù)字圖書(shū)館等網(wǎng)站建設(shè)上,為我校信息化建設(shè)出力。Web UI又稱(chēng)網(wǎng)頁(yè)產(chǎn)品頁(yè)面設(shè)計(jì),核心是通過(guò)給用戶提供一個(gè)高分辨率自適應(yīng)的響應(yīng)式頁(yè)面來(lái)提升網(wǎng)頁(yè)的用戶體驗(yàn)。早期,采用常見(jiàn)的顯示終端各自配置一套網(wǎng)頁(yè)樣式的方式來(lái)實(shí)現(xiàn)響應(yīng)式網(wǎng)頁(yè),這種方式不僅工作量巨大,而且適配能力有限。隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展,Web UI的發(fā)展趨勢(shì)越發(fā)的標(biāo)準(zhǔn)化、組件化,出現(xiàn)了各種響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)框架和開(kāi)源的矢量圖標(biāo)庫(kù),使用它們能敏捷地開(kāi)發(fā)出自適應(yīng)各種移動(dòng)終端的響應(yīng)式的網(wǎng)頁(yè)。本文選擇當(dāng)前流行的Bootstrap框架、開(kāi)源字體矢量圖標(biāo)庫(kù)Font Awesome并結(jié)合HTML5+CSS3+Javascript等技術(shù),研究實(shí)現(xiàn)網(wǎng)頁(yè)的響應(yīng)式設(shè)計(jì)方案。將研究成果應(yīng)用在學(xué)校數(shù)字圖書(shū)館網(wǎng)頁(yè)的響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)上,使其能靈敏的適應(yīng)不同屏幕的大小的移動(dòng)終端,從而提升用戶的瀏覽網(wǎng)頁(yè)的觀看體驗(yàn)。在Web UI的研究的實(shí)踐中發(fā)現(xiàn),現(xiàn)有的開(kāi)源的矢量字體圖標(biāo),僅支... 

【文章頁(yè)數(shù)】：94 頁(yè)

【學(xué)位級(jí)別】：碩士

【文章目錄】：
摘要
abstract
第1 章緒論
    1.1 選題背景與意義
    1.2 研究現(xiàn)狀
        1.2.1 Web UI發(fā)展現(xiàn)狀
            1.2.1.1 Web1.0 時(shí)期的傳統(tǒng)Web UI
            1.2.1.2 Web 2.0 的Web UI
            1.2.1.3 Web3.0 的Web UI
        1.2.2 響應(yīng)式Web的研究現(xiàn)狀
        1.2.3 矢量圖標(biāo)的研究現(xiàn)狀
    1.3 研究?jī)?nèi)容與目的
    1.4 論文組織結(jié)構(gòu)
第2章 響應(yīng)式設(shè)計(jì)技術(shù)綜述
    2.1 HTML5
        2.1.1 HTML5主要特點(diǎn)
    2.2 CSS3
        2.2.1 CSS3的發(fā)展
        2.2.2 CSS3主要特點(diǎn)
    2.3 響應(yīng)式布局
        2.3.1 基本原理
        2.3.2 Bootstrap框架
            2.3.2.1 Bootstrap主要特色
            2.3.2.2 Bootstrap主要組件
    2.4 Font Awesome矢量圖標(biāo)庫(kù)
        2.4.1 Font Awesome圖標(biāo)的使用
第3章 自定義矢量圖標(biāo)庫(kù)工具技術(shù)綜述
    3.1 矢量圖標(biāo)相關(guān)技術(shù)
        3.1.1 SVG矢量圖標(biāo)
        3.1.2 SVG Sprite雪碧圖
    3.2 Java Script和Ajax
        3.2.1 Javascript
        3.2.2 Ajax
    3.3 Web服務(wù)端技術(shù)
        3.3.1 Node.js
        3.3.2 Express框架
第4章 響應(yīng)式設(shè)計(jì)在圖書(shū)館網(wǎng)站的應(yīng)用
    4.1 需求分析
    4.2 響應(yīng)式網(wǎng)頁(yè)的設(shè)計(jì)與實(shí)現(xiàn)
        4.2.1 響應(yīng)式柵格布局
        4.2.2 響應(yīng)式圖片
        4.2.3 矢量字體圖標(biāo)
    4.3 成果展示
第5章 自定義矢量圖標(biāo)庫(kù)研究與實(shí)現(xiàn)
    5.1 需求分析
        5.1.1 功能需求
        5.1.2 非功能需求
    5.2 總體設(shè)計(jì)
    5.3 開(kāi)發(fā)部署及使用環(huán)境
    5.4 設(shè)計(jì)與實(shí)現(xiàn)
        5.4.1 圖庫(kù)上傳模塊
        5.4.2 圖庫(kù)編輯模塊
            5.4.2.1 圖標(biāo)壓縮
            5.4.2.2 圖庫(kù)編輯
            5.4.2.3 合成圖標(biāo)
        5.4.3 圖庫(kù)下載模塊
    5.5 使用說(shuō)明
第6章 總結(jié)
    6.1 主要工作
    6.2 創(chuàng)新點(diǎn)
    6.3 不足與展望
致謝
參考文獻(xiàn)
附錄


【參考文獻(xiàn)】：
期刊論文
[1]利用Node.js開(kāi)發(fā)前后端分離的系統(tǒng)——以圖書(shū)館地方文獻(xiàn)系統(tǒng)為例[J]. 劉紅衛(wèi).  天津科技. 2018(07)
[2]基于HTML 5+CSS3+jQuery的響應(yīng)式布局網(wǎng)頁(yè)設(shè)計(jì)[J]. 葉潮流,馬林山.  梧州學(xué)院學(xué)報(bào). 2018(03)
[3]Bootstrap框架在響應(yīng)式Web設(shè)計(jì)中的應(yīng)用[J]. 周萍,趙娜,李慕.  軟件導(dǎo)刊. 2017(06)
[4]基于手機(jī)微信的實(shí)驗(yàn)教學(xué)網(wǎng)站[J]. 應(yīng)繼明,管正華,余康遠(yuǎn),項(xiàng)紫晴,張航濤.  網(wǎng)絡(luò)安全技術(shù)與應(yīng)用. 2017(06)
[5]SVG在圖形圖像中的應(yīng)用分析[J]. 王付陽(yáng).  福建電腦. 2016(02)
[6]Web應(yīng)用性能提升優(yōu)化的技術(shù)框架探討[J]. 林秀.  電信快報(bào). 2014(04)

碩士論文
[1]基于Node.js和WebSocket的即時(shí)通信系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[D]. 茆玉庭.南京郵電大學(xué) 2018
[2]基于HTML5和Node.js的高校教學(xué)輔助系統(tǒng)研究與實(shí)現(xiàn)[D]. 張樹(shù)棟.山東師范大學(xué) 2018
[3]在線客服系統(tǒng)的前端設(shè)計(jì)與實(shí)現(xiàn)[D]. 林紫祥.南京大學(xué) 2018
[4]基于響應(yīng)式網(wǎng)頁(yè)技術(shù)的圖書(shū)館管理系統(tǒng)[D]. 朱曉.上海師范大學(xué) 2018
[5]Web頁(yè)面中的大規(guī)模數(shù)據(jù)折線圖優(yōu)化方法研究[D]. 楊婷.浙江大學(xué) 2017
[6]基于MVVM的前端框架MTCG的設(shè)計(jì)與實(shí)現(xiàn)[D]. 于晶晶.天津大學(xué) 2017
[7]基于Android系統(tǒng)的移動(dòng)GIS技術(shù)應(yīng)用研究與開(kāi)發(fā)[D]. 張廣輝.華北電力大學(xué)(北京) 2017
[8]基于HTML5技術(shù)的企業(yè)增效管控系統(tǒng)的研究與應(yīng)用[D]. 劉藝卓.華北電力大學(xué) 2016
[9]基于網(wǎng)絡(luò)的絲綢圖案創(chuàng)意系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[D]. 鄭楓.浙江大學(xué) 2016
[10]Android App快速開(kāi)發(fā)平臺(tái)設(shè)計(jì)與實(shí)現(xiàn)[D]. 于珊.西安電子科技大學(xué) 2015



本文編號(hào)：3667282