10個(gè)精致的企業(yè)網(wǎng)站設(shè)計(jì)模板賞析(3)
三、理性而硬朗的設(shè)計(jì)
1、相較于前面的灰色設(shè)計(jì)來講,這種充滿了漸變光和1像素高光線條的設(shè)計(jì)看上去理性而硬朗,原因是漸變類似于金屬的表面光澤,而90度直角和1像素高光的大量出現(xiàn)好像元素的邊緣鋒利到能夠劃破手指一般。前面兩個(gè)設(shè)計(jì)風(fēng)格簡潔所以不會出現(xiàn)過多的設(shè)計(jì)元素,而這個(gè)設(shè)計(jì)模板相較之下就要濃烈一些,所以無論是滑動展示區(qū)、圖片邊框還是”Read more”按鈕都有更多的設(shè)計(jì)在里面。所以在設(shè)計(jì)中需要把握一個(gè)整體的設(shè)計(jì)方向,才能對于如何處理各個(gè)頁面元素做到心中有數(shù)。
2、和前面的案例相同,不同信息區(qū)域用不同顏色做一劃分也在這個(gè)設(shè)計(jì)中得到了體現(xiàn),附屬導(dǎo)航和聯(lián)系信息位于頁面的最頂部,屬于第一個(gè)部分,也是色彩最暗的區(qū)域。Logo、主導(dǎo)航、主視覺屬于同一個(gè)信息區(qū)域,是色彩最濃烈和醒目的區(qū)域。原因是這部分在顯示器中處于第一屏的位置,要有一下子抓住人的效果。高亮的灰色區(qū)域是頁面的主體部分,是主要的信息閱讀區(qū)域,要給人柔和舒服的閱讀感受;頁腳以及版權(quán)信息部分是最后一個(gè)區(qū)域,色彩和前面的Logo、主導(dǎo)航以及主視覺部分相呼應(yīng),也起到視覺平衡的作用。
3、每一個(gè)信息區(qū)域的邊緣都有非常清晰的1像素高光,Logo、主導(dǎo)航以及主視覺部分的背景也不是簡單的顏色填充而已,而是疊加了類似于光線的效果,主視覺以及下面圖片邊框底部兩側(cè)的陰影讓內(nèi)容框有了中間突起的感覺。圖片邊框的效果更能夠吸引人,頁腳部分的背景也疊加了漸變,這些都給整個(gè)設(shè)計(jì)增加了質(zhì)感。
3、和第一個(gè)設(shè)計(jì)一樣,這個(gè)案例依然延續(xù)了通欄的設(shè)計(jì)布局。
本文地址:http://likemindfilms.com/tutorial/de1140.html