Đảm Bảo Văn Bản Vẫn Hiển Thị Trong Khi Tải Phông Chữ Web

Google PageSpeed ​​Insights chắc chắn là một trong những khí cụ bổ ích mang lại quản trị viên website, công ty trở nên tân tiến cùng nhà thiết lập website ở trong toàn bộ những loại. Tuy nhiên, Tài phân biệt rằng không ít tín đồ dành hàng giờ nhằm ám ảnh về việc về tối ưu hóa website của mình, để thử cùng đạt 100/100 điểm vào bài đánh giá này.

Bạn đang xem: Đảm bảo văn bản vẫn hiển thị trong khi tải phông chữ web

Sự thiệt là trên đây không phải là giải pháp Google PageSpeed ​​Insights được sử dụng, cũng chưa phải là một trong những sự theo đuổi đáng giá. Khi bạn tập trung vào vấn đề thực hiện các khuyến nghị của nền tảng rứa bởi vì ko tham mê gia vào số sinh sống đầu trang, các bạn sẽ tạo ra các lợi ích hơn đến trang web của bản thân mình.

Bài đăng này là một trả lời toàn vẹn để áp dụng Google PageSpeed ​​Insights nhằm điểm mạnh cực tốt của doanh nghiệp. Tài đang đề cập đến giải pháp Google thực hiện điểm số của người tiêu dùng, cũng như biện pháp phối hợp các đề xuất bạn cảm nhận.

Bắt đầu nào!

Giới thiệu về Google PageSpeed ​​Insights

Nếu chúng ta không không còn xa lạ với Google PageSpeed ​​Insights , thì đó là 1 trong những nguyên tắc được áp dụng để bình chọn năng suất website. Bạn hoàn toàn có thể nhập ngẫu nhiên URL làm sao cùng so sánh nó:

*

Thông tin chi tiết về Google PageSpeed

Google tiếp nối cung cấp tổng điểm trong số 100 đến website chúng ta vẫn bình chọn, dựa trên một vài thực tiễn tốt nhất có thể về tối ưu hóa hiệu suất:

*

Điểm số Insights của Google PageSpeed

Cùng với hiệu quả này, bạn cũng trở thành thấy một số lời khuyên trường đoản cú ​​Google về cách cải thiện năng suất của bạn (và cho nên vì thế, điểm số của PageSpeed ​​Insights cũng vậy):

*

Đề xuất công bố cụ thể về Google PageSpeed

Kể từ thời điểm năm 2018, điểm số của PageSpeed ​​Insights được tính toán trải qua Google Lighthouse , mã nguồn msinh hoạt của Google, khí cụ tự động để nâng cao quality thông thường của những trang web. Nền tảng này có thể đánh giá toàn bộ các một số loại yếu tố, bao hàm năng suất, khả năng truy vấn, ứng dụng website lũy tiến cùng không dừng lại ở đó nữa.

Để xem reviews trọn vẹn của Ngọn gàng đèn biển về trang web của công ty, chúng ta cũng có thể sử dụng chế độ Đo lường của Google :

*

Google Webmasters Đo cơ chế kiểm toán

Ngoài bài toán tiến hành kiểm toán công suất y như một đợt chạy Google PageSpeed ​​Insights, bạn sẽ dấn lấy điểm cho năng lực truy vấn, trong thực tiễn cực tốt với Tối ưu hóa công cụ search tìm (SEO) .

Sự thiệt về bài toán chnóng điểm 100/100 vào Google PageSpeed ​​Insights

Nlỗi Tài đã đề cập sinh sống đầu bài bác đăng này, Tài thấy nhiều chủ thiết lập với công ty trở nên tân tiến website bị ám ảnh về việc đạt được điểm số PageSpeed ​​Insights tuyệt vời nhất. Thật không may, những người này còn có xu hướng bỏ qua mất điều tỉ mỷ đặc biệt rộng trong tác dụng của bài xích kiểm tra: những lời khuyên.

