響應式網站Web設計的(of)特點，開發應用(use)及優勢

基于(At)移動終端搜索引擎，開發響應式網頁，來(Come)适應各種尺寸移動終端設備訪問或獲取檔案信息資源。目前檔案館缺乏在(exist)移動終端中，基于(At)搜索引擎的(of)檔案信息移動服務方式以(by)及實現的(of)具體方法。爲(for)此筆者提出(out)開發響應式Web設計來(Come)解決這(this)一(one)問題。

1檔案移動信息服務的(of)主要(want)方式及面臨的(of)問題

1.1檔案移動信息服務的(of)主要(want)方式。檔案移動信息服務方式主要(want)經曆了(Got it)短信、WAP、APP、微平台幾個(indivual)階段。微平台指微信、微博、社交網站等社交平台。因微信、微博普及面更廣、使用(use)持續度高，所以(by)主要(want)論述這(this)兩種服務。現行階段基本是(yes)多種方式同時(hour)運行。國(country)内檔案移動信息服務興起于(At)2002年左右，開始探索基于(At)GPRS的(of)移動信息服務，2006年後進入集中發展時(hour)期。韓義義（2006）報道貴州省檔案館宣布可通過短信查詢檔案和(and)現行文件目錄業務，成爲(for)首個(indivual)通過短信提供檔案服務的(of)檔案館。瞿英和(and)王曉鳳（2007）依據國(country)内缺乏針對檔案系統的(of)WAP應用(use)的(of)現狀，對基于(At)WAP的(of)高校綜合檔案查詢系統進行了(Got it)詳細分析，設計出(out)了(Got it)可行的(of)系統方案。短信和(and)WAP在(exist)2006-2009年爲(for)檔案移動信息服務主要(want)服務方式。武漢市檔案館在(exist)2013年國(country)際檔案日上(superior)，啓動數字化檔案館手機檔案信息文化推送系統，被譽爲(for)全國(country)首個(indivual)“手機檔案館”。此後檔案APP開始興起，但隻有少數檔案館應用(use)。黃永勤等人(people)（2014）指出(out)新浪微博作(do)爲(for)國(country)内首家微博平台，于(At)2009年8月推出(out)，僅有14%的(of)檔案學人(people)在(exist)2009年注冊并發布第一(one)條微博。王潇與黃新榮（2013）調查了(Got it)截至2013年1月23日微信公衆号，實際檔案部門注冊數爲(for)0。胡晶（2013）報道十堰市檔案局于(At)2013年9月5日推出(out)手機微信查詢開放檔案和(and)現行文件業務。2009-2016年，在(exist)社交媒體熱浪的(of)席卷之下，微博在(exist)檔案移動信息服務中被廣泛應用(use)，而從2014年開始微信在(exist)檔案移動信息服務中掀起了(Got it)新浪潮。

1.2檔案移動信息服務面臨的(of)問題。

1.2.1部分WAP網站用(use)戶體驗不(No)佳。WAP（WirelessApplicationProtocol，無線應用(use)協議）以(by)智能信息傳送的(of)方式在(exist)移動終端實現互聯網和(and)高級數據業務的(of)引入和(and)互操作(do)，實質是(yes)爲(for)移動用(use)戶提供浏覽網頁等網絡服務。筆者訪問部分檔案信息網的(of)WAP網站，其中有的(of)檔案網站，如安徽省檔案信息網，用(use)戶體驗較好，有的(of)檔案網站體驗不(No)佳：第一(one)，内容紛繁複雜，界面冗長。界面垂直排列的(of)網頁内容可說爲(for)豐富，也可形容爲(for)“過重”，它實際上(superior)是(yes)将PC端的(of)網頁進行縮放。第二，字體太小，需手動放大(big)。打開頁面無法看清字體及内容，一(one)眼實難觀盡。第三，操作(do)不(No)便。想要(want)找到(arrive)某一(one)欄目，除了(Got it)不(No)停的(of)放大(big)頁面外，還需操作(do)謹慎，稍有不(No)慎點擊到(arrive)非目标欄目，就需重新返回，再次縮放點擊，操作(do)耗時(hour)。

