您的位置: 設計資訊 > 網站設計 > 網頁設計 > 布局太死板?6個小技巧讓你的網頁設計活力十足!

布局太死板?6個小技巧讓你的網頁設計活力十足!

www.dkiyuz.live 2019-06-21 21:19 設計.世界 瀏覽(7315)

摘 要:不得不說,網頁設計絕對是有套路的!網頁布局雖然千變萬化,但是如果你仔細觀察,會發現有一些布局適用范疇相當廣,經久不衰。
在開始一個新的網頁設計項目的時候,不知道你會不會有那么一瞬間的猶豫:“這個項目要從哪里著手呢?”伴隨著這種猶豫的,是“做點前所未有的作品”的沖動。不過,很多時候,這些沖動和猶豫都在需求的磨合、設計的細化中,逐步淡化。

大家都知道做網頁設計有柵格,有縱向柵格也有橫向柵格,柵格提供內容布局的規范,讓信息組織更有條理,我們在柵格規范內做設計,上下左右、垂直居中對齊,橫平豎直、方方正正的看著舒服,信息布局清晰易讀,表面看沒什么問題,但經常會有那么點死板,缺少點活力。

下面這幾點充分說明:

640.jpg

延伸
古詞中“滿園春色關不住,一枝紅杏出墻來”,就是這個感覺,讓主體內容不局限于頁面的條條框框之內,適當的延伸出去,橫跨兩個模塊,不僅能夠打破規則的布局,而且能夠讓兩個模塊有一定延伸感和連接感。

下圖:電腦的圖片不局限在藍色北京區域,延伸到了下一個模塊,除了掩蓋掉兩個模塊間死板的分割線,更能讓用戶在閱讀時能夠流暢的從A區域過渡到B區域,中間不會出現斷節。

640.jpg

下圖:相機圖片在兩個模塊的中間,從綠色背景模塊延伸到淺灰色模塊,將模塊中間死板的分割線去除,完美的過渡方案。

640.jpg

曲線
網頁設計中,免不了內容模塊的分割,這種直線多了自然就會讓畫面死板,我們可以通過改變直線的方式,比如曲線、斜線等來解決這個問題。

640.jpg

用曲線來達到分割的模塊地目的,同時也表達出數據產品的特點。

640.jpg

不論是背景還是主體圖形,都有12°角度的傾斜,讓畫面頓時就“活”了起來。


聲明:圖文資料來源于網絡,僅用于學習交流,版權歸原作者所有,如有來源標注錯誤或侵權,請聯系小編,將及時更正刪除!文中的觀點不代表平臺方的觀點只為信息傳達,如有冒犯請聯系更正刪除,感謝您對我們的支持!

[優秀設計師] DESIGNERS

[優秀設計公司] COMPANYS

聯系我們| 免責聲明| 設計師| 設計公司| 手機版| 設計知識

云南 十一选五开奖结果