Mặc mặc dù bạn chắc hẳn rằng bắt buộc nỗ lực nâng cao thời gian cài trang web của bản thân mình càng các càng xuất sắc, nhưng lại vấn đề cảm nhận 100/100 vào Google PageSpeed ​​Insights đích thực ko đặc trưng . Đối với những người mới bắt đầu, nó thậm chí không hẳn là bài xích đánh giá toàn bộ về năng suất.

Không y như PageSpeed ​​Insights, Pingdom Tools có thể chấp nhận được các bạn soát sổ năng suất website của mình từ khá nhiều vị trí không giống nhau:

*

Kết trái bình chọn vận tốc của Công núm Pingdom

quý khách cũng hoàn toàn có thể chạy nghiên cứu trên các nền tảng nhỏng GTmetrix (phối hợp điểm số của công ty từ PageSpeed ​​Insights và YSlow ) cùng WebPageTest . Rất hoàn toàn có thể, điểm số của người tiêu dùng trên các phương pháp khác nhau này sẽ không còn khớp chính xác, điều này cho bạn thấy hồ hết con số này hoàn toàn có thể tùy ý như thế nào.

Điều thực thụ quan trọng là tốc độ thực tiễn của website của công ty . Để gửi nó vào viễn chình họa, Tài đang thấy những trang web bao gồm thời gian tải trung bình bên dưới 500 mili giây (cực kì nhanh!) Không bao gồm điểm 100/100 trên PageSpeed ​​Insights.

Mục đích thực sự của Việc chất vấn hiệu suất website của bạn cùng với Google PageSpeed ​​Insights không phải nhằm đã đạt được điểm trên cao. Ttốt vào đó, sẽ là tra cứu các điểm có sự việc trên website của công ty, nhằm chúng ta có thể buổi tối ưu hóa chúng và giảm cả thời hạn tải thực tế với thực tế tình hình load trang web của chúng ta.

Cách Google sử dụng đọc tin cụ thể về tốc độ trang

Ngoài câu hỏi ảnh hưởng đến Trải nghiệm người dùng (UX) của website của khách hàng, công suất cũng đóng góp một sứ mệnh vào SEO . Cho rằng PageSpeed ​​Insights được quản lý điều hành vì luật pháp tra cứu kiếm lớn nhất cùng thịnh hành duy nhất thế giới, nguyên do là điểm số của chúng ta có thể có tác động đến bảng xếp thứ hạng Trang kết quả của Công thay tra cứu tìm (SERP) (tối thiểu là bên trên chính Google).

Thực tế là Google ko áp dụng PageSpeed Insights để khẳng định vẻ bên ngoài – một số loại. Tốc độ website là một nguyên tố xếp thứ hạng, dễ dàng với dễ dàng và đơn giản. Điểm bình chọn công suất của chúng ta có thể cho bạn một ý tưởng khá tốt về địa điểm chúng ta đứng bên trên chiến trận đó.

Tuy nhiên, Google sẽ chăm chú nhiều hơn chỉ cần số trong vòng tròn sống đầu hiệu quả PageSpeed ​​của công ty. Đánh 100/100 sẽ không đảm bảo cho chính mình một địa điểm hàng đầu bên trên SERPs.

Nlỗi vẫn nói, các bạn vẫn có thể đặt công dụng PageSpeed ​​Insights hoạt động khi nâng cao SEO của mình. Chẳng hạn, kể từ năm 2018, vận tốc trang di động cầm tay là nguyên tố xếp thứ hạng của Google. Quý khách hàng đang phân biệt rằng bình chọn công suất của người sử dụng cung cấp dữ liệu cho tất cả phiên bản máy vi tính để bàn và sản phẩm công nghệ cầm tay của trang web của bạn:

*

Tab di động vào Google PageSpeed ​​Insights

Vì rộng 73 xác suất người dùng internet di động nhận định rằng chúng ta đã gặp gỡ cần một trang web mất không ít thời gian để cài đặt, biết tin vào tab Google PageSpeed ​​Insights Smartphone là vô giá bán. Sử dụng những khuyến cáo ở đây nhằm sút thời gian download trên điện thoại cảm ứng thông minh tối ưu với những đồ vật khác để giúp các bạn hữu dụng chũm đối đầu và cạnh tranh.

