網(wǎng)頁排版設計中對齊技巧能讓網(wǎng)站產(chǎn)生高端感（中）
時間：2023-09-04 20:42:02 | 來源：網(wǎng)站運營
時間：2023-09-04 20:42:02 來源：網(wǎng)站運營
網(wǎng)頁排版設計中對齊技巧能讓網(wǎng)站產(chǎn)生高端感（中）：上一期我們說過，網(wǎng)頁界面排版設計中通常包含左（或右）對齊、居中對齊三種方式。其中居中和左對齊是最為常見的，這兩者還可以結合起來一起使用。今天我們繼續(xù)通過國外優(yōu)秀的網(wǎng)頁設計作品來賞析網(wǎng)頁排版設計中的對齊運用技巧。
01.
首先提一下這個網(wǎng)頁設計組品的標志里有手寫的元素，界面中在色彩和手繪元素方面也得到了體現(xiàn)。在排版對齊方面，主體內(nèi)容寬度相對固定，logo采用了居中對齊的方式。所以下面的幾個模塊中，文字與對片都采用了居中對齊的方式與之呼應。
02.
這個網(wǎng)頁設計作品在排版布局方面采用了四平分界面的做法。而由上往下還繼續(xù)沿用了很淡的灰色線條來垂直評分界面。在主體內(nèi)容的分布方面，內(nèi)容與文字采用的是居左對齊，模塊與模塊之間，則是居左與居右對齊。
03.
這個網(wǎng)頁作品在排版布局上采用了虛實結合的做法。在對齊方面其實主要是以中間內(nèi)容的左右側為對齊的基線。
04.
這個網(wǎng)頁作品其實也是主要遵循了居中對齊與居左對齊的規(guī)律來排版。左側以slogan為基線。中間以平分屏幕中間線為基線。
05.
第五個網(wǎng)頁設計作品，主要是以主體內(nèi)容左右兩邊為對齊基線。但部分模塊的內(nèi)容區(qū)域，左右都做了縮緊處理。
06.
這個網(wǎng)頁作品之前有引用過。因為視覺上做的非常不錯。但需要注意，深色底圖上浮白色字，需要確保底色足夠深，讓文字閱讀起來清晰。在排版分布上，主要是一行三列的布局。其中個別模塊的三列為不均等寬度的。內(nèi)容對齊上，文字與圖片、模塊的對齊主要是以左對齊為主。
07.
居中對齊與居左對齊的結合運用案例。
08.
slogan與navigation，以及底部link底色的左對齊。
一個網(wǎng)頁設計作品能否在視覺上贏得用戶的好感，產(chǎn)生高端的視覺感，取決于網(wǎng)站界面中與用戶眼球相遇的東西。比如文字文案，圖片，顏色搭配，以及今天重點提到的文字、圖片的對齊規(guī)律。當我們能從界面中輕易發(fā)現(xiàn)有一種無形的對齊規(guī)律規(guī)劃者整站內(nèi)容的排版和分布時，這個作品就有了藝術感和讓用戶對網(wǎng)站產(chǎn)生美的印象。
在線咨詢