1.2.2APP開發運營成本與利用(use)效益的(of)反差。調查看來(Come)，極少數檔案館已上(superior)線運營檔案APP，如浙江省檔案館、廣西壯族自治區檔案館等。雖檔案APP初有發展，但筆者認爲(for)部分檔案館研發檔案APP還需三四而後行。首先，檔案APP的(of)研發成本高，周期較長。需開發iOS、Android、Windowsphone等多個(indivual)版本，以(by)适應使用(use)不(No)同操作(do)系統移動終端的(of)人(people)群使用(use)。其次，不(No)斷的(of)更新新内容、運維。APP上(superior)線後的(of)後期任務接踵而至，完成這(this)些“任務”的(of)人(people)财物消耗大(big)。最後，用(use)戶對檔案APP的(of)利用(use)頻次、粘性程度較低。有着檔案素養和(and)檔案興趣高的(of)少數人(people)群，使用(use)APP的(of)時(hour)間和(and)目的(of)會較多，而僅在(exist)必要(want)時(hour)才利用(use)的(of)廣大(big)普通民衆，其利用(use)檔案的(of)迫切必要(want)性相對較少，用(use)戶利用(use)粘性低。

1.2.3微平台側重于(At)宣傳與普惠檔案服務的(of)局部發展。目前檔案微平台活躍并廣泛開展，開通微博的(of)檔案館及檔案學人(people)數量大(big)，微信公衆号也已上(superior)百。但其提供的(of)内容以(by)信息發布和(and)指導性文件這(this)一(one)系列的(of)休閑檔案爲(for)主，譬如，業内動态、照片珍藏、網上(superior)展覽、查檔須知、法律法規等；查詢上(superior)大(big)多隻能做到(arrive)預約查檔。檔案微平台服務的(of)内容還較爲(for)同質化和(and)狹窄，缺少特色服務，全方位的(of)檔案信息服務。

1.2.4檔案移動應用(use)建設困于(At)成本高、技術難、資源共享難的(of)問題之中。第一(one)，成本上(superior)，存在(exist)着移動服務開發門檻較高、移動用(use)戶利用(use)成本較高。開發門檻即意味着平台系統開發所需的(of)經費及技術，用(use)戶利用(use)成本體現在(exist)流量的(of)損耗和(and)利用(use)檔案所必要(want)支付費用(use)等。第二，技術上(superior)，體現在(exist)多種技術聯合和(and)訪問網絡的(of)安全上(superior)。需要(want)數字技術、信息技術、互聯網技術等技術的(of)共同作(do)用(use)。移動設備的(of)無線信号強弱受制于(At)各種外界因素如信号發射的(of)強弱、建築物的(of)阻擋、金屬物的(of)屏蔽、氣候的(of)變化等等，一(one)旦無線信号減弱,則會影響到(arrive)數字檔案的(of)傳遞和(and)利用(use)。第三，資源共享問題。APP生(born)成的(of)原生(born)性和(and)管理的(of)碎片化使得檔案信息資源在(exist)各自APP中孤立封閉，形成了(Got it)一(one)個(indivual)個(indivual)的(of)信息孤島。移動應用(use)上(superior)的(of)檔案信息，是(yes)由檔案館挑選出(out)部分信息加以(by)發布的(of)，挑選信息本身就阻礙了(Got it)信息的(of)完整共享，同時(hour)挑選出(out)的(of)信息未必與檔案利用(use)者需求相切合，檔案信息資源共享互動率低。

2響應式Web設計的(of)特點、開發應用(use)及優勢

2.1響應式Web設計的(of)含義及特點。2010年5月EthanMarcotte最先提出(out)響應式網站Web設計（ResponsiveWebdesign），這(this)一(one)理念源于(At)建築領域中的(of)響應式設計，即根據各個(indivual)客戶設計不(No)同的(of)物理空間。由此引發了(Got it)Web設計同樣也可和(and)響應式建築相似，做到(arrive)根據不(No)同設備環境自動響應及調整的(of)思考。響應式網頁設計就是(yes)一(one)個(indivual)網站能夠兼容多個(indivual)終端——而不(No)是(yes)爲(for)每個(indivual)終端做一(one)個(indivual)特定的(of)版本。響應式Web設計的(of)理念是(yes)頁面的(of)設計與開發應當根據用(use)戶行爲(for)以(by)及設備環境(系統平台、屏幕尺寸、屏幕定向等)進行相應的(of)響應和(and)調整。其基本特點，一(one)是(yes)基于(At)搜索引擎，無須下載。二是(yes)響應多種設備，适配多種尺寸。

