響應式設計扼殺了網站表現力
響應式網站可以適用于多種終端(電腦、手機、pad等),這是它的優勢所在,但有些人認為這也是響應式設計的缺點,因為需要同時兼顧移動端和客戶端,在很多方面(個性化設計或性能能等方面)會有很大的局限性,這嚴重影響了網站的表現力。不可否認,現在很多設計都開始變得相似,版式布局基本一致,圖片來源大同小異,潮流趨向基本相同,Bootstrap與Foundation的流行甚至使得很多設計師直接套用一模一樣的代碼庫、風格 。但是,即使使用的工具和資源相差無幾,如何發揮擴大網站的表現力的關鍵還在于我們自己。
我們可以通過調整圖像排列方式、使用獨特元素(如使用六邊形代替方形)、插畫元素、縮略圖等來讓自己的網站脫穎而出(下圖就是一個很好的栗子)。讓合肥企航網絡在這給所有人一個統一的解決方案并不現實,因為不同的網站目的不同,適合的表現形式也不同, 我們應該找找哪種方式更適合自己的網站,更能夠擴大自己網站的表現力。從某個程度上來說,響應式體現的是一種高度適應性的設計思維模式。在探索響應式設計的道路上,響應式本身并不是唯一目的,基于任意設備對頁面內容進行完美規劃的設計可能更是我們的課題,F在你還要說響應式設計扼殺了你網站的表現力嗎?
響應式設計影響排版
響應式網站中的排版也是一個很讓人頭疼的問題,就像我們上面說的,在設計師選擇根據移動等設備設置斷點時,遇到不適合的設備時網站內容可能就無法很好的顯示出來,網站排版就會"遭殃"。所以不少人都覺得響應式網站上的文字排版很有難度,甚至有些人認為在響應式網站上就做不好排版。其實,做好網站的排版并沒有想象中那么困難,一方面,我們應該注重網站的內容,內容是王道。我們應該致力于怎樣讓用戶更快速、更容易得到信息,保證內容的可讀性,同時記住響應式網站的設計應該結合內容和設備來設置斷點。
另一方面,響應式網站就是關于如何恰當布局的問題。在這點上,ems是一個很好的工具。"Ems"(em)是網頁媒體文檔的一個度量單位,我們可以使用它設置字體、內外邊距來合理規劃網站排版,增強網站內容的可讀性。這是因為ems是一個可縮放的相關單位,它可以根據父級元素的字體大小進行相對應的縮放,這意味著不管字體增大還是縮小,網站的布局也會相應的進行調整,排版不會有任何變形。由于其可伸縮性和適應移動設備的特性,ems在web文檔中正變得越來越受歡迎。
下面是關于ems的一個栗子,假設這有兩個結合內容和設備設置的斷點,一個是高分辨率的電腦,另一個是小屏幕的平板電腦。一個ems等于當前的字體大小,例如,基本字體是16px,1em就等于16px,為了在3840*2160分辨率的電腦上更好的瀏覽,我們將基本字體增大到22px,同樣,在800*600分辨率的平板電腦上,我們將基本字體減小到14px,F在兩個設定斷點(一大一小)上網站的布局已經完全改變了。在分辨率比較大的電腦上顯示的網站上,1.4em的標題,基本字體22px,這意味著1.4em等于30.8px,但在分辨率較小的平板電腦上,1.4em的標題,基本字體14px,這里1.4em等于19.6px。從這可以看出em在本質上是可伸縮的,盡管網站字體已經變成大或變小,我們都無需擔心網站布局的破壞,因為它會隨著字體的變化適當進行自我調整。只要我們好好利用這些相對單位,響應式網站的整體布局和排版就可以很美觀。