Đề xuất biết tin chi tiết về Google PageSpeed ​​(24 cách để nâng cao hiệu suất)

Tài sẽ nói không hề ít về các đề xuất của Google PageSpeed ​​Insights vào bài xích đăng này. Chúng là phần giết mổ thực sự của kết quả kiểm tra hiệu suất của người tiêu dùng cùng có giá trị rộng những so với điểm thực tế của người tiêu dùng. Đó là nguyên do tại vì sao Tài dành phần sót lại của bài đăng này cho họ.

Tuy nhiên, trước khi Tài đi sâu vào những lời khuyên đơn độc, bạn sẽ đề nghị đọc sự khác hoàn toàn giữa Dữ liệu thực địa và Dữ liệu phòng thể nghiệm của chúng ta . Cái trước đối chiếu website của bạn với những người dân không giống trong Báo cáo thử dùng người dùng Chrome trong 30 trong ngày hôm qua.

Bên cạnh đó còn tồn tại hai biểu vật dụng hiển thị chỗ Firstr Contentful Paint vừa phải (FCP) và Độ trễ đầu vào (FID) vừa phải của khách hàng

*

Dữ liệu thực của Google PageSpeed

Trong hình hình họa bên trên, FCPhường của website của Tài tương đương cùng với 45 Tỷ Lệ các trang web trong phân vị sản phẩm công nghệ 75 cùng FID của Tài tương đương với 9 phần trăm của phân vị lắp thêm 95.

Lab Data hiển thị tài liệu cụ thể đến cài trang mô phỏng:

*

Dữ liệu phòng thử nghiệm của Google PageSpeed ​​Insights

Bạn đang nhận ra rằng Dữ liệu thực địa với Dữ liệu phòng thử nghiệm của Tài không khớp chính xác . Điều kia hoàn toàn thông thường. Các dữ liệu Lab được tạo nên vào điều kiện thắt chặt và cố định, trong những lúc các trường dữ liệu sử dụng tốc độ mua thực tiễn tích lũy theo thời gian.

khi được xem như xét kết hợp, Dữ liệu ngôi trường cùng Dữ liệu phòng thí nghiệm sẽ cho mình ý tưởng phát minh về thời gian cài đặt thực tiễn của website của khách hàng. Nlỗi Tài đang nhắc trước kia, điều này thậm chí còn đặc trưng hơn điểm số PageSpeed ​​tổng thể và toàn diện của người tiêu dùng, bởi vì vậy bạn sẽ mong chú ý đến các con số này.

Sau khi chúng ta đang lưu ý biết tin này, đã đến lúc bước đầu nâng cao công suất trang web của chúng ta với những đề xuất của Google PageSpeed.

1. Loại bỏ tài nguyên ngăn kết xuất

Một trong những khuyến nghị phổ biến từ Google PageSpeed ​​Insights là Loại vứt tài nguyên chặn hiển thị :

*

Loại vứt đề xuất tài nguyên ổn chặn hiển thị

Như vậy đề cập tới những tập lệnh JavaScript với CSS sẽ ngăn uống trang của bạn tải nkhô nóng. Trình coi sóc của khách truy vấn cần thiết lập xuống và xử lý các tệp này trước khi nó hoàn toàn có thể hiển thị phần còn lại của trang, vì vậy, có tương đối nhiều trong số bọn chúng ‘bên trên màn hình hiển thị đầu tiên’ có thể tác động tiêu cực đến tốc độ trang web của khách hàng.

Quý Khách sẽ tra cứu thấy một danh sách những tài nguyên bị ảnh hưởng những tuyệt nhất bởi vì sự việc này dưới đề xuất vào kết quả PageSpeed ​​của công ty.

2. Tránh xâu chuỗi các yên cầu quan lại trọng