2.2響應式Web設計的(of)開發與應用(use)。響應式Web設計開發的(of)原理涉及到(arrive)調整分辨率、賦予彈性化、重構布局、調整樣式等。其中關鍵技術：一(one)是(yes)流動布局。傳統的(of)的(of)固定布局都爲(for)網頁設置了(Got it)一(one)個(indivual)固定寬度的(of)外包裹，且這(this)個(indivual)外包裹的(of)元素不(No)能移動，無論訪問者移動終端屏幕的(of)分辨率是(yes)多少，網頁都顯示爲(for)和(and)其它訪問者相同的(of)寬度。這(this)樣需在(exist)移動終端上(superior)縮放界面。而流動布局則是(yes)用(use)相對單位百分比，訪問時(hour)可自适應用(use)戶的(of)分辨率，無需縮放界面，網頁顯示具有可變性。二是(yes)彈性圖片和(and)媒體。在(exist)響應式Web設計中通過使用(use)一(one)些CSS技巧，使圖像和(and)媒體比例限制在(exist)其父元素範圍之内，相應于(At)布局的(of)其他(he)部分按比例縮放，以(by)适應其設備的(of)大(big)小。三是(yes)CSS3媒體查詢技術。是(yes)響應式Web設計最核心的(of)技術，其允許設計人(people)員基于(At)各種不(No)同的(of)設備屬性（比如屏幕寬度、分辨率、方向等）來(Come)确定目标樣式。媒體查詢訪問終端的(of)分辨率小于(At)或大(big)于(At)設定範圍，則自動适應訪問端的(of)尺寸。應用(use)上(superior)，可利用(use)開源的(of)響應式Web設計前端開發框架，如UIKit、Bootstrap，進一(one)步适應性設計應用(use)。國(country)内雲南大(big)學圖書館在(exist)使用(use)PHP語言編寫的(of)開源内容管理框架Drupal平台上(superior)，成功開發了(Got it)基于(At)響應式Web設計技術的(of)圖書館移動門戶網站。并采用(use)CSSHack，針對不(No)同浏覽器編寫不(No)同CSS樣式，解決響應式網頁在(exist)IE6、IE7、IE8中樣式亂的(of)問題。

2.3應用(use)優勢。

2.3.1優化界面提升用(use)戶體驗。第一(one)，内容簡明。因定制式的(of)響應，界面根據不(No)同設備屏幕分辨率大(big)小可自适應顯示。第二，字體清晰。顯示效果清晰，不(No)用(use)手動放大(big)、縮小，可随意翻閱穿梭于(At)各個(indivual)頁面之間。第三，操作(do)簡便。減去不(No)停手動縮放界面的(of)步驟，某些由于(At)界面限制而被隐藏的(of)欄目也易找到(arrive)。

2.3.2降低成本增加利用(use)效益。一(one)是(yes)響應式Web設計滿足高需求而維護成本低。在(exist)開發成本上(superior)，響應式Web設計與APP相比沒有多少優勢可言，但其在(exist)後期的(of)運營與維護上(superior)則有着巨大(big)的(of)優勢。在(exist)維護上(superior)，響應式網站服務端統一(one)升級維護，自動更新。檔案館不(No)用(use)面對不(No)同的(of)設備維護多個(indivual)版本，可不(No)需特定的(of)人(people)維護移動網頁。同時(hour)提升利用(use)者的(of)“享受”程度，增加用(use)戶黏性，實現較好的(of)利用(use)效益。二是(yes)減少内容多次分發負擔。檔案館不(No)再需要(want)對APP、WAP、微平台等不(No)同移動信息服務渠道分發内容，集中處理優化響應式網站内容即可，減少内容上(superior)的(of)更新和(and)營運維護成本。

2.3.3打破限制傳遞全方位信息。移動終端的(of)響應式網頁，可提供與PC端網頁一(one)緻的(of)内容，無須删減，表現力一(one)緻。如此，極大(big)地(land)避免挑選檔案信息發布，及“挑選”檔案信息進行二次發布的(of)時(hour)間消耗。這(this)也是(yes)檔案館從供給側的(of)一(one)方改革，提供移動終端可查詢全部相關檔案信息的(of)移動信息服務新方式，滿足用(use)戶對信息多樣性、豐富性的(of)浏覽需求。

2.3.4助力解決“錢、技、共享”難題。首先“錢”的(of)難題上(superior)。相較于(At)檔案館微信公衆号、檔案APP，其最大(big)的(of)赢點在(exist)于(At)較少的(of)運營成本。網絡技術的(of)飛速發展，檔案用(use)戶在(exist)“流量”和(and)“時(hour)間損耗”上(superior)的(of)利用(use)成本也會降低。其次“技”的(of)難題上(superior)。國(country)家層面極力提倡互聯網與傳統行業的(of)鏈合發展，互聯網普及廣，技術發展快。移動通信的(of)無線通信技術也在(exist)不(No)斷的(of)更新換代，信号和(and)速率增強，抗幹擾和(and)便民程度不(No)斷增強。最後“共享”的(of)難題上(superior)。可将PC端已上(superior)線運行的(of)由國(country)家檔案局檔案科學技術研究所啓動的(of)“國(country)家開放檔案信息共享平台”，進一(one)步改造爲(for)響應式網站，合理利用(use)已有的(of)檔案信息聚合共享渠道和(and)平台。

