性能優化週——你需要知道的一切
已發表: 2021-08-10本週,我們的社區有一個難得的機會與我們尊敬的 21 位性能專家聯繫,詢問他們最緊迫的 Web 優化問題,了解關鍵的優化挑戰,並發現實現最佳結果的最佳實踐。 下面,我們深入探討了三個最常見的 Web 性能問題以及如何根據我們領先的性能專家的意見來解決這些問題。 因此,事不宜遲,讓我們開始優化吧!
“網站填充”
構建網站時最重要的經驗法則之一是通過刪除不提供任何價值的小部件或插件來避免“網站填充”。 這不僅可以增強用戶體驗,還可以減少項目,從而提高速度。 Elementor 專家 Tim Liversage 建議先了解每個元素的工作原理並測試所有內容,然後再使用一組特定的功能。
根據 Brian Erickson 的說法,還有一些提高網站性能的關鍵指標包括:
- 選擇一個輕量級的主題
- 每個 WordPress 安裝最多安裝 10-15 個插件
- 嘗試找到一個多用途小部件,它提供各種類型的功能(即圖像框小部件、CTA 小部件),而不是添加許多只有一個關鍵功能的小部件
- 對小部件的佈局使用內聯定位而不是多列(其中添加的每一列都需要更多代碼,從而降低網站性能)
- 盡可能使用最好的緩存工具——我建議根據站點使用 WP Rocket 或 WP-Optimize。 請注意,雖然某些網站使用 Rocket 表現更好; 其他人通過優化做得更好
- 在上傳圖像之前調整大小和壓縮圖像,並使用 SVG 文件作為圖標和插圖
朱利安宋
謝·托德
布賴恩埃里克森
蒂姆·利弗薩奇
移動圖像優化
當您在桌面上加載 1920px/2560px 寬的圖像時,默認情況下相同尺寸的圖像也會加載到移動設備上。 在移動設備上加載桌面大小的圖像(而不是移動設備大小的圖像)會嚴重影響您網站的性能和您的 Core Web Vitals 指標。 為防止這種情況,Elementor 專家 Shay Toder 建議如下:“我們需要復制所有大圖像並將它們調整為 480 像素寬度以使其適合移動設備——我們可以使用 resizeimage.net 或任何在線工具調整照片大小圖形軟件,如 Photoshop。
在桌面模式下為部分或列添加背景圖像時,請確保單擊“響應模式”圖標並將背景圖像更改為新的移動尺寸圖像以適合移動視圖。 此過程會生成適用於桌面的全寬圖像和適用於移動設備的 480 像素寬度圖像,這也將改善您的 Core Web Vitals 指標。”
託管不足
虛擬主機會對您網站的性能產生巨大影響 - 簡而言之,它可以成就或破壞您的網站。 這是因為託管公司會影響網站的加載速度及其 Google Core Vitals 分數。 不幸的是,許多網站所有者的一個常見盲點是低估了選擇可靠、強大的託管公司和避免廉價託管的重要性。
Elementor 專家 Julian Song 分享了他的建議:“我最好的建議是永遠不要選擇廉價的託管解決方案——多花幾美元購買高質量的託管服務。 接下來,我建議我的客戶遷移到本地託管服務提供商(即您的目標受眾所在的位置)。 但是,如果您的受眾分散在世界各地,我強烈建議使用 CDN 服務將延遲降低到 150 毫秒以下,並進一步加快網站速度。”
您是否遇到過不同的性能優化問題或疑問並想諮詢專家? 單擊此處提交您的問題,我們的 21 位經過審查的專家中的一位將在問答環節中回答您的問題,該環節將在8 月 10 日和 8 月 12 日期間舉行。
您是否在尋找問題的快速答案? 我們建議您繞過我們的專家網絡。 Elementor 專家網絡是一個綜合平台,Elementor 用戶可以在其中搜索和聘請專業的 Elementor 專家,Elementor 審查這些專家以確保他們符合我們的標準並且確實是他們所做的最好的。
可濕性粉劑網站
即刻