寬屏顯示下的網站網頁寬度

當前的前端設計師有一個苦惱，就是用戶屏幕顯示分辨率的各不相同，并不能只按照一個模式設置網站的寬度，特別對于寬屏用戶來說更為煩惱.根據我的博客上月統計，1024×768分辨率的用戶只占到50%，并且在逐月下降，而1280-1440這三個分辨率的用戶則達到了35%，如果按照這個速度發展下去，明年就會超過1024分辨率，這說明，使用17寸普屏的用戶正在加速減少，而17、19寸寬屏用戶正在穩步逐步增加，這給前端設計師的一個考驗是，不能只考慮1024×768分辨率的用戶了，要想想大屏幕寬屏用戶的瀏覽體驗了。

　　Google Reader是一個典型的內容閱讀性質的網站，用戶在上面閱讀時間非常之長，那么，Google的前端設計師是怎么考慮這個問題的呢？

　　大家可以做一個實驗，在19寸寬屏下，如果網站頁面全文顯示，鋪滿整屏，那么閱讀的時候，眼睛需要從左轉到右，才能閱讀完一行，屏幕越大，這種效果越明顯，因此，一個讓用戶大量閱讀的網站，為了照顧好讀者的眼睛，在大屏幕寬屏下，也不應該全屏鋪開的顯示文字內容。

　　在1024×768分辨率下，使用Google Reader時，會發現內容是全屏顯示的，但是，使用19寸寬屏在1440×900分辨率下打開Google Reader，會發現這時并沒有寬屏顯示內容，右邊留出了一大塊空白，如下圖顯示。

　　使用工具測量寬屏下Google Reader的內容顯示像素，結果是955個像素，很有趣的數字。

　　我在《更改博客頁面寬度到960像素》一文中已經提到了，現在的網頁設計的行業標準應該就是950/960像素寬度，這個寬度應該是人眼在不轉動的情況下能看到的極限了，實際閱讀區域正文的寬度是650像素，Google Reader的這個設計很有意思。

　　在Google搜索引擎中，搜索結果的顯示寬度確是另外一個數字580像素，這是又一種內容寬度設計，Google這么做的原因估計是為了更好的顯示右側廣告。

　　我的博客最初使用的是778像素這個寬度，在2008年的那次改版后，修改為878像素寬度，主要是為了修改方便，直接加了100像素，正文區域的閱讀寬度是668像素，左側側欄寬度是200像素。不過，今年的改變，我的博客的整體寬度修改為960，正文區域的寬度是728像素，728的寬度僅僅為了好放Google AdSense而已。

 

當前文章：寬屏顯示下的網站網頁寬度
標題來源：http://m.kartarina.com/news15/38915.html

成都網站建設公司_創新互聯，為您提供網站內鏈、小程序開發、網站排名、企業網站制作、關鍵詞優化、面包屑導航

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