久久久久影院美女国产主播_在线精品自偷自拍无码图_国产自产21区视频一区_年轻富婆私密推油到高潮

經(jīng)久不衰!聊聊響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)

來(lái)源:南充領(lǐng)跑網(wǎng)絡(luò)技術(shù)有限公司   發(fā)布時(shí)間:2016-07-27

 

xys20150104 (1)

 

  從2012年開(kāi)始到2014年,各大家對(duì)Web設(shè)計(jì)的趨勢(shì)預(yù)測(cè)中,都提到響應(yīng)式設(shè)計(jì)。2015年網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)預(yù)測(cè)中,響應(yīng)式仍在繼續(xù)。這個(gè)經(jīng)歷了幾年依然大熱的響應(yīng)式,在過(guò)去的幾年里,快速鞏固了自己的地位,并掀起了一股網(wǎng)頁(yè)設(shè)計(jì)新標(biāo)準(zhǔn)的浪潮。新年補(bǔ)課,從頭聊起 >>

  兩波設(shè)計(jì)趨勢(shì)的預(yù)測(cè),看看對(duì)了多少:

  《跟還是不跟?2014年網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)(附資源推薦)》

  

  源起

  2010年5月,伊桑.馬科特(Ethan Marcotte)在“A List Apart”寫(xiě)了一篇開(kāi)創(chuàng)性的文章(題為“Responsive Web Design” ),他利用三種已有的工具:流動(dòng)布局(Fluid grids)、媒介查詢(Media queries)和彈性圖片(Scalable images)創(chuàng)建了一個(gè)在不同分辨率屏幕下都能漂亮地顯示的網(wǎng)站。 Ethan Marcotte力勸設(shè)計(jì)師們要去利用那些Web獨(dú)有的特性去進(jìn)行設(shè)計(jì): “我們可以將不同聯(lián)網(wǎng)設(shè)備上眾多的體驗(yàn),當(dāng)作是同一網(wǎng)站體驗(yàn)的不同側(cè)面來(lái)對(duì)待,而不要為每種設(shè)備進(jìn)行單獨(dú)剪裁而使得設(shè)計(jì)彼此斷開(kāi),這才是我們前進(jìn)的方向。雖然我們已經(jīng)能夠設(shè)計(jì)出最佳的視覺(jué)體驗(yàn),但還要把基于標(biāo)準(zhǔn)的技術(shù)也嵌入到我們的設(shè)計(jì)中去,這樣才能使得我們的設(shè)計(jì)不僅靈活,而且還能適應(yīng)渲染它們的各種媒介。” Ethan Marcotte證明了一種在多種設(shè)備上都能提供卓越體驗(yàn)的方法的存在,而且這一方法不會(huì)忽視不同設(shè)備的差異,也不會(huì)強(qiáng)調(diào)設(shè)計(jì)師的控制權(quán),而是選擇了順其自然并擁抱Web的靈活性。

  這里簡(jiǎn)單介紹下上面的提到的三個(gè)概念:流動(dòng)布局(Fluid grids)、媒介查詢(Media queries)和彈性圖片(Scalable images)原本都是指現(xiàn)有的一些技術(shù)手段,但在做響應(yīng)式設(shè)計(jì)研究的過(guò)程中,這些概念還是有更廣泛的意義,設(shè)計(jì)師也應(yīng)該有所了解:

  流動(dòng)布局

  原特指以百分比為度量單位的布局技術(shù)實(shí)現(xiàn)方式。這里就不對(duì)如流動(dòng)布局、彈性布局、流體柵格等各種概念做一一說(shuō)明。筆者就此統(tǒng)為一個(gè)大的概念:在響應(yīng)式設(shè)計(jì)的布局中,不再以像素(px)作為唯一單位,而是采用百分比或者混合百分比、像素為單位,設(shè)計(jì)出更具靈活性的布局方式。

  媒介查詢

  媒介查詢可以讓你根據(jù)在特定環(huán)境下查詢到的各種屬性值——比如設(shè)備類型、分辨率、屏幕物理尺寸及色彩等——來(lái)決定應(yīng)用什么樣的樣式。通過(guò)使用媒介查詢,可以獲取到設(shè)備及設(shè)備的特性,并給出求同存異的方案,從而解決之前在單純的布局設(shè)計(jì)中遺留的問(wèn)題。

  彈性圖片

  伴隨布局的彈性,圖片作為信息重要的形式之一也必須有更靈活的方式去適應(yīng)布局的變化。個(gè)人認(rèn)為彈性圖片是Ethan Marcotte提出設(shè)計(jì)產(chǎn)品時(shí)提出的概念,我們?cè)诤罄m(xù)的研究中可以以圖片為典型,擴(kuò)大研究范圍:除了圖片,還應(yīng)該包括圖標(biāo)、圖表、視頻等信息內(nèi)容的響應(yīng)方式研究。

  盛行

  響應(yīng)式設(shè)計(jì)的概念從提出至今,一直不斷蔓延擴(kuò)散,并得到各方認(rèn)可的主要原因:

  1、外部環(huán)境

  快速增長(zhǎng)且日趨加劇的可聯(lián)網(wǎng)設(shè)備的多樣化,讓現(xiàn)今已不再有標(biāo)準(zhǔn)的屏幕尺寸;

  2、自身特色

  嚴(yán)格定義的響應(yīng)式一般是指響應(yīng)式Web設(shè)計(jì),而Web憑借其特有的靈活性和可塑性,可以適應(yīng)各種尺寸和配置的設(shè)備,可以無(wú)處不在。

  3、內(nèi)部需求

  響應(yīng)式設(shè)計(jì)概念一提出,各大網(wǎng)站及平臺(tái)都希望能夠采用這秉一應(yīng)萬(wàn)的模式,可以更靈活地去適配更多設(shè)備,尤其是現(xiàn)在移動(dòng)設(shè)備大爆棚的時(shí)代。

  

