如何利用攝影二分法優(yōu)化網(wǎng)頁設(shè)計？

對于攝影師來說，三步取景布局是一個非常熟悉的概念。雖然是一個很吸引人的概念，但是在設(shè)計網(wǎng)頁的時候，幾乎沒有人會以三分法為例。當然，這并不意味著不可能，只是這種跨品類的東西很少有人注意到。

所以，在今天的文章中，我將解釋三分法，并分享一些將其應用于網(wǎng)頁設(shè)計的技巧和經(jīng)驗。但是二分法不一定適合所有人。有許多技巧和方法來促進設(shè)計和設(shè)計過程。但是，作為一個基本的布局規(guī)則，三分法肯定是值得學習的，在網(wǎng)頁設(shè)計中也是相當適用的。

為什么三分？

你可能會問，為什么一定要拿三分？這個奇怪的設(shè)定是從哪里來的？好在我很高興的告訴你，這個東西和數(shù)學定理或者復雜的邏輯推理沒有任何關(guān)系，沒有太多的必要去深究這個東西的由來。

三分法只來源于傳統(tǒng)藝術(shù)，目前特別用在攝影上。并且整個布局被分成九個平均塊，在水平和垂直方向上具有兩個邊界。根據(jù)三分法，為了盡可能地吸引觀眾的注意力，視覺的中心或者說最吸引人的東西應該盡可能地靠近四條線的交點。

你可以在WDD的這篇文章中找到一個很好的例子。很多情況下，不對稱布局可以讓所有頁面都更有趣，但并不意味著要一直使用不對稱布局，因為在某些地方，對稱布局會更有趣，這個時候，三分法則的意義就不大了。

在攝影中，最富有想象力的目的是從奇特的視角捕捉一些吸引人的場景，不對稱的布局使視野中的一些元素比其他元素更突出，而這些突出的元素通常壓在上面提到的四個交叉點上。

那么，回到網(wǎng)頁設(shè)計的問題，三部曲和網(wǎng)頁設(shè)計是如何結(jié)合的？就像攝影中三分法下的布局能吸引觀眾一樣，符合三分法的網(wǎng)頁也能讓讀者更加關(guān)注聚焦的內(nèi)容。

知道網(wǎng)格的三等分線

四行四重九塊是三分法下的網(wǎng)格框架。很多網(wǎng)站的首頁設(shè)計符合F型布局或者Z型布局，用戶已經(jīng)習慣了這種閱讀方式。通常視覺起點在左上角，這是設(shè)計師要注意的第一塊。

這意味著左上角的交叉點應該與頁面的一些主要內(nèi)容重疊。不需要在路口放置鏈接或者圖片(當然不是必須的)。它更像是一個標志，用來區(qū)分布局的一個主要節(jié)點。例如，頁面標題的起點可以與之重疊，所有標題與第一條水平線齊平，然后是橫幅圖形等。放在標題下面。

值得注意的是，三分法在分析網(wǎng)頁設(shè)計中的應用更多的是一種用戶體驗設(shè)計的概念，而不是一個完整的設(shè)計準則。所以如果要用這個概念來分析網(wǎng)頁設(shè)計，建議在閱讀器中打開網(wǎng)頁后，對截圖進行分析處理。完整的網(wǎng)頁太長，用戶總是基于屏幕來閱讀，而不是一次看完整個頁面。不需要應用所有頁面，截圖就夠了。如果設(shè)計還在原型階段，建議參考屏幕尺度截取分析。

所以你要從用戶的閱讀習慣出發(fā)，結(jié)合三分法進行分析優(yōu)化。用戶在閱讀網(wǎng)頁時，會下意識地注意到問題的癥結(jié)所在，準確地運用三分法設(shè)計頁面。你會發(fā)現(xiàn)這3次；3的網(wǎng)格可以幫你帶來非常有啟發(fā)性的設(shè)計。

小幅調(diào)整而非重新設(shè)計

