中山網(wǎng)頁設計、網(wǎng)站制作公司 藍圖科技

我們提供本土專業(yè)的網(wǎng)站建設方案，一流的設計師成就你不一樣的企業(yè)網(wǎng)站建設，優(yōu)質(zhì)設計是我們對客戶最好的回饋，因此規(guī)范的網(wǎng)頁設計是給用戶最好的保障。

如何做一個規(guī)范的網(wǎng)頁設計呢？

一、網(wǎng)頁尺寸

一般企業(yè)網(wǎng)站設置的寬度為996px；但是隨著4：3的顯示屏的普及，國內(nèi)網(wǎng)站大部分開始以1000個像素為界限，如果擔心還有一些老用戶會使用老式顯示屏的話，建議不超過1000像素去適合在所有的屏幕瀏覽，因為小屏幕會顯得擁擠，給人不美觀的設計布局。因此保守的尺寸設置，這樣可以保證大部分用戶舒適的瀏覽網(wǎng)頁。

二、主流瀏覽器

當前比較流行的瀏覽器(chrome、IE、360、firefox、qq瀏覽器、遨游、百度等)都有自己的一個內(nèi)核，雖然基本上一樣，但是也有自己的一些特色，因此網(wǎng)頁顯示的時候會有一些不同，知道了瀏覽器的設計特點才能更好的設計頁面，比如瀏覽器的頭部的操作高度和信息的展示都會有所不同，那么頁面在每個瀏覽器上面的展現(xiàn)就會有所不同。還有在代碼處理上也要嚴格地去適應各個瀏覽器的一些規(guī)則，不然當這個瀏覽器可以正常打開，另一個又會打開亂碼的情況。規(guī)范的網(wǎng)頁設計對于后期的網(wǎng)站制作也有一定的幫助。

三、點擊操作

在網(wǎng)頁上，頁面的跳轉(zhuǎn)只有通過鼠標點擊、滑動、滾動、拖拽來達到跳轉(zhuǎn)的效果，因此網(wǎng)頁設計的時候也要主要你的設計是做哪個動作。

四、html5頁面（和web頁面相似的一個頁面。手機上的網(wǎng)頁稱作為H5。）

概念：采用Html5語言寫出的App，不需要下載安裝。生存在瀏覽器中的應用，基本上可以說是觸屏版的網(wǎng)頁應用。

屏幕適配：由于受限于H5頁面在移動設備上的屏幕是各種各樣的。對設計影響比較大的主要是屏幕分辨率、尺寸、屏幕方向這些因素。而H5頁面會有非常多的一個屏幕尺寸，那么在不同的屏幕下的界面適配就成了一個很大的問題。解決的辦法就是通過響應式網(wǎng)站的設計方法來提升在不同分辨率下的兼容性。

響應式設計概念：指的是不同設備、屏幕、分辨率、操作方式（鼠標、鍵盤、觸摸），保證信息在不同環(huán)境下表現(xiàn)一致，保證可交互可操作。做響應式設計時需要遵循一個原則。

由于頁面的寬度發(fā)生了變化，進而信息展現(xiàn)也改變了就是響應式設計。相對響應式設計有深入了解，可參考《響應式網(wǎng)站制作》直到最后在手機屏幕上的顯示圖片信息變成了一列或者兩列。

1、臨界點：當頁面寬度發(fā)生變化的尺寸范圍就是臨界點的概念。所以做響應式設計時我們需要知道每一個尺寸的寬度范圍在多少時我們就可以制定出相對應清晰的一個臨界點，制定了臨界點之后就知道，當屏幕的寬度范圍位于哪一個點的時候，我們的頁面信息該如何展示。

2、刪格：將頁面分成幾欄、幾塊。

以上是以12刪格為基礎的案例。它的設計原則就是將頁面分成12個等分的欄，然后把頁面的內(nèi)容設計在12欄內(nèi)。比如左邊的一些商品展示它用到了一個刪格的單位；其中的一個最大面積的商品展示它用到了比較多的刪格；最右側(cè)的操作信息用到了四個刪格的比例。

中山網(wǎng)站建設 網(wǎng)頁設計 網(wǎng)站制作 建站專線 ：15900092217