더 나은 GTmetrix 결과를 위해 WordPress에서 이미지 및 비디오를 지연로드하고 YouTube iFrame을 미리보기 이미지로 교체하는 방법

가장 좋은 방법은 무엇입니까 게으른로드 이미지 및 비디오 워드 프레스?


지연 로딩을 지원하는 캐시 플러그인 (WP Rocket, W3 Total Cache, Swift, LiteSpeed ​​Cache)을 이미 사용하고 있는지 여부에 따라 다릅니다. 캐시 플러그인이 지연 로딩 이미지 및 비디오를 지원하는 경우 추가 플러그인을 설치하지 않아도되도록하는 것이 가장 좋습니다. 그러나 캐시 플러그인이 지연 로딩을 지원하지 않는 경우 (특히 WP Rocket) 지원하는 플러그인을 사용하는 것이 좋습니다. 그렇지 않으면 아래에 대체 지연 로딩 플러그인을 나열하여 개별적으로 설치할 수 있습니다.

게으른 로딩이란??
지연 로딩은 이미지와 비디오가 사용자가 페이지를 아래로 스크롤하여 실제로 볼 때만로드됨을 의미합니다. 이로 인해 페이지에 대한 HTTP 요청이 줄어들지 만 이미지 나 포함 된 비디오가 많으면 페이지를 아래로 스크롤하여 지속적으로로드해야합니다..

YouTube Iframe을 미리보기 이미지로 교체한다는 것은 무엇을 의미합니까??
WordPress 사이트에 비디오를 포함 시키면 사람들이 재생 버튼을 클릭 한 후에 만 ​​”뚱뚱한 YouTube 플레이어”가로드됩니다. 즉, 처음에로드 된 것은 미리보기 이미지뿐입니다.

이미지와 비디오를 느리게로드해야합니다?
페이지를 아래로 스크롤 할 때 이미지를 지속적으로로드하면 사용자에게 성 가실 수 있기 때문에 이미지를 지연로드하지 않습니다. 그러나 GTmetrix에서는 모든 이미지가 100 %로 최적화되었습니다. 비디오를 느리게로드하고 iframe을 미리보기 이미지로 바꿉니다. 내장 된 각 비디오를로드하는 데 2 ​​초가 소요될 수 있으므로 (이미지보다 훨씬 무겁기 때문에) 비디오를 느리게로드하면 큰 이점이 있습니다.

1. WP 로켓

WP Rocket은 게으른 로딩을위한 최고의 선택이며 Facebook 설문 조사에서 # 1 캐시 플러그인이었습니다..

이미 내장 로딩이 느리기 때문에 추가 플러그인을 설치할 필요가 없습니다. 이것이 WP 로켓의 전체 이점입니다. 그것은 거의 다른 캐시 플러그인보다 더 많은 기능을 제공하지만 (더 나은 로딩 시간과 GTmetrix 점수를 얻음) 사이트의 플러그인은 적습니다. WP 로켓은 광범위한 지연 로딩에 대한 문서 및 WP 로켓 설정 구성.

WP 로켓

WP 로켓에서 지연로드를 활성화하는 방법
WP Rocket에서 지연 로딩을 활성화하려면 설정으로 이동하십시오. > WP 로켓 > 미디어 > 지연로드. 이미지, iframe 및 비디오에 사용하도록 설정하고 YouTube iframe을 미리보기 이미지로 바꿀 수 있습니다.

게으른로드 이미지 WP Rocket

2. SG 최적화

SiteGround 그들의 큰 업데이트에 게으른 로딩을 도입 SG 최적화.

물론이 플러그인을 사용하려면 SiteGround 고객이어야합니다 (20 개 이상의 Facebook 설문 조사에서 1 위 호스트로 평가 된 공유 호스팅을 위해 할 것임). SG Optimizer는 WP Rocket과 비교할 수 있지만 기능이 거의 없습니다. 따라서 호스트에 SiteGround를 사용하는 경우에도 SG Optimizer보다 WP Rocket을 선호합니다..

SiteGround SG 최적화 도구

