Chrome 推出Lighthouse 前端稽核功能- 為了更好的SEO 與使用 ...

文章推薦指數: 80 %
投票人數:10人

Chrome 開發團隊不斷開發與改進瀏覽和最佳化體驗功能。

在Google I/O '17 開發者大會上向外界展示了很多重要的演化,其中一部分是有關Chrome DevTool,因此作為前端開發 ... RecentPosts Magento2設定Braintree金流(Sandbox模式) Photoshop【超簡單系列】NeuralFilters-超縮放 Categoryattribute無法存入表單為0值 如果使用Cloudflare取IP的問題和解決方法 Photoshop【超簡單系列】NeuralFilters-彩色化 文章分類 Shopify Magento Magento2開源版 Magento2商業版 電子商務 Zendesk Mailchimp Akeneo PIM Oracle 網站技術與設計 Adobe教學 前端開發 後端開發 網站測試 Wordpress 行銷與實用好文 最新動向 文章彙整文章彙整 SelectMonth April2022 (5) March2022 (12) February2022 (4) January2022 (1) December2021 (6) November2021 (1) October2021 (7) September2021 (7) August2021 (11) July2021 (7) June2021 (14) May2021 (11) April2021 (6) March2021 (6) February2021 (12) January2021 (8) December2020 (13) November2020 (7) October2020 (15) September2020 (7) August2020 (14) July2020 (2) June2020 (17) May2020 (14) April2020 (17) March2020 (21) February2020 (4) January2020 (2) December2019 (4) November2019 (3) October2019 (7) September2019 (11) August2019 (13) July2019 (2) June2019 (10) May2019 (14) April2019 (11) March2019 (8) February2019 (9) January2019 (14) December2018 (16) November2018 (20) October2018 (22) September2018 (30) August2018 (22) July2018 (36) June2018 (24) May2018 (21) April2018 (12) March2018 (32) February2018 (15) January2018 (15) December2017 (39) November2017 (15) October2017 (13) September2017 (13) August2017 (14) July2017 (4) June2017 (16) May2017 (15) April2017 (9) March2017 (7) February2017 (6) January2017 (12) December2016 (14) November2016 (6) October2016 (12) September2016 (11) August2016 (18) July2016 (12) June2016 (16) May2016 (9) April2016 (10) March2016 (15) February2016 (14) January2016 (18) December2015 (21) November2015 (32) October2015 (24) September2015 (28) August2015 (25) July2015 (26) June2015 (23) May2015 (15) April2015 (18) March2015 (16) February2015 (21) January2015 (17) December2014 (22) November2014 (20) October2014 (15) September2014 (13) August2014 (11) July2014 (12) June2014 (9) May2014 (10) April2014 (11) March2014 (6) January2014 (1) November2013 (5) October2013 (2) 關於歐斯瑞 Back 工作機會 Magento Back Magento解決方案 Back Magento服務 MagentoOpenSource MagentoCommerce MagentoCommerceCloud MagentoOMS MagentoXMiraklB2B2C商城 MagentoforB2B/B2E Magento內部系統串接 Back ERP管理系統整合  PIM商品管理系統整合 POS系統整合 CRM客戶管理系統整合 Magento外部系統串接 Back 各國金流系統 第三方客服系統 Magento健檢中心 Back Magento1升級Magento2 Magento維運服務 MagentoforHeadless&PWA Back MagentoforHeadless&PWA Shopify 企業電商顧問 Back 電商轉換率分析CRO 網站速度優化 AWS主機伺服器建置維運服務 成功經驗 Back 客戶成功案例 客戶回饋 新知分享 Back Magento Shopify 聯絡我們 Chrome推出Lighthouse前端稽核功能–為了更好的SEO與使用者體驗ByAstralWeb4yearsagoNoComments首頁 / 行銷與實用好文 / Chrome推出Lighthouse前端稽核功能–為了更好的SEO與使用者體驗 Chrome開發團隊不斷開發與改進瀏覽和最佳化體驗功能。

在GoogleI/O’17開發者大會上向外界展示了很多重要的演化,其中一部分是有關ChromeDevTool,因此作為前端開發者自然也受其影響。

Chrome60在DevTool中加入了很多新的項目,而最令人驚喜的是全新的Audits面板。

新的Audits面板基於Lighthouse,它提供了一整套全面的測試環境来评估網頁的品質。

稽核類別分別是網站的效能、無障礙程度、漸進式網路應用程式相容性等等,並提供改善網站品質的明確方法。

“這款工具正如其名(Lighthouse代表「燈塔」),可以「協助您避免觸礁」。

”–截至google中文網站管理員–中文網誌 在本文中,我們將研究一下Lighthouse,簡單說明它的架構!   另外提供GoogleI/O’17開發者大會有關Lighthouse的一段演講: StayingofftheRocks:UsingLighthousetoBuildSeaworthyProgressiveWebApps(GoogleI/O’17)   使用入門 執行Lighthouse有三種方式: 1.使用開發者工具(Devtools)的Audits(Chrome版本需60或更高)–圖片截至google中文網站管理員–中文網誌   2.或安裝LighthouseChrome擴充功能後,進入希望稽核的網站後,點選Lighthouse擴充功能圖示,按下Generatereport便可以開始檢查,簡單又直覺   3.或直接進入https://developers.google.com/web/tools/lighthouse/run 輸入想要稽核的網站URL   執行後會跑出報表顯示各個項目的結果與分析,一共有五大類別   Performance:網站的效能 網頁在瀏覽器上下載和顯示的速度。

