지연 로딩을 사용하여 이미지를 WordPress에 로드하는 방법을 배우고 싶습니까?
Lazy Load는 사용자가 특정 이미지로 스크롤할 때 웹사이트에서 이미지만 로드하도록 하는 기술로, 웹사이트 로드 시간을 줄이고 웹사이트의 성능을 향상시킵니다.
이미지가 많은 가장 인기 있는 웹사이트는 Lazy Load를 사용하여 웹사이트의 속도와 성능을 향상시킵니다.
이 기사에서는 Lazy Load를 사용하여 WordPress에 이미지를 로드하는 방법을 보여줍니다.
WordPress에서 이미지를 지연 로드하는 이유는 무엇입니까?
WordPress에서 이미지를 느리게 로드하면 웹사이트 속도가 빨라지고 최고의 사용자 경험.
느린 웹사이트를 좋아하는 사람은 없습니다. 실제로 성능 연구에 따르면 페이지 로드 시간이 7초 지연되면 전환이 11%, 페이지뷰가 16%, 고객 만족도가 XNUMX% 감소하는 것으로 나타났습니다.
Google과 같은 검색 엔진도 느린 로딩 웹사이트를 좋아하지 않습니다. 이것이 빠른 웹사이트가 검색 결과에서 더 높은 순위를 차지하는 이유입니다.
이미지는 다른 웹 요소에 비해 웹사이트에 로드하는 데 가장 오랜 시간이 걸립니다. 게시물에 이미지를 많이 추가하면 각 이미지마다 페이지 로드 시간이 늘어납니다.
이 상황을 처리하는 한 가지 방법은 다음을 사용하는 것입니다. CDN 서비스. CDN을 사용하면 사용자가 가장 가까운 웹 서버에서 이미지를 다운로드하고 웹 사이트 로드 속도를 줄일 수 있습니다.
그러나 이미지는 계속 로드되며 전체 페이지 로드 시간에 영향을 미칩니다. 이 문제를 해결하려면 웹 사이트에서 지연 로드 또는 지연 로드를 구현하여 이미지 로드를 지연할 수 있습니다.
이미지의 지연 로딩은 어떻게 작동합니까?
모든 이미지를 한 번에 로드하는 대신 지연 로드는 사용자 화면에 표시되는 이미지만 다운로드합니다. 다른 모든 이미지를 자리 표시자 이미지 또는 빈 공간으로 바꿉니다.
사용자가 아래로 스크롤하면 웹사이트는 브라우저의 표시 영역에 표시되는 이미지를 로드합니다.
지연 로딩은 WordPress 블로그에 매우 유용할 수 있습니다.
- 웹 페이지의 초기 로딩 시간을 줄여 사용자가 웹사이트를 더 빨리 볼 수 있도록 합니다.
- 시청 시 이미지만 제공하여 대역폭을 절약하고 호스팅 비용을 절감할 수 있습니다.
WordPress 5.5 릴리스에는 지연 로딩이 기본 기능으로 추가되었습니다.
그러나 이미지가 지연 로드되고 배경 이미지가 지연 로드되는 방식을 사용자 지정하려면 다음을 사용해야 합니다. 워드 프레스 플러그인.
참고 : 지연 로딩 또는 지연 로딩이 웹사이트 로딩 속도를 개선하는 데 도움이 되지만 최대 성능을 위해 WordPress에 업로드하기 전에 항상 웹용 이미지를 최적화해야 합니다.
우리는 두 가지를 공유 할 것입니다 워드 프레스 플러그인 WordPress 이미지에서 지연 로딩을 쉽게 설정하는 데 도움이 되는 다른 것들.
방법 1. WP Rocket을 사용하여 WordPress에서 지연 로드 이미지
플러그인을 사용하는 것이 좋습니다 WP Rocket 이미지를 WordPress에 게으르게 로드합니다. 시중에서 판매되는 최고의 WordPress 캐싱 플러그인이며 이미지의 지연 로딩을 쉽게 활성화할 수 있습니다.
그 외에도 복잡한 기술 용어를 몰라도 웹 사이트 속도를 최적화하는 데 도움이되는 매우 강력한 플러그인입니다.
설치 및 활성화 시 기본 권장 캐싱 설정은 모두 WordPress 웹 사이트의 속도를 크게 향상시킵니다.
이미지의 지연 로딩을 활성화하려면 몇 개의 상자를 선택하면 됩니다. 비디오에 대해 지연 로딩을 활성화하여 웹사이트 속도를 더욱 향상시킬 수도 있습니다.
방법 2. Optimole을 사용하여 WordPress에서 지연 로드 이미지
이 방법은 무료 플러그인을 사용합니다 최적. 최고의 WordPress 이미지 압축 플러그인 중 하나이며 이미지를 쉽게 지연 로드할 수 있습니다.
월 방문자가 5명 이상인 경우 프리미엄 버전.
활성화할 때 다음으로 이동합니다. 미디어»옵티몰, 그런 다음 API 키에 가입하십시오.
버튼을 클릭하십시오 등록 및 이메일 API 키그리고 그것은 당신에게 이메일로 전송됩니다.
그런 다음 API 키를 입력하고 " OptiMole 서비스에 연결 ".
그 후 탭을 클릭하십시오 " 설정”.
여기에서 " 이미지 크기 조정 및 지연 로드"가 활성화됩니다. 이렇게 하면 방문자의 화면 크기에 따라 이미지가 생성되고 로딩 속도가 향상됩니다.
그런 다음 메뉴 옵션 " 고급 »그리고« Lazyload »를 선택하십시오.
이 화면에는 이미지가 느리게 로드되는 방식을 사용자 지정할 수 있는 다양한 설정이 있습니다.
우선 " 먼저 제외 lazyload의 이미지 ". 이것은 당신의 첫 번째 이미지를 방지합니다 기사 또는 페이지 게으른 부하를 사용합니다.
각 이미지가 느리게 로드되도록 하려면 이 옵션을 0으로 설정할 수 있습니다.
그런 다음 옵션을 활성화할 수 있습니다 " 스케일 이미지 ".
이렇게 하면 방문자의 화면 크기에 맞게 이미지가 조정되고 페이지 로드 속도가 빨라집니다.
그 후 설정을 활성화할 수 있습니다 " 배경 이미지에 대해 Lazyload 활성화 ".
이것은 당신의 웹사이트에 있는 더 큰 이미지의 일부가 될 수 있는 배경 이미지를 느리게 로드할 것입니다.
활성화할 수 있는 또 다른 설정은 포함된 비디오 및 iframe의 지연 로드입니다. 포함된 비디오 콘텐츠가 많은 경우 이 설정을 활성화해야 합니다.
그러면 비디오 대신 자리 표시자 이미지가 로드됩니다. 그것을 클릭하면 전체 비디오가 로드됩니다.
이러한 설정을 계속 사용자 정의하고 웹 사이트 및 이미지에 가장 적합한 것을 확인할 수 있습니다.
플러그인 설정을 종료하기 전에 " 저장 (Save Changes) ".
프리미엄 워드 프레스 플러그인도 만나보세요
당신은 다른 것을 사용할 수 있습니다 워드 프레스 플러그인 현대적인 외관을 제공하고 블로그 또는 웹사이트의 처리를 최적화합니다.
우리는 여기에 당신을 도울 수있는 프리미엄 WordPress 플러그인을 제공합니다.
1. ARMember
ARMember는 워드 프레스 플러그인 콘텐츠 보호. 모든 웹 사이트에서 구독을 판매 할 수있는 고유 한 솔루션입니다. 컨텐츠를 완전히 또는 부분적으로 보호 할 수있는 광범위한 도구가 있습니다.
또 다른 특징은 기능 측면에서 약간 제한적인 무료 옵션을 제공한다는 사실입니다. 기능에 대해 말하자면, 이 강력한 워드 프레스 플러그인 특히 다음을 제공합니다.
콘텐츠 예약 기능, 여러 구독 계획 지원, 간편한 설정, 구독 계획 간 마이그레이션, WooCommerce 지원, 여러 양식 템플릿 등이 있습니다.
또한이 틈새 시장에서 참조입니다.
2. WooCommerce 국가 별 세금 표시
WooCommerce의 국가 별 세금 표시는 방문자의 국가에 따라 세금이 포함되거나 포함되지 않은 제품 가격을 표시 할 수있는 플러그인입니다. 방문자의 청구서 수신 국가를 미리 선택할 수도 있습니다. 
때때로 고객은 서로 다른 통화로 인해 혼란 스러울 수 있으며 세금이 포함 된 경우 훨씬 더 복잡합니다. 따라서 국가 별 세금 표시를 통해 이러한 장애물을 제거하고 구매 프로세스를 단순화 할 수 있습니다.
3. 매끄러운 팝업 프로
슬릭 팝업 프로는 워드프레스 플러그인 플러그인으로 생성된 모든 형식을 변환하는 매우 간단하고 가벼운 문의 양식 7 팝업. 그녀는이 양식을 사용하여 아름답고 완벽하게 반응하는 팝업으로 변환합니다.
팝업 양식은 다음과 같은 여러 용도로 사용할 수 있습니다. 정보 수집 양식, 연락처 양식, 등록 양식, 견적 양식, 제안 / 불만 양식 및 기타.
다른 추천 자료
또한 귀하의 웹 사이트 및 블로그에 대한 이해와 통제를 위해 아래 자료를 참조하십시오.
- 하나의 SEO 팩 워드 프레스에서 전체를 구성하는 방법
- 워드 프레스 테마 Themeforest에서 구입 업데이트하는 방법
- 로그 아웃하기 위해 WordPress 링크를 표시하는 방법
- 하나의 SEO 팩 워드 프레스에서 전체를 구성하는 방법
결론
짜잔! 이 튜토리얼에서 끝났습니다. 이 기사가 WordPress에서 이미지를 느리게 로드하는 방법을 배우는 데 도움이 되었기를 바랍니다. 주저하지 마십시오 좋아하는 소셜 네트워크에서 친구들과 공유.
그러나 귀하는 우리와 상담 할 수 있습니다. 능숙, 인터넷 사이트 제작 프로젝트를 수행하는 데 더 많은 요소가 필요하면 워드 프레스 블로그 제작.
그러나 그 동안 귀하의 commentaires 전용 섹션의 제안.
...