SG Optimizer에서 지연로드를 활성화하는 방법
SG Optimizer에서 지연 로딩을 활성화하려면 설정으로 이동하십시오. > SG 최적화 > 사이트 별 기본값 > 이미지 최적화. 이미지, Gravatar, 썸네일, 반응 형 이미지 및 위젯을 지연로드 할 수 있습니다. 블로그에 의견이 있으면 게으른 로딩 Gravatars가 엄청나게 도움이 될 수 있습니다.

SG 옵티 마이저 게으른 로딩

3. W3 총 캐시

이미 W3 Total Cache를 사용하고 있다면 게으른 로딩 옵션.

W3 Total Cache는 한동안 포기 된 것으로 간주되었지만 개발자는 플러그인을 유지하기 시작했습니다. W3 Total Cache 설정 구성에 대한 광범위한 자습서가 있습니다..

W3 총 캐시 플러그인

W3 총 캐시에서 지연로드를 활성화하는 방법
W3 Total Cache에서로드 로딩을 ​​활성화하려면 설정으로 이동하십시오. > 일반 설정 > 사용자 경험 > 게으른 로딩. 이것을 켜고 사용자 경험으로 이동하십시오. > 게으른 로딩. HTML 이미지 태그, 배경 이미지, 단어 제외 및 스크립트 포함 방법을 처리하도록 선택.

W3 총 캐시 지연 로딩

4. Litespeed 캐시

리터 시드 캐시 게으른 로딩 또한 작업을 수행합니다 (Litespeed는 잘 검토 된 캐시 플러그인입니다).

LiteSpeed ​​캐시 플러그인

LiteSpeed ​​캐시에서 지연로드를 활성화하는 방법
LiteSpeed ​​Cache에서로드 로딩을 ​​활성화하려면 LiteSpeed ​​Cache로 이동하십시오. > 설정 > 미디어 > 미디어 설정. 여기에서 지연로드 이미지, iframe, 이미지 제외, 크론 작업을 통한 자동 최적화 요청, 자바 스크립트 라이브러리 인라인 포함 및 기타 설정 토글을 활성화 할 수 있습니다..

게으른 이미지로드 동영상 Litespeed 캐시

5. 신속한 성능

신속한 성능 지연 로딩을 지원하는 또 다른 캐시 플러그인입니다. Swift는 WordPress Speed ​​Up Facebook Group에서 훌륭한 평가를 받았지만 WordPress 플러그인 페이지의 리뷰는 별 4 개에 불과합니다. 스위프트 퍼포먼스는 시도하지 않았습니다. WP Rocket에 완벽하게 만족합니다.

스위프트 퍼포먼스 라이트 플러그인

스위프트 성능에서 지연로드를 활성화하는 방법
Swift Performance에서 로딩 로딩을 활성화하려면 설정으로 이동하십시오. > 미디어 > 게으른 짐. 여기에는 이미지로드 지연, 특정 이미지 제외 및 인라인 지연로드 이미지 옵션이 있습니다..

지연로드 이미지 스위프트 성능

6. 자동 최적화

자동 최적화는 종종 자체 내장 캐싱 시스템이있는 GoDaddy 및 WP Engine과 같은 호스트에서 사용됩니다. 블랙리스트 캐시 플러그인. 이 경우 (다른 속도 최적화를 처리하고 싶기 때문에) Autoptimize는 일반적으로이를위한 플러그인입니다. 많은 기능 중 하나는 게으른 로딩, HTML, CSS, JavaScript 및 Google Fonts를 최적화 할 수 있습니다..

플러그인 자동 최적화

자동 최적화에서 지연로드를 활성화하는 방법
자동 최적화에서 로딩로드를 활성화하려면 설정으로 이동하십시오. > 이미지 > 지연로드 이미지. 이미지 최적화를 위해 ShortPixel의 CDN을 사용할 수도 있습니다 (이것은 내가 사용하는 플러그인입니다).

지연로드 이미지 자동 최적화

7. 스 머시

