讓你的網站對行動裝置更友好的8大妙招

目前，移動流覽功能不斷普及提高，開始優化你的網站以更好地適應移動平臺和它的局限性將是你的第一要務。 有很多簡單的方法可以提高你的移動流覽網站，同時又不過多的改動你的網站，本文探討其中最流行且可以對可用性產生巨大的影響的8個。

流式佈局

讓您的網站液體寬度佈局是使您的網站的朝著對行動裝置友好的重要一步。 它不僅摒棄了你的網站周圍的多餘的死空間，他還可以使之在許多不同平臺和解析度下查看。 那麼究竟流體寬度是什麼意思呢？

流體寬度，顧名思義，就是您的網站可以根據瀏覽器的大小伸展活著縮放寬度。 它實施的容易程度取決於您的當前設置和佈局。 如果你有一個簡單易用的佈局，修改變CSS樣式表中的寬度屬性為以百分比來達到其效果是你唯一要做的。
沒有雜亂的廣告

雜亂的廣告是移動平臺上的重大問題上，即使網頁原本的佈局沒有被破壞，最終使用者看到的廣告可能比內容還多。 有一個簡單的修補程式來隱藏這混亂的現象而不必創建一個特定版本的移動網站。 你也可以創建針對手持設備的css樣式表，通過判斷終端的解析度大小來調用。

無論你使用一個，你應該永遠記住，大多數手持行動裝置有實際情況的限制，這意味著HTTP://www.aliyun.com/zixun/aggregation/18027.html">螢幕尺寸只能容納很少一些東西， 這極少的東西就是訪問您網站的使用者希望看到的那部分內容。

集中的內容

集中你的內容是因為這是行動裝置的使用者立即看到關鍵。 很多針對行動裝置的網站的往往會粘在了很多不必要的混亂的東西，例如圖像或廣告，但由於網站管理員必須瞭解，展示訪問者最關心的內容才是重點。
如果使用者是從手機訪問您的網站並沒有連接到有線網路上，頻寬受到一定的限制，這意味著使用者將選擇他或她想要訪問的網站，而不是他們的訪問那些在桌面上的網站。
這意味著，你需要確保你的網站在利用手機流覽佔用少量的頻寬，這意味著圖像應該是有限的，並且文字內容應為重點。 假使您的網站是內容是基於圖像的呢？
如果你的網站主要是基於圖像，你的第一要務是建立一個獨立的移動網站，針對移動平臺進行優化——通過降低圖像的大小和高度壓縮。 一種替代方法是創造適用，允許協力廠商應用程式的行動裝置的移動應用（app），這對為您的使用者來說可能是一個有用的工具。

跨平臺的友好連結連結和效果

隨著新的網路工具和影響繼續擴大，很難沒有漂亮的懸停提示或下拉導航或甚至一個連結通過JavaScript彈出的小窗來展示資訊。 然而，對行動裝置的使用者來說，這些效果和工具可能無法在他們的平臺使用，這就帶來了許多無用的連結和工具。 一個簡單的解決辦法，就是始終為不能查看或使用他們的使用者提供替代方案。
一些行動裝置允許JAVAscript，但在你的網站無論如何都不能使用你原有的效果，所以最好的辦法是檢測連接到您的網站的平臺類型，禁用或改變某些類型的工具和效果一遍適應得更好。

保持您的網頁簡短，結構緊湊

用於行動裝置的長頁面肯定是一個巨大的倒退，因為載入頁面需要花費大量的時間。 因此，保持你的網頁簡短、結構緊湊可以使你的網站跨平臺可訪問——即使在一台網速極低的設備上。 因為，使用者最不願意做的事情是等待網頁載入，而不是花時間流覽網站。

徹底的導航

眾所周知，由於其鍵盤或虛擬鍵盤用起來一點也不方便，輸入在大多數行動裝置就實實在在成為一種痛苦。 因此，為您的網站建立一個徹底的導航是一個關鍵環節，它可以使您的網站的移動體驗更加友好。 如果您提供的大量的內容，你需要確保使用者可以通過流覽找到他們而不必用使用搜尋引擎。 如果你不能在不適用搜索的情況下找到到你網站的某些部分，很有可能使用者也不能。

醒目而清晰的內容

今天，許多新的行動裝置是觸控式螢幕，這意味著使用者將可以使用他們的手指來導航他們的設備和您的網站。 如果您的網站的內容和連結不夠醒目，不夠清楚，通過你的網站導航將是一個痛苦。
要防止這種情況很容易，試著去消除那些分散在文章或段落的連結，因為它們被純文字包圍而難以點擊或按住。 相反，把這些連結放置到文本主題的上方或下方，同時保證他們足夠大，使用者就可以沒有困擾的用手指點擊它們。

簡短且易記的連結

這是另一種輸入相關的問題，如果使用者要輸入一個長URL才能到你的網站，很有可能他們不會這樣做。 如前所述，使用鍵盤或虛擬的鍵盤打字不適合長文字區塊，所以一定要確保你的網站有一個簡短易記的功能變數名稱。 此外，在您的網站儘量避開輸入工作也是理想的，因為通常他們通過快速指引或參考資訊訪問您的網站。

原文（英文）連結：

HTTP://designreviver.com/tips/8-ways-to-make-your-website-mobile-friendly/

譯者：leegang

來源：HTTP://www.ugoes.cn/8zhongtujingrangnidewangzhanduiyidongshebiegengyouhao-html.html