不擅長(zhǎng)界面設(shè)計(jì)，但是又想與設(shè)計(jì)妹妹和諧友愛(ài)的開(kāi)展工作，你想過(guò)木有來(lái)來(lái)了解學(xué)習(xí)一下網(wǎng)頁(yè)設(shè)計(jì)的排版布局小知識(shí)呢？至少這樣設(shè)計(jì)菇?jīng)霾粫?huì)淚眼婆娑的看著你把她辛苦打造的設(shè)計(jì)稿，最后改的面目全非。拿出一點(diǎn)敲代碼或者看片的時(shí)間來(lái)欣賞下本文的案例吧。

因?yàn)橹v大道理也沒(méi)用，就先來(lái)看看這些網(wǎng)頁(yè)案例的截圖吧：）你肯定會(huì)有收貨的，至少不會(huì)覺(jué)得世界還是被table包圍的！

1、圓形，完美而不受拘束的形狀。

希望引起看客注意的文字、鏈接等部分，你可以為它們?nèi)旧响n麗的色彩，注意一小點(diǎn)就可以了——如果到處都是亮色，就沒(méi)有亮色了...

2、一個(gè)個(gè)人主頁(yè)，大大的純黑hello，不由得讓人聯(lián)想到主人的隨性、灑脫、熱情，或許還有那么一點(diǎn)兒無(wú)厘頭的可愛(ài)...

3、居右排版，左邊只給出一個(gè)清晰的攝氏度標(biāo)志，投在頁(yè)面上的影子呈現(xiàn)出立體的效果，take the temperature——consider，類比很特別，想法讀來(lái)很窩心~~

4、親愛(ài)的coder們，如果你對(duì)黑白色感到膩味了，#43BBEF是個(gè)很不錯(cuò)的選擇：清爽、敞亮、優(yōu)雅。
據(jù)說(shuō)，每一個(gè)coder都必須和英文打交道，據(jù)說(shuō)，英文排版的話居中總是沒(méi)錯(cuò)的...

5、圓形鏈接背景，圖文混排，文字顏色有深淺區(qū)別，不多說(shuō)

6、這就是傳說(shuō)中的網(wǎng)格背景了，避免單調(diào)的最好辦法就是打格子，設(shè)計(jì)師肯定懂的，面對(duì)一張新建的空白稿紙，第一步，顯示網(wǎng)格。
不過(guò)，英文排版與中文還是有些區(qū)別的，至少字體種類比中文豐富很多很多，但是——我們有驚艷飽滿的繁體字！
從小我就覺(jué)得，會(huì)寫(xiě)繁體字顯得很有文化...

7、與6中不同，這種風(fēng)格適合喜歡攝影又文藝的coder們，好處自不必多言:)。

8、這種比較復(fù)雜，怕麻煩的coder請(qǐng)繞開(kāi)走，不過(guò)，應(yīng)該可以找到現(xiàn)成模板的，修改背景圖片為自己喜歡的，ok。

>

9、你喜歡這個(gè)圖么？我很喜歡，簡(jiǎn)潔大方的灰色系，年幼時(shí)看的動(dòng)畫(huà)片里物品的風(fēng)格，優(yōu)雅中透著溫馨...

10、標(biāo)題居中，綴飾花紋，畫(huà)一般的字體，很樸素，很優(yōu)美。

11、淡淡的驕傲感從這個(gè)圓形頭像和簡(jiǎn)單的文字說(shuō)明里流了出來(lái)...話說(shuō)圓形頭像真的很別致，建議用彩色照片...

12、我的163博客...一直想搬出去自己搭建，又比較怕麻煩...這個(gè)頁(yè)面，也很簡(jiǎn)潔，菜鳥(niǎo)程序媛一枚。

轉(zhuǎn)載請(qǐng)聲明：圖片來(lái)源：shijue.me，文字編輯@親愛(ài)的蔥。

 
================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是一個(gè)分享網(wǎng)頁(yè)設(shè)計(jì)、無(wú)線端設(shè)計(jì)以及PS教程的干貨網(wǎng)站。
【特色推薦】
設(shè)計(jì)講座：每月邀請(qǐng)國(guó)內(nèi)互聯(lián)網(wǎng)公司設(shè)計(jì)前輩及行業(yè)總監(jiān)在群內(nèi)及YY語(yǔ)音（YY頻道：15335158）分享實(shí)戰(zhàn)經(jīng)驗(yàn)。
設(shè)計(jì)微博：擁有粉絲量27萬(wàn)的人氣微博@優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁(yè)設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com
———————————————————–
想在手機(jī)上、被窩里獲取設(shè)計(jì)教程、經(jīng)驗(yàn)分享和各種意想不到的"福利"嗎？
添加 優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) 微信號(hào)：【youshege】?jī)?yōu)設(shè)哥的全拼
您也可以通過(guò)掃描下方二維碼快速添加：