關(guān)于后臺(tái)網(wǎng)頁(yè)的設(shè)計(jì)有很多不可違背的原則，還有排版、頁(yè)面布局和視覺(jué)的影響等等；最后就通過(guò)一些制作效果還不錯(cuò)的后臺(tái)網(wǎng)頁(yè)，來(lái)講解一些不可缺少的原則。
下面就主要講解：板塊和字體的親密性、對(duì)齊、對(duì)比、重復(fù)這幾個(gè)不可缺少的原則，板塊的親密性分為2大部分：橫間距之間的關(guān)系和縱間距關(guān)系。前者為了適用不同尺寸的屏幕，在橫向采用柵格布局來(lái)排版里面的東西，從而保證布局的靈活性。后者則是通過(guò)小號(hào)、中號(hào)、大號(hào)這3種間距來(lái)規(guī)格來(lái)進(jìn)行劃分信息層次。
對(duì)齊大概就3種：文案類(lèi)對(duì)齊、表單類(lèi)對(duì)齊、數(shù)字類(lèi)對(duì)齊。文案對(duì)齊作用在于：頁(yè)面的字段或段落較短、較分散的時(shí)候，就需要一個(gè)統(tǒng)一的視覺(jué)起點(diǎn)。表單類(lèi)對(duì)齊：讓用戶(hù)的視覺(jué)順著冒號(hào)的視覺(jué)流，就能找到所有填寫(xiě)項(xiàng)，從而提高填寫(xiě)效率。數(shù)字類(lèi)對(duì)齊：為了快速對(duì)比數(shù)值大小、所有數(shù)值取相同有效位數(shù)，而且都是右對(duì)齊。如圖所示：（從前者到后者依次放圖）

對(duì)比主要分為主次關(guān)系、總分關(guān)系、狀態(tài)關(guān)系3大關(guān)系對(duì)比，前者為了讓用戶(hù)在操作上快速的做出判斷。來(lái)突出其中一項(xiàng)相對(duì)重要的操作?？偡株P(guān)系：通過(guò)調(diào)整排版、字體、大小等方式來(lái)突出層次感，區(qū)分總分關(guān)系，使得頁(yè)面更具張力、節(jié)奏感。后者則是通過(guò)改變顏色、增加輔助形狀等方法來(lái)實(shí)現(xiàn)狀態(tài)關(guān)系的對(duì)比，以便用戶(hù)更好的區(qū)分信息。狀態(tài)關(guān)系常見(jiàn)的類(lèi)型有：靜態(tài)和動(dòng)態(tài)對(duì)比。

如圖所示：（從主次到狀態(tài)關(guān)系排列）

關(guān)于重復(fù)就很簡(jiǎn)單了，重復(fù)的元素可以是點(diǎn)、線(xiàn)、面等一些設(shè)計(jì)要素、格式、風(fēng)格等等。只要是有規(guī)則的重復(fù)，又符合原則就可以。

說(shuō)了那么多原則，下面就通過(guò)上面的這張圖來(lái)詳細(xì)講解。這張是關(guān)于交通的后臺(tái)網(wǎng)頁(yè)，先看最左邊灰色區(qū)域的板塊，在看每一條icon和對(duì)應(yīng)的文字，從左到右看都是左右對(duì)齊的，除了首頁(yè)不一樣以外。親密度也布置很得當(dāng)，從橫縱間距看給用戶(hù)的視覺(jué)影響不會(huì)覺(jué)得太緊密或太松散。字體的大小也很合適，而且1剛剛在每個(gè)板塊的中間位置。
然后最上方的黑色部分的矩形板塊，logo的布局和旁邊的名稱(chēng)上下大小距離一樣，左右間距也是按照整個(gè)頁(yè)面的布局進(jìn)行的，這樣就不會(huì)然人覺(jué)得有不規(guī)則的感覺(jué)。右邊的內(nèi)容形成了一個(gè)信息的對(duì)比，通過(guò)一些紅色的形狀提示，使用戶(hù)能夠快速的查詢(xún)信息。因?yàn)榧t色在各種色彩中吸引力是最強(qiáng)烈的。

如上圖部分，分成2個(gè)部分的板塊，一邊是字較多的部分和可視化圖表的部分，先看左邊的部分，都有這對(duì)齊、親密度、重復(fù)、對(duì)比的原則。從商品移庫(kù)、停售到損益管理形成了一個(gè)流程的一個(gè)排版。里面的箭頭符合和icon都重復(fù)排版布局。字體都以從左到右對(duì)齊，里面的內(nèi)容是如此，整個(gè)管理也都是左右對(duì)比、對(duì)齊排版以突出重要性。
關(guān)于右邊的可視化圖表我就不詳細(xì)講解了，因?yàn)橹耙呀?jīng)講解過(guò)了。只是對(duì)這些圖表在整個(gè)頁(yè)面講解較為突出的作用。從整個(gè)圖表來(lái)看，劃分為3大部分的圖表。雖然上面的曲線(xiàn)圖和以矩形里的數(shù)字來(lái)突出信息的圖表，有些視覺(jué)上的不一樣。但它們都是同一類(lèi)型有著聯(lián)系關(guān)系的呼應(yīng)。有著很相近的感覺(jué)；所以這樣劃分。
在這些圖表中就只是曲線(xiàn)圖、柱形圖的表達(dá)方式。還有矩形顏色填充突出的一些數(shù)據(jù)。但對(duì)于查詢(xún)和描繪信息和數(shù)據(jù)，這些圖表的作用，也已經(jīng)體現(xiàn)在這個(gè)后臺(tái)網(wǎng)頁(yè)中了，給用戶(hù)視覺(jué)和實(shí)用價(jià)值上有這很大的效果就已經(jīng)算是一個(gè)很不錯(cuò)的后臺(tái)網(wǎng)頁(yè)了。至于內(nèi)容方面之后還可以修改和完善。
最后總結(jié)：后臺(tái)網(wǎng)頁(yè)的制作和設(shè)計(jì)，是離不開(kāi)這些必要的原則的，要想制作一個(gè)接近完美的后臺(tái)，就必須遵守原則，還有所謂現(xiàn)代化的實(shí)用價(jià)值。

總結(jié)

以上是生活随笔為你收集整理的关于后台网页设计的原则的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。