Khái niệm xâu chuỗi những đòi hỏi đặc biệt đề nghị thực hiện với Đường dẫn kết xuất quan trọng (CRP) cùng giải pháp trình coi sóc cài các trang của người sử dụng. Một số yếu tố – chẳng hạn như JavaScript cùng CSS cơ mà họ sẽ đàm đạo sinh hoạt trên – đề xuất được thiết lập hoàn toàn trước lúc trang của người tiêu dùng hiển thị.

Là một phần của đề xuất này, Google PageSpeed ​​Insights sẽ hiển thị cho bạn chuỗi những hiểu biết trên trang bạn đang phân tích:

*

Tránh xâu chuỗi các trải nghiệm quan tiền trọng

Sơ đồ vật này đã cho mình thấy hàng loạt các tận hưởng dựa vào cần được tiến hành trước lúc trang của doanh nghiệp hiển thị. Nó cũng biến thành cho chính mình biết form size của từng tài nguyên ổn. Lý tưởng độc nhất vô nhị, bạn muốn bớt tphát âm số lượng trải đời nhờ vào, cũng giống như form size của chúng.

Một số phương thức nhằm tiến hành các phương châm này được nói trong các khuyến cáo không giống được đàm đạo trong bài viết này, bao gồm:

Loại vứt tài nguim ngăn kết xuấtTrì hoãn hình ảnh ngoài màn hìnhGiảm tđọc CSS với JavaScript

Điều đặc biệt quan trọng đề xuất lưu ý là không tồn tại một vài chuỗi thưởng thức đặc biệt quan trọng nhưng bạn cần phải thao tác làm việc. Google PageSpeed ​​Insights ko kể kiểm toán thù này là ‘đã qua’ hoặc ‘không thành công’, ko y hệt như các lời khuyên khác. tin tức này chỉ đơn giản dễ dàng là gồm sẵn để giúp đỡ các bạn nâng cao thời gian download.

Xem thêm: Hãy Tin Anh Lần Nữa R Em Đừng Đi Xa Quá Xin Em Đừng Đi Em Mà Trinh Dinh Quang

3. Giữ con số yên cầu rẻ cùng form size chuyển nhỏ

Càng những yên cầu trình duyệt bắt buộc thực hiện để mua những trang của công ty cùng tài nguyên cơ mà máy chủ của doanh nghiệp trả lại càng béo, website của bạn mất thời gian tải càng thọ. Do kia, điều phải chăng là Google đang khulặng bạn sút tđọc con số đòi hỏi phải và sút quy mô tài nguyên của khách hàng.

Giống nlỗi khuyến cáo Tránh xâu chuỗi các khuyến cáo yên cầu đặc biệt , vấn đề này ko dẫn mang lại ‘quá qua’ hoặc ‘thất bại’. Ttuyệt vào đó, các bạn chỉ việc coi danh sách con số thử khám phá được thực hiện với kích cỡ của chúng:

*

Giữ số lượng trải nghiệm rẻ với gửi form size lời khuyên nhỏ

Không gồm con số trải đời lphát minh hoặc size tối đa bắt buộc ghi lưu giữ. Tgiỏi vào kia, Google khuim bạn nên trường đoản cú đưa ra các tiêu chuẩn chỉnh đó bằng cách chế tác chi phí năng suất. Đây là 1 cỗ những mục tiêu được xác minh có thể liên quan mang lại các tinh tướng như:

Kích thước hình ảnh về tối đaSố lượng font chữ website được sử dụngCó bao nhiêu tài nguim bên ngoài chúng ta Call đếnKích thước của tập lệnh với khung

Tạo chi phí hiệu suất cung cấp cho bạn một bộ tiêu chuẩn chỉnh nhằm trường đoản cú chịu trách nát nhiệm. Khi chúng ta vượt thừa chi phí của bản thân mình, bạn có thể giới thiệu quyết định về việc loại trừ hoặc về tối ưu hóa những tài nguyên để vâng lệnh những hiệ tượng được xác định trước. quý khách có thể xem thêm sống bài này trong khuyên bảo riêng biệt của Google.

4. Giảm thiểu CSS