스 머시는 이미지 최적화 플러그인입니다 게으른 로딩 지원. 그것은 WPMU에 의해 개발되었지만 GTmetrix에서 이미지를 100 %로 만드는 유일한 방법이기 때문에 개인적으로 무손실 압축을 위해 ShortPixel을 사용합니다 (그리고 많은 이미지 최적화 플러그인을 테스트했습니다).

스 머시 플러그인

스 머시에서 지연로드를 활성화하는 방법
Smush에서 로딩 로딩을 활성화하려면 Smush로 이동하십시오. > 계기반 > 게으른 짐. 지연로드 할 파일 형식 (.jpeg, png, .gif, .svg, iframe)과 컨텐츠, 위젯, 축소판, Gravatar에 사용할 파일 형식을 선택할 수 있습니다. 심지어 지연로드 애니메이션 설정이 있습니다..

스 머시 지연로드

8. WP 로켓에 의한 게으른 하중

WP 로켓의 게으른 하중 WP Rocket을 사용하지 않지만 이미지를 느리게로드하려는 경우 좋습니다.

게으른로드 플러그인

WP 로켓으로 지연로드에서 지연로드를 활성화하는 방법
설정으로 바로 가기 > 지연로드. 이미지, iframe을 느리게로드하는 옵션이 있습니다 & YouTube 동영상을 미리보기 이미지로 교체합니다. 구성 할 설정이 많지 않습니다. 개인적으로 더 많은 것이 있었으면 좋겠다. 아마도이 게으른로드 플러그인이 최고의 리뷰를 가지고 있지 않은 이유 일 것입니다.

WP 로켓의 게으른 하중

9. A3 게으른 짐

A3 게으른 짐 이미지와 비디오의 지연 로딩 지원.

a3 게으른로드 플러그인

A3 지연로드에서 지연로드를 활성화하는 방법
A3 Lazy Load에서 로딩 로딩을 활성화하려면 설정으로 이동하십시오. > A3 게으른 하중. 지연 로딩 이미지, 비디오, iframe, Gravatar에 대한 설정을 구성하고 지연 로딩을 적용 할 웹 사이트 영역 (모바일 포함)을 선택할 수 있습니다. 지연 로딩 효과, 로딩 배경색 및 URL 및 게시물 유형을 제외하는 옵션을 활성화하는 옵션도 있습니다.

a3 지연로드 설정

10. BJ 게으른 짐

BJ 게으른 짐 잘 관리되지 않은 것 같으므로 다른 플러그인을 사용했을 것입니다..

BJ 게으른로드 플러그인

BJ 지연로드에서 지연로드를 활성화하는 방법
BJ 지연로드에서로드로드를 활성화하려면 설정으로 이동하십시오. > BJ 게으른 짐. 설정은 비교적 간단하며 이미지, iframe, Gravatar를 지연로드하고 컨텐츠, 텍스트 위젯 및 게시물 축소판에서 지연로드를 제외 할 수있는 옵션을 제공합니다. 플레이스 홀더 이미지, 뷰포트 임계 값을 포함하고 지연 로딩시 저해상도 미리보기 이미지를 사용하는 옵션도 있습니다.

BJ 지연로드 설정

11. 이미지의 지연로드

이미지의 지연로드 당신이 이미지를 위해 그것을하고 싶은 경우에 좋습니다.

이미지 플러그인 지연로드

이미지에 지연로드를 활성화하는 방법
Lazy Load For Images 플러그인에는 구성 할 설정이 없습니다 (자동)..

12. 비디오의 지연로드

비디오 게으른로드 포함 된 비디오를 클릭 가능한 미리보기 이미지로 대체.

비디오 플러그인 지연로드

비디오의 지연로드에서 지연로드를 활성화하는 방법
비디오의 지연로드에서로드로드를 활성화하려면 설정으로 이동하십시오. > 비디오 게으른로드. 필요할 때만 CSS / JS를로드하고 재생 버튼을 사용자 정의하며 사용자 정의 CSS를 적용하도록 선택하십시오..

비디오 플러그인 지연로드

13. 코멘트를위한 게으른 짐

당신은을 사용하여 코멘트를 게으른로드 할 수 있습니다 코멘트를위한 게으른 짐 플러그인.