xys20150104 (2)

 

  當(dāng)然也并不是所有的情況都理所應(yīng)帶應(yīng)該采用響應(yīng)式設(shè)計(jì),那么什么情況下更適合采用響應(yīng)式呢?

  1、你想節(jié)約成本地去適應(yīng)更多場(chǎng)景

  資源都是有限的,但總是希望能利用有限的資源去獲得更大的價(jià)值。雖然比起開(kāi)發(fā)設(shè)計(jì)一個(gè)普通的網(wǎng)站來(lái)說(shuō),要打造一個(gè)響應(yīng)式站點(diǎn),所需要的人力和時(shí)間資源都會(huì)有所增加,但比起為不同設(shè)備分別打造多個(gè)版本的成本還是要低很多;從維護(hù)的角度來(lái)說(shuō),也會(huì)輕松很多。

  2、你并不清楚要設(shè)計(jì)開(kāi)發(fā)的全新產(chǎn)品更適合哪個(gè)場(chǎng)景

  與其通過(guò)預(yù)測(cè)挑選核心設(shè)備再進(jìn)行分別設(shè)計(jì),倒不如先花些心思將網(wǎng)站打造得更具彈性,使其在各種設(shè)備中都擁有盡可能優(yōu)秀體驗(yàn)。因?yàn)樵诟鞣矫娑嘉粗记闆r下,做預(yù)測(cè)會(huì)加劇過(guò)程風(fēng)險(xiǎn),使得結(jié)果存在巨大的挑戰(zhàn)性。

  3、你希望網(wǎng)站可以兼容未來(lái)的新設(shè)備

  新的設(shè)備層出不窮,與其被動(dòng)地進(jìn)行更新維護(hù),不如主動(dòng)應(yīng)萬(wàn)變,成為響應(yīng)式。 當(dāng)然這里只是說(shuō)更適合,其實(shí)個(gè)人認(rèn)為只要項(xiàng)目資源和時(shí)間允許,基本上大部分網(wǎng)站都可以去嘗試實(shí)現(xiàn)響應(yīng)式;而對(duì)于初次嘗試響應(yīng)式設(shè)計(jì)的,也可以從“簡(jiǎn)單瀏覽型頁(yè)面”開(kāi)始。

  模式

  目前大多網(wǎng)站中選擇成為響應(yīng)式的設(shè)計(jì)模式主要有兩種:

  1、基于設(shè)備

  通過(guò)主流設(shè)備的類型及尺寸來(lái)確定布局?jǐn)帱c(diǎn)(Break point),設(shè)計(jì)多套樣式,再分別投射到響應(yīng)的設(shè)備。

  

xys201401xx

 

  2、內(nèi)容優(yōu)先

  根據(jù)內(nèi)容的可讀性、易讀性作為確定斷點(diǎn)(Break point)的標(biāo)準(zhǔn),即在對(duì)內(nèi)容進(jìn)行布局設(shè)計(jì)的時(shí)候,可以無(wú)視設(shè)備,有內(nèi)容決定何時(shí)需要采用不同的呈現(xiàn)方式。

  