Các tệp CSS hay to hơn nút cần thiết, sẽ giúp bé người đọc dễ dàng rộng. Chúng hoàn toàn có thể bao gồm những lợi nhuận chuyển động khác biệt cùng không gian không cần thiết mang lại máy vi tính để gọi ngôn từ của chúng.

Giảm tđọc CSS của công ty là quy trình cô ứ các tệp của người tiêu dùng bằng phương pháp thải trừ các cam kết từ bỏ, khoảng Trắng với đụng hàng ko cần thiết. Google khuyến cáo thực hành thực tế này bởi vì nó làm cho bớt form size tệp CSS của người sử dụng cùng cho nên vì vậy có thể nâng cao vận tốc tải:

*

Giảm tphát âm khuyến cáo CSS

Tài khulặng bạn nên áp dụng một plugin như Tự hễ về tối nhiều hóa hoặc WP. Rocket nhằm thu bé dại các tệp CSS của bạn.

5. Giảm thiểu JavaScript

Giống như chúng ta cũng có thể sút kích thước tệp CSS trải qua thu nhỏ dại, điều tương tự như cũng áp dụng cho các tệp JavaScript của bạn:

*

Giảm tphát âm lời khuyên JavaScript

Tự cồn buổi tối đa hóa hoặc WP Rocket cũng có thể cách xử trí tác vụ này mang lại website WordPress của doanh nghiệp.

6. Xóa CSS ko sử dụng

Bất kỳ mã như thế nào trong biểu định đẳng cấp của bạn là nội dung đề xuất được cài để trang của người tiêu dùng hiển thị cho những người sử dụng. Nếu gồm CSS ​​trên trang web của công ty ko thực sự có lợi, thì nó đã làm cho giảm năng suất của người sử dụng.

Đó là nguyên nhân vì sao Google khuyên chúng ta nên xóa phần nhiều CSS không sử dụng :

*

Xóa khuyến nghị CSS không sử dụng

Giải pháp ở chỗ này về cơ phiên bản giống hệt như phương án loại trừ CSS ngăn ngăn kết xuất. Quý Khách có thể chế tác dạng hình nội tuyến đường hoặc trì hoãn theo bất kỳ giải pháp như thế nào bao gồm ý nghĩa sâu sắc tốt nhất cho các trang của khách hàng. Quý Khách cũng rất có thể sử dụng một hiện tượng như Chrome DevTools để tìm kiếm CSS không thực hiện rất cần phải tối ưu hóa.

7. Giảm thiểu các bước chủ đề chính

‘Chủ đề chính’ là yếu tắc thiết yếu của trình săn sóc của người tiêu dùng Chịu trách nát nhiệm biến chuyển mã thành trang web nhưng mà khách hàng truy cập rất có thể địa chỉ. Nó so với cú pháp và tiến hành HTML, CSS cùng JavaScript. Dường như, nó Chịu trách nhiệm cách xử lý những shop của người tiêu dùng.

Vấn đề này tức là, Khi luồng thiết yếu chuyển động trải qua mã website của người sử dụng, nó cũng không thể cách xử trí những thưởng thức của người dùng. Nếu quá trình chủ đề chủ yếu của trang web của người sử dụng mất không ít thời hạn, điều này có thể dẫn cho UX kém nhẹm với thời hạn thiết lập trang chậm trễ.

Google PageSpeed ​​sẽ đính cờ những trang mất rộng tư giây nhằm hoàn thành các bước chủ đề thiết yếu với trình bày một website có thể sử dụng:

*

Giảm tphát âm khuyến nghị công việc chính

Một số phương pháp được áp dụng nhằm bớt các bước chủ thể thiết yếu đã được đề cập trong số phần khác của bài bác đăng này, bao gồm:

Giảm tgọi mã của bạnXóa mã ko sử dụngTriển khai bộ lưu trữ đệm