性能優化是提高網頁效能的技術領域。

  ProgressiveWebApp:WebApp分析項目(PWA) 為了幫助團隊創造最好的體驗,Lighthouse整理了一份詳細的清單,列舉出想要 創建一個BaselinePWA需要滿足的條件。

  Accessiblity:網頁無障礙(非典型使用者體驗) 某些使用者以不同於預期的方式拜訪網頁或進行交互,而網頁無障礙類別則測試於屏幕閱讀器能力和其他輔助技術是否能在頁面中正常運作。

  BestPractices:網站最佳實踐 最佳實踐類別提供一些建議,使頁面現代化,並避免性能陷阱。

例如應用程序缓存,HTTPS使用,不推薦使用的API,用户權限請求等等。

這部 分包含“失敗和通過的測試列表”。

  SEO:網頁搜尋引擎最佳化 使搜尋引擎能夠更容易找到網站,適當調整網站內容讓引擎更容易建檔。

  報告頂部的分數是每個類別的總分。

其餘部分是決定得分的每一測試項目的具體描述。

每個類别分析结果都會以適當的结構展示在指定的面板中。

而這些評分標準和優化項目可以視為Google的網頁最佳實踐建議!   參考網站: https://webmaster-tcn.googleblog.com/2018/02/lighthouse-chrome-seo.html https://developers.google.com/web/tools/lighthouse/ RecentPosts Magento2設定Braintree金流(Sandbox模式) Photoshop【超簡單系列】NeuralFilters-超縮放 Categoryattribute無法存入表單為0值 如果使用Cloudflare取IP的問題和解決方法 Photoshop【超簡單系列】NeuralFilters-彩色化 文章分類 Shopify Magento Magento2開源版 Magento2商業版 電子商務 Zendesk Mailchimp Akeneo PIM Oracle 網站技術與設計 Adobe教學 前端開發 後端開發 網站測試 Wordpress 行銷與實用好文 最新動向 文章彙整文章彙整 SelectMonth April2022 (5) March2022 (12) February2022 (4) January2022 (1) December2021 (6) November2021 (1) October2021 (7) September2021 (7) August2021 (11) July2021 (7) June2021 (14) May2021 (11) April2021 (6) March2021 (6) February2021 (12) January2021 (8) December2020 (13) November2020 (7) October2020 (15) September2020 (7) August2020 (14) July2020 (2) June2020 (17) May2020 (14) April2020 (17) March2020 (21) February2020 (4) January2020 (2) December2019 (4) November2019 (3) October2019 (7) September2019 (11) August2019 (13) July2019 (2) June2019 (10) May2019 (14) April2019 (11) March2019 (8) February2019 (9) January2019 (14) December2018 (16) November2018 (20) October2018 (22) September2018 (30) August2018 (22) July2018 (36) June2018 (24) May2018 (21) April2018 (12) March2018 (32) February2018 (15) January2018 (15) December2017 (39) November2017 (15) October2017 (13) September2017 (13) August2017 (14) July2017 (4) June2017 (16) May2017 (15) April2017 (9) March2017 (7) February2017 (6) January2017 (12) December2016 (14) November2016 (6) October2016 (12) September2016 (11) August2016 (18) July2016 (12) June2016 (16) May2016 (9) April2016 (10) March2016 (15) February2016 (14) January2016 (18) December2015 (21) November2015 (32) October2015 (24) September2015 (28) August2015 (25) July2015 (26) June2015 (23) May2015 (15) April2015 (18) March2015 (16) February2015 (21) January2015 (17) December2014 (22) November2014 (20) October2014 (15) September2014 (13) August2014 (11) July2014 (12) June2014 (9) May2014 (10) April2014 (11) March2014 (6) January2014 (1) November2013 (5) October2013 (2)  00000 歐斯瑞-一個對網路世界充滿熱情的團隊 歐斯瑞提供免費電商知識,並協助各大類型之企業 電商諮詢建置與 Magento和 Shopify相關的電商專案。

立即聯繫我們 上一篇文章小心!他們正盯著你!6種Google服務會收集的數據下一篇文章電商創業第一步–商業模式(下)推薦文章電商想做問卷分析來自動推薦商品該怎麼起頭(上)2022-03-25 0ForkingWorkflow的介紹2022-02-21 0線上購物拿到真的台幣回饋金-Shopback現金回饋!2022-02-15 0LINEPaySandbox申請2021-12-15 0Category:  行銷與實用好文Tags:  Google教學,google工具,行銷與實用好文 留下回應取消回覆 你的電子郵件地址不會被公開.姓名* 電子郵件* 網站 維運服務



請為這篇文章評分?