xys20150104 (4)

 

  個(gè)人還是傾向內(nèi)容優(yōu)先的方式,這是真正符合響應(yīng)式設(shè)計(jì)核心策略的模式,也是對(duì)未來(lái)友好的方式。 從過(guò)去基本上是基于pc的幾個(gè)尺寸,選擇最佳的標(biāo)準(zhǔn)尺寸去設(shè)計(jì)頁(yè)面;到現(xiàn)在移動(dòng)設(shè)備已經(jīng)玲瑯滿目,同時(shí)電視、穿戴設(shè)備也慢慢開(kāi)始起來(lái),已經(jīng)不再有固定的尺寸;未來(lái),將是更加無(wú)法預(yù)知的設(shè)備環(huán)境;那么什么才是王道呢?——就是內(nèi)容本身! 變化總是來(lái)得快且狠,我們要做的就是抓住那根可以貫通全局的線!

  

xys20150104 (5)

 

  在內(nèi)容優(yōu)先的策略中,有三點(diǎn)思維模式可以貫穿整個(gè)響應(yīng)式設(shè)計(jì)的過(guò)程:

  1、忘記設(shè)備

  因?yàn)槲覀儾恢烙脩魰?huì)用什么樣的設(shè)備來(lái)訪問(wèn)網(wǎng)站,因此,我們必須盡可能地把所有情況都囊括進(jìn)來(lái);所有的東西(布局、組件等)都能與不同類型的設(shè)備和平臺(tái)相兼容。

  2、優(yōu)雅降級(jí)

  雖然這個(gè)概念一開(kāi)始是技術(shù)實(shí)現(xiàn)上對(duì)新的特性在老的瀏覽器上無(wú)法很好實(shí)現(xiàn)時(shí)的折中做法,但在此僅想表達(dá)在對(duì)布局做彈性設(shè)計(jì)時(shí),內(nèi)容從寬到窄的變化呈現(xiàn),必須經(jīng)過(guò)重重篩選,留存最核心的內(nèi)容塊。這種模式非常適合對(duì)已存在的pc頁(yè)面產(chǎn)品進(jìn)行響應(yīng)式設(shè)計(jì)改造。

  3、漸進(jìn)增強(qiáng)

  此概念是在Steven在2003年的SXSW活動(dòng)上提出的。在本質(zhì)上來(lái)說(shuō),就是把優(yōu)雅降級(jí)倒過(guò)來(lái):先創(chuàng)建一個(gè)基本體驗(yàn),側(cè)重讓內(nèi)容以一種簡(jiǎn)介的方式來(lái)展現(xiàn);之后,在保證基本體驗(yàn)的前提下,開(kāi)始著手做有關(guān)顯示的布局和交互。而在此,也借用來(lái)說(shuō)明下對(duì)于響應(yīng)式設(shè)計(jì)的內(nèi)容策略中,內(nèi)容從窄到寬的變化呈現(xiàn)中,可以讓內(nèi)容的豐富度也相應(yīng)地有所增加。這種模式與移動(dòng)優(yōu)先策略是相匹配的。

  當(dāng)然,目前響應(yīng)式也是有存在各種爭(zhēng)論的,也許你有一個(gè)很好的理由不用響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)?但我想沒(méi)人會(huì)說(shuō),“讓我們擺脫響應(yīng)式設(shè)計(jì)吧”,而實(shí)際上,越來(lái)越多的網(wǎng)站選擇成為響應(yīng)式。2014年如此,2015年也還是會(huì)繼續(xù),因?yàn)檫@已經(jīng)不是種趨勢(shì),而怡然是種常態(tài)了。

  未來(lái)的路

  雖然響應(yīng)式設(shè)計(jì)的優(yōu)勢(shì)和趨勢(shì)已被普遍認(rèn)可,但目前響應(yīng)式設(shè)計(jì)的模式的普及還是有很多難題需要突破:

  1、響應(yīng)式圖片

  目前彈性圖片的做法主要是:縮放、剪裁、分條件加載等實(shí)現(xiàn)方法本質(zhì)上都只是一個(gè)技巧,只是治標(biāo)不治本地掩蓋了問(wèn)題,并未真正完美地實(shí)現(xiàn)圖片的彈性。

  相關(guān)教程:

  2、跨端的交互

  在響應(yīng)式設(shè)計(jì)中,我們不僅要需要考慮桌面用戶的使用習(xí)慣,還必須兼顧不同尺寸的手持設(shè)備。比如在桌面端無(wú)盡優(yōu)雅的Hover,在移動(dòng)端卻是無(wú)比糟糕的體驗(yàn),如何“求同存異”,讓各端體驗(yàn)均能最佳,還是需要繼續(xù)深入探究的。

  3、性能

  性能估計(jì)是在響應(yīng)式開(kāi)發(fā)中最大的痛,按條件加載、隱藏或顯示什么內(nèi)容,都會(huì)比單一條件判斷的代碼結(jié)構(gòu)來(lái)的繁瑣,并影響體驗(yàn)及維護(hù)。尤其是移動(dòng)性能上,更多樣的設(shè)備具有更加復(fù)雜的使用環(huán)境,如何識(shí)別設(shè)備,并讓設(shè)備在不同環(huán)境均能良好體驗(yàn),也是一根硬骨頭。

  4、合作流程

  響應(yīng)式設(shè)計(jì)遠(yuǎn)遠(yuǎn)不止是一種簡(jiǎn)單的設(shè)計(jì)策略,它為Web項(xiàng)目帶來(lái)的是一整套全新的、完整的方法,還應(yīng)該包括一種新的、可以更好地利用這一模式的工作流程。

  最后,我想說(shuō)下響應(yīng)式體現(xiàn)的是一種高度適應(yīng)性的設(shè)計(jì)思維模式。在響應(yīng)式設(shè)計(jì)探究的道路上,響應(yīng)式本身不是唯一目的,基于任意設(shè)備對(duì)頁(yè)面內(nèi)容進(jìn)行完美規(guī)劃的設(shè)計(jì)策略及工作流程應(yīng)該是我們更大的課題。

 

   
