設(shè)計趨勢！設(shè)計的現(xiàn)狀與趨勢

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

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

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

流動布局

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

媒介查詢

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

彈性圖片

伴隨布局的彈性，圖片作為信息重要的形式之一也必須有更靈活的方式去適應布局的變化。個人認為彈性圖片是Ethan Marcotte提出設(shè)計產(chǎn)品時提出的概念，我們在后續(xù)的研究中可以以圖片為典型，擴大研究范圍：除了圖片，還應該包括圖標、圖表、視頻等信息內(nèi)容的響應方式研究。

響應式設(shè)計的概念從提出至今，一直不斷蔓延擴散，并得到各方認可的主要原因：

1、外部環(huán)境

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

2、自身特色

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

3、內(nèi)部需求

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