iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 18
1
Modern Web

三十哩路,我的前端學習路程系列 第 18

Day18::我所知道的 CSS重構 第五章測試

第五章 測試

測試

測試CSS可能會很困難,因為有許多不同的平台、螢幕尺寸、與裝置形體(form factors)需要進行測試。

測試為何困難?

如果要徹底檢測CSS的變動,會耗費許多時間和補助工具。
需要思考的因素:

  1. 檢測網頁的瀏覽器是哪一種?
  2. 如何對不同作業系統或以上的幾種瀏覽器進行測試?
  3. 檢視網頁的視窗尺寸為何?
  4. 如何對不同作業系統?
  5. 如何迅速檢測為數眾多的網頁?
  6. 如何確認所見的結果是正確的?
  7. 如何在無法取得某些特定裝置的情況下,在這些裝置上檢測網站?

哪些瀏覽器對測試而言是重要的?

理想上,你只需要支援有一定數量的使用者來檢視網站的瀏覽器即可
透過分析工具就可以很容易地解析出使用者用來瀏覽網站的瀏覽器與裝置的各種版本

瀏覽器市佔率

支援近幾年釋出的主要瀏覽器是很重要的工作。
Chrome、Firefox、Safari、Edge與其行動裝置的版本大部分都已符合標準的規範,瀏覽器行為不一致的情況也較之前少。
若使用舊版瀏覽器的網站使用者並不多,也許就不需要特別為這些舊瀏覽器去維護樣式碼。

從Google Analytics取得瀏覽器與螢幕解析度的統計資料

Google Analytics是google所提供的免費服務,也是最常見的分析套件;能追蹤網站流量、使用者的操作行為以及提供其他網站瀏覽資訊等。

伺服器資訊

當"Browser"被選成主要考量時,瀏覽器資訊可在GA中的Audience -> Technology -> Browser & OS選單下找到。
這些資訊可讓你瞭解有哪些瀏覽器會被用來瀏覽你的網站,若你發現花了不少時間編寫CSS以支援的舊版瀏覽器,並沒有很多人用它來瀏覽你的網站,你應該思考停止對這些瀏覽器的支援。

螢幕解析度

當"Screen Resolution"被選成主要考量時,螢幕解析度資訊也可在GA中的Audience -> Technology -> Browser & OS選單下找到,這些資訊呈現出用來瀏覽你的裝置螢幕尺寸為何。


上一篇
Day17::我所知道的 CSS重構 第四章之三
下一篇
Day19::我所知道的 CSS重構 第五章之二
系列文
三十哩路,我的前端學習路程30

尚未有邦友留言

立即登入留言