Tuy nhiên, chúng ta có thể ước ao chu đáo bóc tách mã. Quá trình này bao gồm vấn đề phân tách JavaScript của khách hàng thành các gói tiến hành lúc đề xuất, gắng vì chưng đòi hỏi trình chú tâm thiết lập tất cả bọn chúng trước khi trang trsinh hoạt bắt buộc thúc đẩy.

Webpack thường được áp dụng để triển khai phân tách bóc mã. Lưu ý rằng đây là một chuyên môn tương đối tiên tiến với fan new bắt đầu thường cần tiến hành 1 mình.

8. Giảm thời gian thực hiện JavaScript

Thực thi JavaScript thường xuyên là đóng góp khá nổi bật duy nhất đến quá trình chủ đề bao gồm. PageSpeed ​​Insights có một khuyến cáo riêng rẽ nhằm lưu ý chúng ta nếu tác vụ này có tác động đáng nói tới công suất website của bạn:

*

Giảm khuyến cáo thời gian triển khai JavaScript

Các phương pháp được đề xuất nghỉ ngơi bên trên để sút các bước của luồng thiết yếu cũng biến thành giải quyết và xử lý cảnh báo này vào tác dụng PageSpeed ​​của doanh nghiệp.

9. Giảm thời hạn ý kiến của sản phẩm chủ (TTFB)

Time to First Byte (TTFB) là thước đo thời gian nhằm trình phê chuẩn cảm nhận byte dữ liệu trước tiên từ bỏ máy chủ của trang web của người tiêu dùng sau khi trải đời. Mặc cho dù vấn đề đó rất khác với tốc độ website toàn diện và tổng thể của người tiêu dùng, tuy nhiên có TTFB rẻ là điều tốt mang đến công suất trang web của công ty.

Do kia, giảm thời gian bình luận của sản phẩm công ty là 1 trong trong những khuyến nghị của Google PageSpeed ​​Insights. Nếu bạn cũng có thể đã có được TTFB rẻ, các bạn sẽ thấy thông tin này vào phần Kiểm toán đã qua :

*

Thời gian phản hồi của máy công ty là thông báo thấp

Có một trong những yếu tố rất có thể ảnh hưởng mang lại TTFB của công ty. Một số kế hoạch nhằm thụt lùi nó bao gồm:

Sử dụng các chủ thể cùng plugin nhẹGiảm số lượng plugin được thiết lập bỏ lên trang web của bạnSử dụng Mạng phân phối ngôn từ (CDN)Triển khai bộ nhớ lưu trữ đệm trình duyệtChọn công ty cung cấp Hệ thống Tên miền (DNS) vững vàng chắc

10. Hình ảnh kích thước phù hợp

Các tệp phương tiện nhỏng hình ảnh rất có thể là lực cản đích thực so với hiệu suất trang web của doanh nghiệp. Định cỡ đúng cách là 1 trong những bí quyết đơn giản dễ dàng nhằm bớt thời gian download của bạn:

*

Đề nghị kích cỡ hình ảnh phù hợp

Nếu trang của khách hàng bao gồm các hình ảnh lớn hơn nút cần thiết, CSS được áp dụng để đổi khác size bọn chúng một phương pháp tương thích. Việc này mất nhiều thời hạn hơn chỉ đơn giản dễ dàng là sở hữu hình hình ảnh sống size phù hợp lúc đầu, cho nên vì thế ảnh hưởng mang lại năng suất trang của khách hàng.

Để khắc phục vấn đề này, bạn cũng có thể sở hữu lên hình hình ảnh sinh hoạt form size tương xứng hoặc sử dụng ‘hình hình họa bội nghịch hồi’. Điều này liên quan đến sự việc sinh sản hình ảnh có kích thước không giống nhau cho những vật dụng khác biệt.

Các srcmix nằm trong tính khẳng định các tập tin có sẵn khác biệt, và size ở trong tính nói với những trình săn sóc dòng như thế nào bắt buộc được thực hiện dựa vào kích cỡ screen bây giờ.

11. Trì hoãn hình hình ảnh Offscreen