標(biāo)簽:
上一篇:江湖裝修門(mén)戶系統(tǒng)至尊版特色之一鍵刷新排名
下一篇:建站寶盒企業(yè)建站系統(tǒng)之生成手機(jī)APP客戶端

網(wǎng)站建設(shè)知識(shí)網(wǎng)站建設(shè)知識(shí)

企業(yè)官方網(wǎng)站建設(shè) 品牌創(chuàng)意網(wǎng)站建設(shè) B2C電子商務(wù)網(wǎng)站建設(shè) 其他web應(yīng)用開(kāi)發(fā)
微信官網(wǎng)建設(shè) 微信影響活動(dòng) 微信點(diǎn)餐系統(tǒng) 其他微信應(yīng)用開(kāi)發(fā)

更多 +聯(lián)系我們

業(yè)務(wù)范圍:南充、遂寧、巴中、廣安、達(dá)州

業(yè)務(wù)電話:156-0827-8880180-8154-3787

業(yè)務(wù)合作:  278422624 地圖導(dǎo)航: 點(diǎn)擊查看

E-mail:  lingpaonc@qq.com 渠道合作 : 278422624

我們的認(rèn)知

當(dāng)對(duì)手還在將注意力停留在碎片化的互聯(lián)網(wǎng)設(shè)計(jì)或程序?qū)崿F(xiàn)時(shí),領(lǐng)跑早已開(kāi)始將數(shù)字品牌的建設(shè)和傳播進(jìn)一步整合。只有通過(guò)整體的互聯(lián)網(wǎng)品牌分析,幫助品牌建立互聯(lián)網(wǎng)品牌傳播價(jià)值,并圍繞價(jià)值建立品牌粘性,提升品牌與用戶的互動(dòng),更好的幫助品牌傳播,觸發(fā)用戶的行動(dòng)力才是我們工作的終極目標(biāo),這正是一流品牌的成功秘訣。
不可否認(rèn),建立互聯(lián)網(wǎng)品牌傳播價(jià)值的確是門(mén)藝術(shù),但互聯(lián)網(wǎng)不同于藝術(shù)涂鴉,企業(yè)投資品牌絕不是希望品牌成為某個(gè)藝術(shù)家的實(shí)驗(yàn)品?;ヂ?lián)網(wǎng)傳播的對(duì)象是用戶,用戶擁有自己的文化體系,群落共性才是互聯(lián)網(wǎng)品牌傳播創(chuàng)意的源頭,如果我們不能幫助企業(yè)激發(fā)目標(biāo)用戶的共鳴,產(chǎn)生購(gòu)買(mǎi)沖動(dòng),那將是品牌的悲??! 因此,互聯(lián)網(wǎng)傳播必須建立品牌傳播價(jià)值,為夢(mèng)想者創(chuàng)造夢(mèng)想品牌,領(lǐng)跑與您同行!