如何測試自己的網頁

如何測試自己的網頁?

今天我來介紹一些網頁測試工具。 我們要測試我們網頁到底好不好, 快不快。因為網頁設計有一半是給人看另外一半是給Google機器人看。

所以我們程式品質會影響Google機器人對我們網站的了解,然後就會影響我們網站在Google的排名。

那我來介紹5個我常用的測試工具

1. 速度測試工具

Google Page Speed
Google Page Speed

第一個就是Google Page Speed Google 本身有提供測試工具讓我們開發者檢查我們的網頁。網頁速度是一個很重要的評分關鍵。 很多時候使用者還沒完全載入你的網頁就離開網頁了。有一個研究指出如果網頁在3秒鐘還沒載入完,使用者就會離開。

Google page speed 會跑報告然後跟我們建議那邊程式可以優化。 大部分的建議可以分為圖片優化,程式碼壓縮,伺服器設低。

Google page speed 連結

2. 響應式網頁檢查工具

Responsinator
Responsinator

這兩個工具檢查我們的網頁是否符合響應式設計。 工具有提供不同尺寸的遊覽器,讓我們預覽網頁在不同尺寸的樣子。

Responsinator連結

Responsive Design Checker連結

3. 編碼驗證工具

HTML W3C Validation
HTML W3C Validation

用程式碼檢驗工具, 來檢驗我們的程式碼有沒有寫錯。有時候這些error在遊覽器看起來是沒有差,但是說不一定對google 爬蟲有差, 這個是我們沒有辦法確認的。

Code validator 主要看的是error, warning(警告)其實還好。

HTML 檢查網站連結

CSS 文法檢查網站連結

4. SEO 分析工具

Neil Patel Seo Tool
Neil Patel Seo Tool

SEO analyzer 是檢查我們的On Page SEO 有沒有做好。 On page SEO 就是我們該有html 標題有沒有用對地方,圖片有沒有加註解,讓我們的網頁跟簡單讓Google爬蟲爬資料

Neil Patel SEO Analyzer

5. 快取檢查工具

最後一個就是檢查我們的網頁有沒有啟動快取跟壓縮的動作。這兩個動作會讓我們的網頁快速很多

Gift Of Speed Gzip Test

關於作者: Danny Huang

大家好,我是Danny,是位熱愛程式的前端工程師,具有豐富工作與接案經驗。我在這裡會陸續推出一些網頁開發,線上行銷的文章。 如果喜歡這方面的文章可以加入email list。