Quá trình trì hoãn hình ảnh ngoại trừ screen thường xuyên được call là ‘lười tải’. Vấn đề này Tức là cố gắng bởi tạo cho trình xem xét cài phần lớn hình ảnh trên một trang trước lúc hiển thị nội dung trong screen thứ nhất, nó đang chỉ cài đặt đông đảo hình hình ảnh hiển thị ngay chớp nhoáng.

Tải ít hơn trước lúc trang hiển thị Tức là công suất tốt hơn, chính là nguyên do vì sao Google đề xuất cách thức này:

*

Trì hoãn lời khuyên hình hình họa kế bên màn hình

Có một số trong những plugin WordPress được sinh sản riêng rẽ mang đến Việc sở hữu chây lười, bao gồm Native sầu Lazy Load cùng Lazy Load của WPhường. Rocket . Các plugin về tối ưu hóa năng suất với hình hình ảnh khác biệt nhỏng Tự động tối nhiều hóa cũng có các thiên tài tải biếng nhác.

12. Mã hóa hình ảnh hiệu quả

Đây cũng là cách thức chính để triển khai theo lời khuyên của Google nhằm mã hóa hình ảnh công dụng :

*

Đề xuất mã hóa hình hình họa hiệu quả

Điều đặc biệt là đã đạt được kích thước tệp nhỏ tuyệt nhất có thể, nhưng ko có tác dụng sút quality của hình ảnh. Các plugin nlỗi Imagify và Smush có thể góp với trọng trách này. quý khách hoàn toàn có thể bài viết liên quan về chúng vào gợi ý của Tài nhằm tối ưu hóa hình ảnh .

Các đề xuất khác ảnh hưởng tới việc các bạn ‘quá qua’ tốt ‘thất bại’ việc kiểm toán hình hình ảnh được mã hóa hiệu quả bao gồm:

Phục vụ hình hình ảnh sống form size bao gồm xácThực hiện sở hữu biếng nhác (trì hoãn hình hình ảnh quanh đó màn hình)Chuyển đổi hình hình họa sang trọng định dạng tệp núm hệ tiếp theo, chẳng hạn như WebPSử dụng định hình đoạn phim cho ngôn từ phim hoạt hình, ví dụ như GIF

Ngoài câu hỏi nén hình ảnh của chúng ta, bạn cũng có thể tuân theo các bước để triển khai các đề xuất nàgiống hệt như được biểu thị sống nơi khác trong bài bác đăng này.

13. Phục vụ hình ảnh trong những format nỗ lực hệ tiếp theo

Có một số format tệp hình hình họa mua nkhô hanh rộng những format khác. Thật rủi ro, chúng không phải là định hình PNG hoặc JPEG thường bắt gặp của người tiêu dùng . Tấm hình WebP sẽ đổi mới tiêu chuẩn chỉnh bắt đầu và Google PageSpeed ​​vẫn thông tin cho bạn giả dụ hình ảnh của chúng ta không tuân hành nó:

*

Phục vụ hình hình họa vào đề xuất định dạng gắng hệ tiếp theo

Điều này có vẻ nlỗi là 1 khuyến cáo cạnh tranh đáp ứng nhu cầu, vày bạn cũng có thể sẽ có không ít hình hình họa trên trang web WordPress của doanh nghiệp. May mắn cụ, có những plugin rất có thể trợ giúp. Ví dụ: Imagify cùng Smush những cung cấp thiên tài đổi khác WebP..

14. Sử dụng định hình video đến nội dung hoạt hình

GIF hoàn toàn có thể là 1 trong vẻ ngoài ngôn từ trực quan tiền công dụng trong vô số nhiều trường hợp. Hướng dẫn lý giải, đánh giá tính năng và thậm chí còn phim hoạt hình hài hước đều hoàn toàn có thể cải thiện bài xích đăng của doanh nghiệp và làm cho chúng độc đáo rộng cùng có giá trị với người hâm mộ.

Thật không may, số đông tác dụng kia cần trả giá chỉ mang lại công suất của người tiêu dùng. GIF đang yêu cầu sở hữu, sẽ là nguyên do tại sao PageSpeed ​​Insights khuyên bạn nên Giao hàng văn bản video clip cố gắng thế:

*

Sử dụng định dạng đoạn phim cho khuyến cáo câu chữ hoạt hình

Thật không may, chuyển đổi GIF thành những định dạng Clip chưa hẳn là quá trình dễ dàng độc nhất. trước hết, bạn sẽ đề nghị ra quyết định loại video nào bạn có nhu cầu sử dụng:

MP4: Tạo những tệp to hơn một chút ít, tuy vậy tương thích cùng với phần nhiều những trình để mắt tới bao gồm.WebM: Định dạng Clip được tối ưu hóa tối đa, tuy vậy nó có công dụng tương xứng trình coi ngó hạn chế.

Lúc bạn sẽ giới thiệu chắt lọc hợp lý và phải chăng duy nhất cho trang web của mình, bạn sẽ đề nghị biến đổi những format tệp. Cách cực tốt để làm điều này là trải qua cái lệnh. Để bắt đầu, thiết lập FFmpeg . Đây là 1 trong những nguyên tắc mối cung cấp msinh hoạt để đổi khác những định dạng tệp:

*

Công thế biến đổi định hình tệp FFmpeg mang lại đoạn Clip cùng âm thanh

Sau kia, mnghỉ ngơi đồ họa mẫu lệnh của công ty với chạy lệnh sau:

ffmpeg -i input.gif output.mp4

Như vậy sẽ biến hóa GIF với tên tệp đầu vào.gif thành đoạn Clip MP4 cùng với thương hiệu tệp output.mp4 . Thay đổi định dạng chỉ cần khởi đầu, tuy vậy. Bây giờ bạn cần nhúng video clip tác dụng vào website WordPress của bản thân Theo phong cách làm cho nó lộ diện như một GIF phim hoạt hình.

Nhúng câu chữ video clip cho hoạt hình

Nlỗi chúng ta cũng có thể nhận ra nếu như khách hàng đã từng coi GIF trước đó, chúng tương đối khác đối với các video thường thì. Chúng thường tự động phạt và chạy trên một vòng lặp, và chúng luôn luôn không có âm thanh khô. Nhúng tệp MP4 hoặc WebM new của khách hàng bên trên trang web WordPress của các bạn sẽ không tạo nên các tác dụng này.

Tuy nhiên, bạn cũng có thể chế tác lại chúng cùng với một vài mã vô cùng dễ dàng. Tải đoạn Clip của khách hàng lên thư viện phương tiện của bạn, tiếp nối thêm phần sau vào trang hoặc đăng địa điểm bạn có nhu cầu đưa GIF của bản thân mình vào:

Như vậy đang vận dụng những trực thuộc tính được chỉ định và hướng dẫn mang lại đoạn phim của người tiêu dùng, làm cho nó xuất hiện nhiều hơn ‘giống như GIF’. Chỉ đề nghị kiểm soát và điều chỉnh thương hiệu tệp và các loại nhằm phù hợp với tài nguyên của người sử dụng. Để biết thêm chi tiết về chủ thể này, Tài khulặng chúng ta nên đọc lý giải của Google về Việc biến hóa GIF thành video .

15. Đảm bảo văn uống phiên bản vẫn hiển thị trong khi thiết lập Webfont

Giống như hình ảnh, font chữ tất cả xu hướng là các tệp mập mất quá nhiều thời gian nhằm mua. Trong một số trong những ngôi trường phù hợp, trình chú ý hoàn toàn có thể ẩn văn phiên bản của bạn cho tới Lúc font chữ nhiều người đang thực hiện tải hoàn toàn, vấn đề đó đang dẫn mang lại đề xuất này trường đoản cú Google PageSpeed ​​Insights:

*

Đảm bảo vnạp năng lượng bản vẫn hiển thị trong những lúc khuyến cáo mua webfont

Google khuim bạn nên xử lý vụ việc này bằng phương pháp áp dụng chỉ thị hân oán đổi API hiển thị fonts chữ theo kiểu khuôn mặt