특히 Gravatars가 모든 타사 요청간에로드하는 데 시간이 오래 걸릴 수 있기 때문에 블로그에 댓글이 많은 경우 HTTP 요청을 줄이는 데 도움이됩니다..

주석 플러그인의 지연로드

주석에 대한 지연로드에서 지연로드를 활성화하는 방법
Lazy Load for Comments에서 로딩 로딩을 활성화하려면 설정으로 이동하십시오. > 토론 > 지연로드 설명. 이것이이 플러그인의 유일한 설정 구성이지만 좋은 리뷰가 있습니다..

지연로드 설명

14. WP 유튜브 Lyte

WP YouTube Lyte 게으른 로딩 비디오를위한 내가 가장 좋아하는 (최고의 리뷰가있는) 플러그인 중 하나입니다. Autoptimize의 팀에 의해 만들어졌으며 주변에서 좋은 플러그인 리뷰를하는 경향이 있습니다..

WP YouTube Lyte 플러그인

WP YouTube Lyte에서 지연로드를 활성화하는 방법
WP YouTube Lyte에서 로딩을 활성화하려면 설정으로 이동하십시오. > WP YouTube Lyte. 당신을 잡아 YouTube API 키 Autoptimize에 입력하십시오. 링크 포함, 플레이어 위치, 강제 HD, 일반 YouTube 링크 / iframe으로 작동 및 마이크로 데이터 추가 여부와 같은 플레이어 크기를 선택하십시오. YouTube 동영상을 삽입 할 때 미리보기 이미지를 로컬로 캐시하면 종종 GTmetrix 오류를 해결할 수 있습니다..

YouTube 미리보기 이미지 GTmetrix

Wp YouTube Lyte 설정

여전히 도움이 필요합니다?

WordPress 속도 최적화에 대한 훌륭한 비디오가 있습니다.

이미지 최적화, WP 로켓 구성, 서버 응답 시간 단축 등에 대한 자습서도 있습니다. 이 팁을 사용하여 거의 모든 게시물에서 100 % (또는 거의) GTmetrix 점수를 얻을 수 있습니다. 궁금한 점이 있으면 언제든지 의견을 남겨주세요. 기꺼이 도와 드리겠습니다.!

자주 묻는 질문

&# x2705; 지연 로딩 이미지에 가장 적합한 플러그인?

지연로드를 지원하는 캐시 플러그인 (예 : WP Rocket, SG Optimizer, W3TC, Swift, LiteSpeed)을 이미 사용중인 경우 먼저 시도해 보는 것이 가장 좋습니다. 그렇지 않으면 WP Rocket의 Autoptimize 또는 Lazy Load 플러그인이 좋은 Lazy Load 플러그인입니다.

&# x2705; 지연 로딩 비디오는 어떻습니까?

WP Rocket 및 기타 캐시 플러그인을 사용하면 비디오를 느리게로드하고 YouTube iframe을 미리보기 이미지로 바꿀 수 있습니다. 그렇지 않으면 WP YouTube Lyte가 작동합니다..

&# x2705; 게으른 로딩은 사용자 경험을 해칠 것입니다?

이 웹 사이트에 이미지를로드하는 데 시간이 걸리지 않지만로드하는 데 시간이 오래 걸리기 때문에 비디오를 느리게로드합니다. 지연 로딩 이미지는 사용자에게 성 가시고 내 제휴사 판매를 감소시킬 수 있으므로 비활성화했습니다..

&# x2705; 게으른 로딩은 무엇을합니까??

지연 로딩은 사용자가 페이지를 아래로 스크롤하여 실제로 볼 때까지 이미지와 비디오를로드하기 위해 대기함으로써 초기 로딩 시간을 단축시킵니다..

&# x2705; 특정 페이지에서 지연로드를 비활성화하는 방법?

대부분의 플러그인으로이 작업을 수행 할 수 있습니다. 예를 들어, WP Rocket을 사용 중이고 페이지 나 게시물을 편집하는 경우 대시 보드에 해당 특정 컨텐츠에 지연로드를 비활성화 (또는 활성화)하는 옵션이 표시됩니다.

건배,

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map