在你知道如何應用三點法的網(wǎng)格之后，你需要明確更重要的一點:三點法帶來的不是無懈可擊的網(wǎng)頁設(shè)計框架，而是對現(xiàn)有設(shè)計進行微調(diào)的布局測試框架。

可以幫你設(shè)計網(wǎng)頁的免費網(wǎng)格系統(tǒng)太多了，比如960GS，但是基于三分法的九網(wǎng)格系統(tǒng)可以幫你稍微調(diào)整網(wǎng)頁的布局，比如調(diào)整導航欄的高度，把Logo移近或移遠。

幸運的是，這種測試方法非常適用和簡單，沒有選擇任何軟件。分析完截圖，可以在PS里畫一條虛線。GIMP等開源免費軟件也能輕松幫到你。如果出了問題，可以直接在屏幕上畫個九宮格來分析...(據(jù)說盲狙在玩CS之初就用了這么笨的方法~)反正可以幫你搭建一個九宮格分析的工具，幫你找到準確的設(shè)計方向。

完成初稿，用三點法測試，然后進入下一步。隨著時間的推移，你會更清楚地知道如何將視覺元素放在正確的位置。

處理的對稱性

有時，在頁面中恰當?shù)貞脤ΨQ元素是非常有用的。但是在網(wǎng)頁設(shè)計中處處使用對稱設(shè)計就太盲目了。事實上，在藝術(shù)和攝影領(lǐng)域，不對稱布局的應用仍然占主導地位，因為它的相對大小和適當?shù)木嚯x使它更令人愉快，這也證明了不平衡的視覺設(shè)計更能吸引我們的注意力。

實際上，布局設(shè)計也有類似的原則和規(guī)范。例如，當您在頁面頂部應用大橫幅圖形時，它通常會占據(jù)頁面高度的2/3。同樣，標題和正文的字體大小也需要比較，讀者自然會注意到更大的橫幅圖形、標題和副標題。大小對比是一方面，另一方面還要考慮圖片和文字在頁面上的位置。簡單的應用三分法并不能保證作文的豐滿。把九個方塊放在頁面上，適當調(diào)整頁面上元素的位置和中心，會好很多。

二分法的優(yōu)點是可以兼容非對稱布局，也可以用來優(yōu)化對稱布局。兩種布局巧妙配合，借助三分法突出頁面重點，同時控制頁面平衡，可以訓練出優(yōu)秀的網(wǎng)頁。

最后的想法

大部分的藝術(shù)情境都沒有固定的規(guī)則，但是有可供參考的規(guī)則，在這些規(guī)則的基礎(chǔ)上不斷完善設(shè)計。像第三師一樣駕馭規(guī)律，理解這個規(guī)律的目標，深刻理解即使不是刻意應用，也會自然而然的在你的設(shè)計中表現(xiàn)出來，類似于第二本能。這個時候，你就有了打破常規(guī)的可能！

設(shè)計和藝術(shù)雖然有基本的區(qū)別，但并不是對立的。誠然，按照規(guī)則，你可以設(shè)計出更符合人們口味的作品，但打破規(guī)則，充滿個性和藝術(shù)感的設(shè)計作品卻并不令人印象深刻。

非常感謝您讀完創(chuàng)新互聯(lián)的這篇文章："如何利用攝影二分法優(yōu)化網(wǎng)頁設(shè)計？"，僅為提供更多信息供用戶參考使用或為學習交流的方便。我們公司提供：網(wǎng)站建設(shè)、網(wǎng)站制作、官網(wǎng)建設(shè)、SEO優(yōu)化、小程序制作等服務(wù)，歡迎聯(lián)系我們提供您的需求。

分享名稱：如何利用攝影二分法優(yōu)化網(wǎng)頁設(shè)計？
轉(zhuǎn)載源于：http://www.bm7419.com/news29/315579.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供服務(wù)器托管、微信公眾號、品牌網(wǎng)站設(shè)計、全網(wǎng)營銷推廣、虛擬主機、關(guān)鍵詞優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)