做好兼容性檢查讓您留住來訪客戶

　　很多企業(yè)做好官網(wǎng)以后就認(rèn)為可以坐等客戶來訪，詢盤會(huì)源源不斷的到來。事實(shí)上，每個(gè)客戶使用的訪問終端不一樣，看到的您的網(wǎng)站效果也會(huì)不一樣，有些情況下，瀏覽效果可能會(huì)是您意想不到的。

　　實(shí)際上目前市面上主流的終端分辨率可能比我們知道的還多，畢竟廠家可能會(huì)有公開市場(chǎng)的產(chǎn)品也會(huì)有行業(yè)定制市場(chǎng)的產(chǎn)品，這些產(chǎn)品可能擁有很不一樣的顯示分辨率。當(dāng)用戶使用這些終端瀏覽網(wǎng)頁(yè)的時(shí)候，由于終端分辨率的不同，瀏覽器渲染出來的網(wǎng)頁(yè)效果也會(huì)不同。

　　很多時(shí)候web工程師都會(huì)在自己唯一的一臺(tái)pc或mac上來開發(fā)網(wǎng)站，最終呈現(xiàn)的效果往往在某一種分辨率下最佳，而在其他一些分辨率上效果的好壞，往往與工程師的水平有直接關(guān)系。比如工程師的整體設(shè)計(jì)能力、編碼規(guī)范等。

　　目前市面上主流分辨率尺寸：

　　1024x768
　　1280x1024
　　1366x768
　　1440x900（Macbook）
　　1600x900
　　1680x1050
　　1920x1080（主流寬屏PC）
　　1920x1200
　　2560x1440（iMac）

　　想要留住客戶，那么第一步就得確保客戶在各種主流分辨率下都能擁有良好的視覺和操作體驗(yàn)。接下來我們看看如何使用chrome來測(cè)試網(wǎng)頁(yè)在不同分辨率下的顯示情況：

在chrome瀏覽器中增加屏幕尺寸方案

第一步，進(jìn)入開發(fā)者工具，如下圖所示：

點(diǎn)擊后進(jìn)入下圖所示的控制面板：

第二步，點(diǎn)擊開發(fā)者面板左上角的設(shè)備模式調(diào)整按鈕：

第三步，添加要測(cè)試的設(shè)備方案

點(diǎn)擊上面的編輯后，右側(cè)開發(fā)者面板變?yōu)橄聢D所示，我們可以點(diǎn)擊添加設(shè)備Add custom device 添加設(shè)備方案：

第四步，添加設(shè)備方案并填寫設(shè)備的尺寸信息，如下圖添加了一個(gè)1280x1024的桌面設(shè)備方案：

接下來我們?cè)跒g覽網(wǎng)頁(yè)的時(shí)候就可以選擇對(duì)應(yīng)的分辨率進(jìn)行瀏覽，如果我們選擇剛添加的1280x1024尺寸的設(shè)備進(jìn)行瀏覽，這就相當(dāng)于用一臺(tái)1280x1024的顯示器進(jìn)行瀏覽。