2024-01-26 分類: 網(wǎng)站建設(shè)
對(duì)于攝影師來(lái)說(shuō),三步取景布局是一個(gè)非常熟悉的概念。雖然是一個(gè)很吸引人的概念,但是在設(shè)計(jì)網(wǎng)頁(yè)的時(shí)候,幾乎沒(méi)有人會(huì)以三分法為例。當(dāng)然,這并不意味著不可能,只是這種跨品類的東西很少有人注意到。
所以,在今天的文章中,我將解釋三分法,并分享一些將其應(yīng)用于網(wǎng)頁(yè)設(shè)計(jì)的技巧和經(jīng)驗(yàn)。但是二分法不一定適合所有人。有許多技巧和方法來(lái)促進(jìn)設(shè)計(jì)和設(shè)計(jì)過(guò)程。但是,作為一個(gè)基本的布局規(guī)則,三分法肯定是值得學(xué)習(xí)的,在網(wǎng)頁(yè)設(shè)計(jì)中也是相當(dāng)適用的。
為什么三分?
你可能會(huì)問(wèn),為什么一定要拿三分?這個(gè)奇怪的設(shè)定是從哪里來(lái)的?好在我很高興的告訴你,這個(gè)東西和數(shù)學(xué)定理或者復(fù)雜的邏輯推理沒(méi)有任何關(guān)系,沒(méi)有太多的必要去深究這個(gè)東西的由來(lái)。
三分法只來(lái)源于傳統(tǒng)藝術(shù),目前特別用在攝影上。并且整個(gè)布局被分成九個(gè)平均塊,在水平和垂直方向上具有兩個(gè)邊界。根據(jù)三分法,為了盡可能地吸引觀眾的注意力,視覺(jué)的中心或者說(shuō)最吸引人的東西應(yīng)該盡可能地靠近四條線的交點(diǎn)。
你可以在WDD的這篇文章中找到一個(gè)很好的例子。很多情況下,不對(duì)稱布局可以讓所有頁(yè)面都更有趣,但并不意味著要一直使用不對(duì)稱布局,因?yàn)樵谀承┑胤?,?duì)稱布局會(huì)更有趣,這個(gè)時(shí)候,三分法則的意義就不大了。
在攝影中,最富有想象力的目的是從奇特的視角捕捉一些吸引人的場(chǎng)景,不對(duì)稱的布局使視野中的一些元素比其他元素更突出,而這些突出的元素通常壓在上面提到的四個(gè)交叉點(diǎn)上。
那么,回到網(wǎng)頁(yè)設(shè)計(jì)的問(wèn)題,三部曲和網(wǎng)頁(yè)設(shè)計(jì)是如何結(jié)合的?就像攝影中三分法下的布局能吸引觀眾一樣,符合三分法的網(wǎng)頁(yè)也能讓讀者更加關(guān)注聚焦的內(nèi)容。
知道網(wǎng)格的三等分線
四行四重九塊是三分法下的網(wǎng)格框架。很多網(wǎng)站的首頁(yè)設(shè)計(jì)符合F型布局或者Z型布局,用戶已經(jīng)習(xí)慣了這種閱讀方式。通常視覺(jué)起點(diǎn)在左上角,這是設(shè)計(jì)師要注意的第一塊。
這意味著左上角的交叉點(diǎn)應(yīng)該與頁(yè)面的一些主要內(nèi)容重疊。不需要在路口放置鏈接或者圖片(當(dāng)然不是必須的)。它更像是一個(gè)標(biāo)志,用來(lái)區(qū)分布局的一個(gè)主要節(jié)點(diǎn)。例如,頁(yè)面標(biāo)題的起點(diǎn)可以與之重疊,所有標(biāo)題與第一條水平線齊平,然后是橫幅圖形等。放在標(biāo)題下面。
值得注意的是,三分法在分析網(wǎng)頁(yè)設(shè)計(jì)中的應(yīng)用更多的是一種用戶體驗(yàn)設(shè)計(jì)的概念,而不是一個(gè)完整的設(shè)計(jì)準(zhǔn)則。所以如果要用這個(gè)概念來(lái)分析網(wǎng)頁(yè)設(shè)計(jì),建議在閱讀器中打開(kāi)網(wǎng)頁(yè)后,對(duì)截圖進(jìn)行分析處理。完整的網(wǎng)頁(yè)太長(zhǎng),用戶總是基于屏幕來(lái)閱讀,而不是一次看完整個(gè)頁(yè)面。不需要應(yīng)用所有頁(yè)面,截圖就夠了。如果設(shè)計(jì)還在原型階段,建議參考屏幕尺度截取分析。
所以你要從用戶的閱讀習(xí)慣出發(fā),結(jié)合三分法進(jìn)行分析優(yōu)化。用戶在閱讀網(wǎng)頁(yè)時(shí),會(huì)下意識(shí)地注意到問(wèn)題的癥結(jié)所在,準(zhǔn)確地運(yùn)用三分法設(shè)計(jì)頁(yè)面。你會(huì)發(fā)現(xiàn)這3次;3的網(wǎng)格可以幫你帶來(lái)非常有啟發(fā)性的設(shè)計(jì)。
小幅調(diào)整而非重新設(shè)計(jì)
在你知道如何應(yīng)用三點(diǎn)法的網(wǎng)格之后,你需要明確更重要的一點(diǎn):三點(diǎn)法帶來(lái)的不是無(wú)懈可擊的網(wǎng)頁(yè)設(shè)計(jì)框架,而是對(duì)現(xiàn)有設(shè)計(jì)進(jìn)行微調(diào)的布局測(cè)試框架。
可以幫你設(shè)計(jì)網(wǎng)頁(yè)的免費(fèi)網(wǎng)格系統(tǒng)太多了,比如960GS,但是基于三分法的九網(wǎng)格系統(tǒng)可以幫你稍微調(diào)整網(wǎng)頁(yè)的布局,比如調(diào)整導(dǎo)航欄的高度,把Logo移近或移遠(yuǎn)。
幸運(yùn)的是,這種測(cè)試方法非常適用和簡(jiǎn)單,沒(méi)有選擇任何軟件。分析完截圖,可以在PS里畫一條虛線。GIMP等開(kāi)源免費(fèi)軟件也能輕松幫到你。如果出了問(wèn)題,可以直接在屏幕上畫個(gè)九宮格來(lái)分析...(據(jù)說(shuō)盲狙在玩CS之初就用了這么笨的方法~)反正可以幫你搭建一個(gè)九宮格分析的工具,幫你找到準(zhǔn)確的設(shè)計(jì)方向。
完成初稿,用三點(diǎn)法測(cè)試,然后進(jìn)入下一步。隨著時(shí)間的推移,你會(huì)更清楚地知道如何將視覺(jué)元素放在正確的位置。
處理的對(duì)稱性
有時(shí),在頁(yè)面中恰當(dāng)?shù)貞?yīng)用對(duì)稱元素是非常有用的。但是在網(wǎng)頁(yè)設(shè)計(jì)中處處使用對(duì)稱設(shè)計(jì)就太盲目了。事實(shí)上,在藝術(shù)和攝影領(lǐng)域,不對(duì)稱布局的應(yīng)用仍然占主導(dǎo)地位,因?yàn)樗南鄬?duì)大小和適當(dāng)?shù)木嚯x使它更令人愉快,這也證明了不平衡的視覺(jué)設(shè)計(jì)更能吸引我們的注意力。
實(shí)際上,布局設(shè)計(jì)也有類似的原則和規(guī)范。例如,當(dāng)您在頁(yè)面頂部應(yīng)用大橫幅圖形時(shí),它通常會(huì)占據(jù)頁(yè)面高度的2/3。同樣,標(biāo)題和正文的字體大小也需要比較,讀者自然會(huì)注意到更大的橫幅圖形、標(biāo)題和副標(biāo)題。大小對(duì)比是一方面,另一方面還要考慮圖片和文字在頁(yè)面上的位置。簡(jiǎn)單的應(yīng)用三分法并不能保證作文的豐滿。把九個(gè)方塊放在頁(yè)面上,適當(dāng)調(diào)整頁(yè)面上元素的位置和中心,會(huì)好很多。
二分法的優(yōu)點(diǎn)是可以兼容非對(duì)稱布局,也可以用來(lái)優(yōu)化對(duì)稱布局。兩種布局巧妙配合,借助三分法突出頁(yè)面重點(diǎn),同時(shí)控制頁(yè)面平衡,可以訓(xùn)練出優(yōu)秀的網(wǎng)頁(yè)。
最后的想法
大部分的藝術(shù)情境都沒(méi)有固定的規(guī)則,但是有可供參考的規(guī)則,在這些規(guī)則的基礎(chǔ)上不斷完善設(shè)計(jì)。像第三師一樣駕馭規(guī)律,理解這個(gè)規(guī)律的目標(biāo),深刻理解即使不是刻意應(yīng)用,也會(huì)自然而然的在你的設(shè)計(jì)中表現(xiàn)出來(lái),類似于第二本能。這個(gè)時(shí)候,你就有了打破常規(guī)的可能!
設(shè)計(jì)和藝術(shù)雖然有基本的區(qū)別,但并不是對(duì)立的。誠(chéng)然,按照規(guī)則,你可以設(shè)計(jì)出更符合人們口味的作品,但打破規(guī)則,充滿個(gè)性和藝術(shù)感的設(shè)計(jì)作品卻并不令人印象深刻。
非常感謝您讀完創(chuàng)新互聯(lián)的這篇文章:"如何利用攝影二分法優(yōu)化網(wǎng)頁(yè)設(shè)計(jì)?",僅為提供更多信息供用戶參考使用或?yàn)閷W(xué)習(xí)交流的方便。我們公司提供:網(wǎng)站建設(shè)、網(wǎng)站制作、官網(wǎng)建設(shè)、SEO優(yōu)化、小程序制作等服務(wù),歡迎聯(lián)系我們提供您的需求。
分享名稱:如何利用攝影二分法優(yōu)化網(wǎng)頁(yè)設(shè)計(jì)?
轉(zhuǎn)載源于:http://m.rwnh.cn/news29/315579.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供服務(wù)器托管、微信公眾號(hào)、品牌網(wǎng)站設(shè)計(jì)、全網(wǎng)營(yíng)銷推廣、虛擬主機(jī)、關(guān)鍵詞優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容