不得不承認Google在某些方面真的很用心，雖然Google不太宣傳自己家的產品，如果你有興趣去細挖Google產品的功能，你會發現Google的產品內總是會藏著一些讓人意想不到的驚喜。

前些日子工作熊因為要處理WordPress架設網站不適合用在行動裝置瀏覽的問題，所以找了一下【手機瀏覽模擬器】，結果大家都推薦這款Google出的Chrome瀏覽器，因為Chrome內建的除錯功能就包含有【手機瀏覽模擬器】，真是省了工作熊非常多的麻煩。

使用這個Chrome內建的除錯功能還可以幫我們檢查Analytics追蹤程式碼安裝是否正確，或是AdSense廣告程式碼是否有被安裝到手機板的版型中，可以即時提醒我們要把程式碼安裝到適當位置。對版型維護及程式設計師來說可是個非常好用的工具。

現在我們就來看看如何啟動Chrome的除錯功能與手機瀏覽模擬器吧！

步驟一、叫出Chrome的除錯程式

打開Chrome瀏覽器，然後在瀏覽器的右上角點擊有三條短橫槓（自訂及管理）的地方，打開功能表後，點擊【更多工具】，接著再點擊【開發人員工具】。其實有快捷鍵【Ctrl+Shift+I】可以直接叫出除錯程式，但是常常記不太住。（2019更新：現在按【F12】也可以當快捷鍵囉！）

步驟二、開啟手機瀏覽模擬器

在畫面的上方中間處的放大鏡右邊有個「手機」的圖示，點擊這個圖示一次可以切換到手機模式，再點一次會回到電腦桌面模式，不過切換後可能得按一下【F5】鍵盤按鍵，讓瀏覽器重新整理一下，才會重新載入真的切換過來。

在Chrome瀏覽器左上方的地方有個【Device】 可以選擇適合的手機機型。

步驟三、新增手機型號與解析度及螢幕大小

如果沒有發現自己想開發的手機型號，也可以在Chrome瀏覽器的右上角，點擊齒輪的「設定」圖示，然後按【Devices】，再按【Add customer device…】來新增機型號與解析度及螢幕大小。

後記：

Chrome的這個除錯程式及手機模擬器真的非常好用，工作熊在Firefox瀏覽器也經常使用Firebug除錯程式外掛來偵錯版型小修改時的CSS問題，這兩款都支援即時修改版型且即時顯示修改後的畫面，真的超推薦的。

延伸閱讀：
使用Google搜尋趨勢，尋找熱門關鍵字並決定文章標題
解決Chrome安裝後不能執行的問題，設定Windows7的EMET
使用第三方網站流量查詢工具(SimilarWeb)，驗證網站流量是否灌水