DIV CSS 佈局教程網

本期特約：海外美術團隊 Lyson

1.浏覽器的差別跟用戶分辨率差別是我們首先考慮的問題；

2.游戲頁面設計，需貼主題、游戲背景等主線關系；

3.布局跟文案很重要；

一、浏覽器的差別跟用戶分辨率差別是我們首先考慮的問題；

首先在這裡想要再次為新人提下，現在霸占互聯網最小分辨率的還會是1024用戶（特別是中國），加之IE、FF主流浏覽器的比例，由此特地整理了一個解說小圖。

在這張示意圖上我們能比較清晰的看出一個網頁在1024分辨率顯示器下的效果。由此我們在很早之前就定下一條不成文的規定，那就是網頁的核心內容寬度，最大絕對不超過980預留的一點點的空間，給用戶“透氣”。

但往往是我們還是很容易就把畫面給“填滿”，原因就是游戲網頁設計，早期它逃不開功能模塊框架的邊緣修飾，這種修飾還是不規則形態，

（這時候會像有些平房駐地，外頭非要弄點其他東西來擴建，不願意占用已經規劃好的區域一樣的道理。）

所以在此提醒同學們一定要學會“卡位”別“超界”

二、游戲頁面設計，需貼主題、游戲背景等主線關系；

主題、游戲背景，這兩個核心問題，設計師們一定要定位好，我們別拿什麼就直接做，我們需要過濾的東西有很多~！

1.什麼游戲？

2.什麼語種？

3.什麼主題？

4.文檔、布局（WORD/VISIO/AxureRP）？

5.頭腦風暴完的創意、色彩，是否貼近游戲背景跟本次主題？

三、布局跟文案很重要

每次的設計，設計師們最頭疼的事情就是這兩樣，為什麼呢？因為這兩個元素直接音響到了最後效果，在特殊情況下，比重達到50% – 80%；可以抹殺很多創意表現。

舉例（練習作品）：

文案突出型

結構突出型

我個人在做圖的時候習慣的會總結歸納以上提到的問題，從而一步步過濾，最後在紙上畫結構。（當然在這過程中肯定還有其他的內容，只是在這篇文章就不細提了）

最後重復：

1.浏覽器的差別跟用戶分辨率差別是我們首先考慮的問題；

2.游戲頁面設計，需貼主題、游戲背景等主線關系；

3.布局跟文案很重要；