關於網頁pc端以及移動端的兼容性——測試

對於常常作網頁設計的人員來講，網頁的兼容性測試是不可缺乏的，記得剛來單位的新手，都是要安裝一款瀏覽器測試軟件的，看本身製做的網頁是否在各大瀏覽器中正常顯示，有沒有變形，或者網頁效果不兼容等。

不只僅是新手學習的過程當中會遇到，即便是資深的前端程序員，網站樣式的兼容性每每很讓人頭疼，雖然W3C提出了一套標準，可是瀏覽器廠商每每不會徹底按照標準來，這當中以微軟爲最奇葩的表明，每代IE都各有特色，問題也不只僅存在於IE身上，其餘瀏覽器也很難說本身就沒有問題。因此在設計網站時必定要注意瀏覽器兼容性。

　　第一：做爲網站前端設計人員遇到任何問題必定是先找出緣由

　　其實，瀏覽器兼容性問題主要來自於兩個方面：css樣式兼容性和javascript腳本兼容性，雖然兼容性問題出如今這兩方面，可是這裏面的問題之多，不是幾百個字的文章能說得完的，今天筆者也只能簡單的說一些原則性的注意點，能夠幫助改善瀏覽器兼容性問題。

　　一、css兼容性問題：瀏覽器的數量太多，咱們只能針對內核來進行劃分，這樣主流的瀏覽器主要是三個內核：微軟的trident內核、FF的mozilla內核、chrome爲表明的webkit內核。其中微軟又有問題就是IE六、七、8等等雖然是一個系列的內核，但對css的解釋又存在不一樣。整體來講作瀏覽器兼容性測試只要測試經過了上述瀏覽器，通常問題就不大了。在css兼容性問題有一種是所謂先天缺陷，就是某些標籤、樣式自己就存在不兼容，例如咱們再寫DIV透明的時候，那麼IE6解析與其餘瀏覽器自己確實就不相同;或者是PNG圖片在IE不兼容，那麼這種問題應該說是「真正的不兼容」。同時要注意若是不是必要，不要採用自動高寬方式，儘可能限制好頁面內元素的高寬，這樣能夠最大限度的處理好css樣式兼容性問題。

　　二、javascript兼容性問題：這個也是個很是麻煩的問題來源，主要的問題依然來自於IE瀏覽器系列和其餘瀏覽器的差異：IE調用的是系統組件，而其餘瀏覽器調用的本身內建的組件，這就形成了你必須針對不一樣的瀏覽器調用不一樣的組件，最典型的方面莫過於ajax。但其餘瀏覽器之間的問題也同樣很多，我見過的問題就有：RGB值的表示方式的不一樣，offsetleft取出的值不一樣，還有前篇文章提到的readystate的解釋不一樣等問題。javascript的問題有至關一部分能夠靠一些腳本插件如jquery來改善，但要想作完善，須要針對不一樣瀏覽器進行詳細的測試。

　　第二：瀏覽器兼容性測試工具要齊全有一個好的工具能幫助你省很多的事!

　　通常來講我用的是IETest和IE Collection這兩個工具。IETester能夠幫咱們模擬頁面在IE5.五、IE六、IE7與 IE8 beta1等瀏覽器的相容性，驗證CSS樣式或網站版面是否能夠在各個主要瀏覽器正常顯示。IETester以「分頁標籤」的方式分別在不一樣的頁籤中顯示，軟件採用了相似於Office2007的界面呈現方式，使用起來很是方便。

　　除了IETester，另外還有IE Colection也能夠解決多IE版本共存問題。 IE Collection包含了IE1.0、1.五、3.0、5.五、6.0、7.0、8.0等版本的網絡瀏覽器。經過IE Collection，設計師能夠在不一樣的IE裏面測試版面樣式與功能。此外，IE Collection還提供了Internet Explore Developer Toolbar工具，經過這些工具檢查網頁內容的樣式、版面錯亂或程序錯誤等。

 

 

 

網頁設計界有這樣一句話，只要網頁在火狐瀏覽器中兼容性沒有問題，哪麼在其餘瀏覽器中出現兼容性的問題可能性就很小，這要得易於火狐瀏覽器對於網頁代碼的嚴格規範有關了，火狐瀏覽器對網頁代碼的嚴謹程度使得得許多網頁設計者都喜歡使用火狐來進行排版與測試，不得不說火狐是一個好的網頁測試工具，以下圖所示：

 

 

移動網頁兼容性測試主要測試不一樣移動設備顯示上網站的顯示效果。因爲用戶移動設備或者瀏覽器每每不一樣，若不進行測試，會出現樣式錯亂或者圖片沒法顯示等問題。對於前端開發工程師來講，確保代碼在各類主流設備和瀏覽器的各個版本中都能正常顯示,所以要對編寫出來的網頁進行兼容性測試。

 

 

 

 

 

最後，要告訴你們咱們在作網站的時候就要考慮到用戶的瀏覽習慣，以大多數用戶的瀏覽習慣爲主，調整網站的兼容性。你們也知道，如今的瀏覽器各式各樣，每一個人的瀏覽習慣也各不同，作爲網站的前端設計師就要考慮到這一點。網站在設計開發的時候要注意調好兼容性，對網站進行多個主流瀏覽器的兼容性調試，可以有效的保證您的網站在多個瀏覽器下正常的瀏覽。