? ? ? 加速您的網站的5個技巧
用戶期望網站快速有效地加載。確保設計不僅在視覺上令人愉悅,而且還具有100%的功能,這是您的工作。如果你的網站有點拖累,你可以立即停止擔心,因為我們有5個技巧可以幫助你通過對網站設計的小調整來加速你的網站。
1.注意動畫
網站設計中的動畫是2019年趨勢之一。不要因創建無法加載的大量文件而落后。在開始使用這種類型的效果時,先從較小的動畫效果開始,然后在對自己的工作方式和整體網站框架的工作方式有一個良好的感覺后再轉向更大的動畫。
做一些簡單而有趣的事情,比如創建一個動畫懸停狀態。有一個按鈕改變顏色或擴展是一個非常好的效果,將幫助您掌握CSS并獲得基本動畫的良好感覺,然后再轉向更大的元素。
2.優化圖像
隨著用戶可以使用高清和視網膜顯示屏的數量,您可能很想在構建網站時以高分辨率將所有圖像加載為完整尺寸。不要陷入這個陷阱。大多數這些圖片可能太大,無法讓您的網站有效處理。
了解您的文件類型。Web上圖像最常見的文件格式是JPG,PNG,GIF和SVG。
JPG:最適合照片,JPG文件的大小范圍從小到大。保存JPG文件以供網站使用時,請確保保存優化文件。(在Adobe Photoshop中,您可以使用“文件”>“導出”>“導出為”下的導出設置優化Web圖像。)
PNG:對包含文本的圖像使用此文件格式,以便刻字呈現良好。這通常是一個相當小的文件。
GIF:較小動畫元素的首選文件格式,例如流行的動畫模因風格圖像。但請注意,如果您不小心,這種文件格式會變得很重要。
SVG:如果您需要Web的矢量圖像,這是最佳選擇。它可用于從圖標到LOGO的任何內容。
3.盡可能使用代碼
您可能想為您的網站創建一堆漂亮的圖標和圖像,并將每個圖標和圖像作為單個元素加載。這可能會導致一些問題。相反,盡可能使用代碼來調用這些元素。
使用CSS也可以加載背景圖像。這將“強制”您的網站在后臺之前加載其他所有內容,以便用戶可以立即開始在網站上查看其他元素和文本。
4.保持視頻短片
另一個時髦的網站設計元素是在您的主頁上使用全屏視頻。這可能是另一個加載時間陷阱。你會發現自己陷入視頻質量,視頻內容和速度之間,必須在某個地方做出犧牲。
最好的視頻超短 - 只有幾秒鐘 - 并且循環以便動作不會停止。您也不需要包含聲音或其他效果。您可以嘗試其他一些技巧,盡可能減少文件大小。
5.壓縮,壓縮,壓縮
您的網站的各個組件不僅應該壓縮,還可以整體壓縮網站,以幫助保持網站的快速運行??梢詨嚎s的元素包括CSS和JavaScript文件,圖像和視頻(通過調整大?。┖褪褂肎ZIP等工具的網站。
在插件和創建較小的文件時,縮小文件是最佳途徑。您還想檢查代碼在站點內的設計方式。為了獲得最大速度,所有JavaScript都應包含在一個文件中,所有CSS應包含在另一個文件中。(另一個注意事項:您放置此代碼的位置也很重要。將CSS鏈接到頁面頂部,將JavaScript鏈接到底部以提高網站速度。)
網站必須快速,以便用戶可以立即進行交互。無論設備如何,頁面加載所需的時間越長,用戶就越有可能完全放棄該網站。因此,請在今天或本周花幾分鐘時間瀏覽此列表,以確保您的網站以最佳水平運行。
?