七大常用的網頁版式

發表於2016-04-18

【前言感悟】看再多的優秀網頁案例,如果沒分析總結,很難借鑑運用,因為你可能只是模範,過於注重樣式,做出來的頁面可能就失去靈氣,沒辦法根據需求靈活運用各種樣式。另外,別人的分析文章很多,百度一抓一大把,資訊氾濫的年代,看再多也難以全部吸收,只有你自己去分析總結,才能真正變成自己的知識,才會印象深刻而靈活運用到專案中。

以下截圖均來自Pinterest,謝感謝設計師們的分享。

【框出重點文案和圖片焦點】讓視覺更集中,‘幾何線條’本來就是版面構成的好素材。

【大物件擺放於主文案兩邊】特別是使用官網商品圖,選用能細節突出,足夠吸引眼球的商品照(比如可口的蛋糕,酷炫的跑鞋等),文案居中擺放,這種方式會讓版面很有氣氛,也突出商品,一舉兩得。

【挑選一個合適的商品,摳圖當背景】讓模組變得不單調,也避免內容擁擠,看起來很舒服。這裡可以靈活運用,比如大圖用做商品展示,多個小圖當成商品細節圖靈活排版。(注意:當背景的商品不能太搶眼,避免把焦點從主內容移開,應該只起到美化版面的作用,低調處理。)

【規則排列產生美】有時規則的樣式擺放在一起,規規矩矩四周對齊,的確能夠產生乾淨穩重的感覺,給人信任感,簡單的美。

【不規則的靈動美】如果一個版面都是規則樣式,會很死板,難以給人留下印象,SO,大膽留白和發揮你的靈感隨心排版吧!讓頁面看起來有靈氣。

 

【大文案跳出】把文案突出擺放在留白的空間上,也是一種方式,可以組合嘗試。

最後:【商品圖居中,大文案居中擺放於商品後,產生雜誌風格】焦點明確,也是突出商品的好手法。

 

★★★ <如何更有效地收藏案例?>看到好看的頁面時,不建議收藏整個頁面,因為整個頁面只能給你整體印象,卻較難變成知識工具,因為大部分時間,我們只是因為頁面某個按鈕、某個樣式、某個點所吸引,覺得很棒,那麼建議只截圖儲存你那一刻被吸引的小範圍視覺,下次找靈感時,更直接快速地運用!

【後話】現在大家都要追求高階大氣,結果隨手抓來全部都是高階灰高階黑的頁面,當然灰白黑是最容易做出高大上,看多了卻難免視覺疲勞,再高大上也失去活力。(又得吐槽一下,是不是你老闆又喊著不夠大氣,再改改,你讓他舉個案例吧,又舉不出來…然後做了黑白灰大氣版,又被嚷著要改成像淘寶天貓那些紅紅火火簡單粗暴吸引銷售的?不可以用灰黑色,會影響銷售……設計的孩子都需要強大的內心…)

最後最後最後,高階灰看膩了,貼一個多彩炫麗的活力下吧!

看完覺得有用就點個贊吧~

相關文章