3面臨的(of)困境

3.1響應式Web設計開發成本資金籌措問題。我(I)國(country)檔案館早已冠以(by)“清水衙門”的(of)頭銜：一(one)是(yes)内部資金缺乏，我(I)國(country)檔案工作(do)實行統一(one)領導、分級管理的(of)原則，其運行經費都源于(At)中央審批撥款；二是(yes)缺少外部資金來(Come)源，2013年财政部、發展改革委公布取消和(and)免征一(one)批行政事業性收費，其中包括利用(use)檔案的(of)收費。三是(yes)内部資金消耗大(big)，目前檔案館在(exist)數字檔案館構建中投入了(Got it)巨大(big)資金，在(exist)經費運轉上(superior)絕大(big)部分檔案館應是(yes)“步履蹒跚”了(Got it)。由于(At)經費不(No)足，開發成本籌措不(No)定而使部分檔案館開發響應式Web設計望而卻步。

3.2響應式Web設計技術合作(do)問題。大(big)多數檔案館的(of)工作(do)人(people)員是(yes)沒有更多的(of)時(hour)間、精力或學識擔當開發重任。那麽檔案館開發響應式Web設計，則面臨着技術合作(do)問題，其需與外界合作(do)共力，譬如檔案館與檔案館之間，檔案館與外部專業機構，共同或外包共建來(Come)實現檔案網站的(of)響應式Web設計。

3.3部分浏覽器響應問題。響應式Web設計需要(want)浏覽器有較高支持能力，一(one)般在(exist)Chrome、Firefox和(and)Safari上(superior)支持較好，而在(exist)IE8及其以(by)下的(of)舊版本IE浏覽器上(superior)支持率極低。主要(want)原因是(yes)IE8及其以(by)下的(of)舊版本IE浏覽器并不(No)支持CSS3。媒體查詢功能是(yes)響應式網頁設計的(of)核心，是(yes)CSS3帶來(Come)的(of)功能，所以(by)隻有支持CSS3的(of)浏覽器才能實現響應式設計。

4解決方法

4.1衆籌助力解決開發成本問題。衆籌指通過互聯網方式發布籌款項目并募集資金。爲(for)解決檔案館開發響應式Web設計所需的(of)資金，檔案館可在(exist)專業相關性較高的(of)網站或衆籌網上(superior)，發起響應式Web設計開發資金衆籌項目，通過互聯網合理合法募集社會資金。目前，國(country)内優酷衆籌取得較大(big)成功，在(exist)規定募集時(hour)間長短和(and)目标金額前提下，募得資金，完成衆籌項目。

4.2“産學研”爲(for)導向與高等學校技術合作(do)。産學研通常指以(by)企業爲(for)技術需求方，與以(by)科研院所或高等學校爲(for)技術供給方之間的(of)合作(do)，其實質是(yes)促進技術創新所需各種生(born)産要(want)素的(of)有效組合。檔案館在(exist)此處姑且充當“企業”，發出(out)對響應式Web設計這(this)一(one)技術需求，而科研院所或高等學校則研發相應的(of)技術，從而實現學、研、産的(of)有效遞進，達到(arrive)共赢的(of)功效。

4.3盡量支持舊版本IE鼓勵用(use)戶更新浏覽器。一(one)是(yes)國(country)内97.45%的(of)WindowsPhone用(use)戶使用(use)移動版IE浏覽器，IE浏覽器用(use)戶決定了(Got it)響應式Web設計應盡量支持IE。對于(At)那些不(No)支持媒體查詢功能的(of)浏覽器，可以(by)通過加載media-queries.js或者html5.js的(of)方法來(Come)解決。對于(At)IE6浏覽器，很多樣式都不(No)兼容，本站采用(use)了(Got it)彈出(out)窗口提示升級浏覽器的(of)方法。二是(yes)國(country)外數據公司GadgetLab發布了(Got it)2015年全球移動浏覽器份額的(of)數據，中國(country)市場份額中安卓類浏覽器占37.63%、Safari占35.82%、Chrome占19.19%、Firefox占4.41%。這(this)些被廣泛使用(use)的(of)移動浏覽器，幾乎都支持響應式網頁，按照使用(use)需求，大(big)衆用(use)戶都可選擇性地(land)更新使用(use)支持響應式網頁的(of)浏覽器。