WordPress에서 이미지를 최적화하는 방법 (속도 + SEO 모두)

이미지 최적화와 관련하여 대체 텍스트에 대해 충분히 들어 보셨을 것입니다..


SEO와 속도 최적화를 모두 포함하는 경우 실제로 이미지를 최적화하는 방법은 20 가지가 있습니다. 이를 통해 GTmetrix / Pingdom에서 더 높은 점수를 받고 잠재적으로 검색에서 더 높은 순위를 매기고 콘텐츠를 훨씬 빠르게로드 할 수 있습니다. 0.5 초의로드 시간으로 100 % GTmetrix 보고서를 얻을 수있었습니다… WordPress에서 이미지를 최적화하는 것이 큰 부분이었습니다.

업로드하기 전에 이미지 최적화 – 이미지를 업로드하기 전에 Photoshop과 같은 프로그램을 사용하여 이미지를 최적화하면 많은 작업을 절약 할 수 있습니다. EXIF 데이터의 크기를 조정하고, 압축하고, 스트립하고, 올바른 형식 (예 : PNG / JPEG)으로 저장하고 설명이 포함 된 파일 이름을 쓸 수 있습니다 (이를 사용하는 경우 대체 텍스트로 자동 사용됨). 자동 이미지 대체 속성 플러그인). 6 가지 최적화!

고해상도 이미지가 필요한 경우 (예 : 사진 웹 사이트) 크기를 줄이거 나 압축하지 않으려는 경우 (3 단계 및 8 단계), 소량이라도 품질이 저하 될 수 있으므로.

내가 사용하는 주요 도구 – 나는 사용한다 이미지 크기 조정 / 압축 (선택한 이미지 편집기), WP 로켓 캐시 플러그인, 상상하다 추가 무손실 압축 + EXIF ​​데이터 제거 구름 플레어StackPath CDN, 자동 이미지 ALT 속성 플러그인 이미지 파일 이름을 대체 텍스트로 자동 사용 최적의 Gravatar 캐시 댓글에 Gravatar를 캐시합니다. 나는 사용한다 WP 검토 프로 리치 스 니펫 플러그인으로, 더 나은 검색 교체 이미지를 대량 업데이트 (매우 편리)하고 GTmetrix 내 속도 테스트 도구로 전체 툴 목록보기.

1. 최적화되지 않은 이미지 찾기

통해 사이트를 실행 GTmetrix Page Speed ​​/ YSlow 탭에서이 항목들을 볼 수 있습니다. 처음 5 개는 일반적으로 페이지마다 다릅니다., GTmetrix는 테스트 한 단일 페이지에 대해 최적화되지 않은 이미지 만 표시합니다.. 마지막 3 개는 일반적으로 전체 사이트에서 발생합니다.. 물론이 방법은 이미지를 최적화하는 7 가지 방법이지만 가장 중요한 것 중 일부이므로 먼저 수행하겠습니다..

  • 스케일 된 이미지 제공: 큰 이미지의 크기를 올바른 크기로 조정합니다 (2 단계)
  • 이미지 치수 지정: 이미지의 HTML 또는 CSS에서 너비 / 높이를 지정합니다 (3 단계)
  • 이미지 최적화 – 무손실 압축 이미지 (4 단계)
  • CSS 스프라이트를 사용하여 이미지 결합 – 여러 이미지를 하나의 이미지로 결합5 단계)
  • URL 리디렉션 방지 – 잘못된 www 또는 http (s) 버전의 이미지를 제공하지 않습니다 (6 단계)
  • 컨텐츠 전달 네트워크 사용 – CDN에서 이미지 / 파일 제공7 단계)
  • 브라우저 캐싱 활용 – 캐시 플러그인을 사용하여 이미지 / 파일을 캐시합니다 (8 단계)
  • 파비콘을 작고 캐시 가능하게 만들기 – 16x16px 파비콘을 사용하여 캐시 (9 단계)

GTmetrix의 이미지 최적화

여러 페이지에 나타나는 이미지를 수정하여 시작: 로고, 사이드 바 / 바닥 글 이미지 등. 새로운 크기로 크기를 조정하거나 다시 업로드해야 할 수 있으므로 게재 된 이미지로 시작합니다..

2. 스케일 이미지 제공

당신이 볼 경우 스케일 이미지 제공 GTmetrix에서 오류가 발생하면 이미지가 너무 커져서 올바른 크기 (GTmetrix가 제공하는)로 크기를 조정해야한다는 의미입니다. 이미지 치수 치트 시트를 따르는 한 (아래 참조) 이러한 오류가 표시되지 않아야합니다. 그러나 이미 큰 이미지를 업로드 한 경우 수동으로 크기를 조정하거나 플러그인을 사용해야합니다.

서브 스케일 이미지

플러그인을 사용하여 이미지 크기 조정 – 이것의 문제점은 다른 이미지가 다른 크기 (위젯, 슬라이더, 전폭 이미지)를 요구한다는 것입니다. 대부분의 이미지 최적화 플러그인에는 이미지의 크기를 하나로 조정할 수있는 옵션이 있지만 단일 특정 크기의 세트를 사용하려면 업로드하기 전에 크기를 자르거나 크기를 조정해야합니다. 플러그인을 사용하여 이미지 크기를 조정하는 경우 결과에 만족하지 못할 경우 원본 이미지의 백업을 유지하고 몇 가지만 테스트하십시오..

큰 이미지 크기 조정

수동으로 이미지 크기 조정 – GTmetrix에서 올바른 치수를 가져 와서 크기를 조정하거나 다시 업로드하십시오. GTmetrix는 테스트 한 단일 페이지에 대해 최적화되지 않은 이미지 만 표시합니다..

웹 사이트 이미지 크기의 요령 만들기
슬라이더, 블로그 사이드 바, 추천 이미지 및 블로그 컨텐츠 본문은 모두 이미지 크기를 조정해야하는 특정 크기를 요구합니다. 치트 시트를 만들어 워드 프레스에 업로드하기 전에 크기를 조정할 수 있습니다. 이 방법은 웹 사이트에서 여러 이미지 크기가 필요한 여러 영역이 있고 여러 디자이너 / 편집자가있는 경우 특히 유용합니다..

예:

  • 슬라이더 이미지 : 1900 (w) x 400 (h)
  • 캐 러셀 이미지 : 115 (h)
  • 위젯 이미지 : 414 (w)
  • 전폭 블로그 게시물 이미지 : 680 (w)
  • 대표 이미지 : 250 (w) x 250 (h)
  • Yoast Facebook OG 이미지 : 1200 (w) x 628 (h) – 11 단계
  • Yoast Twitter OG 이미지 1024 (w) x 512 (h) – 11 단계

680 픽셀 폭 사각형

3. 이미지 치수 지정

이는 이미지의 HTML 또는 CSS에 너비 / 높이를 추가하는 것을 의미합니다. 비주얼 편집기가이를 수행합니다 (위젯, 일부 페이지 빌더 및 맞춤 HTML 하지 마라). GTmetrix에서 몇 페이지 테스트.

GTmetrix는 이미지의 크기를 알려줍니다…

특정 이미지 치수 GTmetrix

이미지의 HTML에 너비 / 높이 추가…

이미지 치수 지정

4. 이미지를 무손실로 압축

GTmetrix의 “이미지 최적화”항목입니다. 많은 프로그램 (예 : Photoshop 및 Gimp)에는 내보낼 때 압축 할 수있는 옵션이 있습니다. 이것은 훌륭한 시작이지만 이미지 압축 플러그인은 일반적으로 더 나은 결과를 얻습니다. 나는 선호한다 상상하다, 크라켄, 숏 픽셀, 또는 스 머시. 다른 플러그인은 이미지 품질을 시각적으로 낮추는 것으로 알려져 있으며 이미지에 오류가 발생할 수 있습니다.

Imagify로 이미지 압축

  1. 가입 상상하다
  2. 설치 플러그인 상상
  3. 아래 지침을 묻는 메시지가 나타납니다.
  4. Imagify 계정에서 API 키를 입력하십시오
  5. 압축 수준 설정 (정상, 공격적, 울트라)
  6. Imagif’em all (아래 사진)은 사이트의 모든 이미지를 일괄 최적화합니다
  7. 한도에 도달하면 4.99 달러를 지불하거나 다음 달에 한도를 재설정하여 한도를 재설정합니다.

상상하다

다양한 압축 수준에서 이미지가 어떻게 보이는지 테스트하십시오…

압축 비교를 상상해보십시오

가입 한 후에는 사이트의 모든 이미지를 일괄 최적화하십시오…

워드 프레스 이미지 최적화

업로드시 이미지를 최적화하는 옵션을 설정하십시오…

업로드시 이미지 최적화

5. CSS 스프라이트로 이미지 결합

내 홈페이지에는 21 개의 아이콘이 있다고 생각할 수 있지만 실제로는 하나의 이미지입니다. 이것은 CSS 스프라이트, 여러 이미지를 하나의 단일 이미지로 결합합니다. 이렇게하면 이미지 (및 요청) 수가 줄어들어 내 홈페이지에 10 개의 요청 만 있습니다. 21 개의 이미지를로드하는 대신 1을로드합니다. 이렇게하려면 CSS 지식이 필요합니다. CSS 스프라이트 생성기.

CSS 스프라이트

GTmetrix CSS 스프라이트

장식용 이미지에만 CSS 스프라이트 사용 – 21 개의 이미지를 1로 결합 할 때 많은 이미지 대체 태그가 손실됩니다. 중요한 이미지가 컨텐츠를 설명하는 CSS 스프라이트로 결합하지 마십시오. 내 홈페이지의 속도는 SEO보다 중요하다. 나는 내 홈페이지의 GTmetrix 보고서를 많은 곳에서 사용한다 (따라서 깨끗하게 유지해야한다). 예어. 튜토리얼의 개요를 설명하고 빠르게로드하는 것이 목적입니다..

6. 이미지 URL 리디렉션 방지

HTTPS, www 버전으로 변경하거나 CDN에서 이미지 제공을 시작한 경우 다음을 사용하여 모든 이미지 (및 링크)를 대량 업데이트해야합니다. 더 나은 검색 교체 올바른 버전을 제공하고 있습니다. 그렇지 않으면 당신은 볼 수 있습니다 리디렉션 최소화 또는 쿠키가없는 도메인 사용 오류.

리디렉션 최소화

쿠키 무료 도메인

더 나은 검색 바꾸기 플러그인을 사용하여 이미지 URL을 대량 업데이트하십시오…

더 나은 검색 WWW 버전 교체

더 나은 검색 HTTP 대 HTTPS 교체

7. CDN에서 이미지 제공

이를 위해서는 이미지 URL을 변경하여 CDN URL

  • 기존 이미지 URL (CDN 제외): https://onlinemediamasters.com/wp-content/uploads/2017/02/Tom-Dupuis-Widget.png
  • 새 이미지 URL (CDN 포함): https://t9w8m8j8.stackpathcdn.com/wp-content/uploads/2017/02/Tom-Dupuis-Widget.png

Cloudflare와 StackPath – 나는 둘 다 사용 구름 플레어StackPath 더 많은 데이터 센터 = 더 빠른 컨텐츠 제공. Cloudflare는 200 개 이상의 데이터 센터, StackPath는 34 개 이상의 데이터 센터 미국에 많이 위치한 곳 (내 방문자 대부분이 거주하는 곳). Cloudflare는 CDN URL을 할당하지 않습니다 StackPath의 CDN을 사용하여 이미지를 제공합니다..

StackPath- 데이터 센터

1 단계: CDN을 선택하십시오. 나는 사용한다 StackPath (30 일 평가판이 있습니다).

2 단계: 대시 보드에서 CDN 탭을 클릭 한 다음 StackPath CDN 사이트 만들기

StackPath-CDN- 탭

StackPath-CDN- 도메인

CDN-URL-StackPath

3 단계: CDN URL을 복사하여 캐시 플러그인에 붙여 넣습니다 (아래 WP Rocket).

WP- 로켓 -CDN

4 단계: CDN URL을 포함하도록 이미지 URL을 교체합니다 ( 더 나은 검색 교체).

더 나은 검색 CDN URL 교체

5 단계: 이전 이미지 URL을 사용하여 확인 크롬 개발자 도구. 때로는 캐시 플러그인 또는 CDN 인 에이 블러 하드 코딩 된 CSS 및 JavaScript의 링크를 제외하고는이를 처리합니다. 남겨진 링크의 경우 일반적으로 파일들 (예 : CSS 또는 Javascript) 수동 확인 및 교체가 필요합니다. Chrome DevTools는 현재 사용중인 모든 도메인을 보여줍니다.

6 단계: 귀하의 사이트를 GTmetrix YSlow에서는 ‘콘텐츠 전송 네트워크’가 녹색이어야합니다. ‘리디렉션 최소화’또는 ‘쿠키가없는 도메인 사용’에 오류가 없어야합니다..

CDN GTmetrix YSlow

8. 캐시 이미지

대부분의 캐시 플러그인에는 브라우저 캐싱, 이미지를 캐시합니다. 여러 Facebook 설문 조사에서 # 1 캐시 플러그인으로 평가 된 WP Rocket을 사용하며 이에 대한 자습서가 있습니다.. 신속한 성능 일반적으로 # 1 무료 캐시 플러그인 ranked입니다 (저도 튜토리얼이 있습니다).

브라우저 캐싱

9. Favicon을 작고 캐시 가능하게 만들기

즐겨 찾기 아이콘이 16×16 픽셀이고 즐겨 찾기 아이콘 .ico 형식이며 캐시 플러그인을 사용하여 캐시되어 있는지 확인하십시오..

10. EXIF ​​데이터 제거

Exif 데이터 조리개, 셔터 속도, ISO, 초점 거리, 카메라 모델, 사진 촬영 날짜 등과 같은 정보가 포함됩니다. 웹 사이트의 이미지에는 필요하지 않습니다. 그만큼 VA Exif 플러그인 제거 이미지가 업로드되면 Exif 데이터를 자동으로 제거합니다.

대부분의 이미지 최적화 플러그인 (Imagify, ShortPixel, Kraken, EWWW 및 Smush 포함)에는 EXIF ​​데이터를 자동으로 제거하는 옵션이 있습니다. Imagify의 설정은 다음과 같습니다.

EXIF 데이터 제거를 상상

11. Cloudflare 이미지 최적화

Cloudflare에는 이미지를 최적화하는 몇 가지 방법이 있습니다. 미라지와 폴란드어는 Cloudflare 속도 설정 핫 링크 보호는 스크랩 실드 설정.

구름 불꽃 신기루 (프로 기능) – 네트워크 연결 속도가 느린 모바일 장치에서 이미지 요청, 지연로드 이미지 및 이미지로드 시간을 단축합니다. 자세한 내용은 다음과 같습니다…

  • 방문자의 기기 / 연결에 따라 이미지의 크기를 조정합니다. 연결 상태가 좋지 않은 방문자는 더 높은 대역폭으로 돌아올 때까지 더 작은 버전 (낮은 해상도)을 얻습니다..
  • 요청 량 감소 – Mirage는 웹 사이트의 모든 이미지에 대해 여러 개의 요청을 보내는 대신이를 하나의 요청으로 가져와 방문자가 이미지를 즉시 볼 수 있도록합니다..
  • 지연은 이미지를로드합니다 (사용자가 아래로 스크롤하여 실제로 이미지를 볼 때만로드).

Cloudflare 이미지 미라지

Cloudflare Polish (Pro Feature) – EXIF ​​데이터를 제거하고 이미지를 압축합니다.

Cloudflare 이미지 폴란드어

Cloudflare 핫 링크 보호 – 사람들이 이미지를 복사하여 자신의 웹 사이트에 붙여 넣지 못하도록합니다 (여전히 해당 이미지를 호스팅하고 있기 때문에)..

Cloudflare 핫 링크 보호

12. 게으른로드 이미지

이렇게하면 사용자가 페이지를 아래로 스크롤하여 이미지를 볼 수있을 때까지 이미지로드가 지연됩니다. 초기로드 시간은 향상되지만 스크롤 할 때 이미지를 지속적으로로드하면 매우 성 가실 수 있습니다. 이미지보다로드하는 데 시간이 오래 걸리기 때문에 개인적으로 게으른로드 비디오 만.

당신은 사용할 수 있습니다 지연로드 플러그인, 비디오 플러그인 지연로드, 또는 WP 로켓을 사용하십시오…

WP- 로켓-지연 부하

13. 올바른 형식으로 저장

PNG 대 JPEG – PNG는 압축되지 않은 (큰 파일 크기) 많은 색상이없는 간단한 이미지에 사용해야합니다. JPEG는 압축 된 (파일 크기가 작음) 이미지 품질을 약간 낮추지 만 크기는 작으며 색상이 많은 이미지에 사용됩니다. 김프 및 기타 이미지 편집 프로그램은 올바른 형식을 자동으로 사용해야하지만 여전히 알고 있어야합니다..

jpg_vs_png

그림 라놀

14. 이미지 파일 이름

검색 엔진은 대체 텍스트와 이미지 파일 이름을 모두 사용하므로 파일을 WordPress에 업로드하기 전에 파일 이름을 지정하십시오. 플러그인을 사용하는 경우 대체 텍스트를 자동으로 추가 파일 이름을 기준으로 파일 이름을 지정하면됩니다. 키워드를 넣지 말고 이미지를 설명하십시오..

레이블 이미지 파일 이름

15. 대체 텍스트

이미지 파일 이름과 같아야합니다. 당신은 사용할 수 있습니다 자동 이미지 대체 속성 플러그인 파일 이름을 대체 텍스트로 자동 사용합니다. 관련성 높은 이미지를 사용하는 한 일부 이미지에는 자연스럽게 키워드의 비트가 포함되어야합니다. 이미지에 키워드를 넣을 이유는 없습니다. 키워드 페널티.

이미지에 대체 텍스트를 자동으로 추가 – 사용 자동 이미지 대체 속성 플러그인. 이제 이미지를 추가 할 때마다 플러그인은 파일 이름과 동일한 대체 텍스트를 추가합니다.

Alt ="WP- 가장 빠른 캐시 플러그인" 폭 ="577" 높이 ="247" />

누락 된 대체 텍스트 찾기 – Screaming Frog는 대체 텍스트가없는 모든 이미지를 보여주는 무료 도구입니다..

  • 다운로드 개구리 SEO 거미 비명
  • 웹 사이트를 입력하고 “시작”을 클릭하여 웹 사이트를 크롤링하십시오.
  • 이미지 탭을 클릭하십시오
  • 개요로 이동 → 대체 텍스트 누락 (아래 참조)
  • 귀하의 사이트에서 해당 이미지를 찾아 대체 텍스트를 추가하십시오

이미지 대체 텍스트 누락 – 개구리 비명

16. 오픈 그래프 (Facebook + Twitter)

Facebook / Twitter에서 공유 할 때 콘텐츠 형식을 올바르게 지정합니다. 특히 두 네트워크 모두 사용자 지정 크기를 사용하여 표시하기 때문에 이미지가 그렇지 않으면 재미있어 보입니다..

페이스 북에 공유

Yoast를 사용하는 경우 “소셜”설정으로 이동하여 Facebook / Twitter 모두에 대해 Open Graph를 활성화하십시오.

Yoast-Social-Meta-Data

이제 페이지 / 포스트를 편집 한 다음 Yoast에서 “공유”링크를 클릭하면 Facebook (1200 너비 x 628 높이) 및 Twitter (1024 너비 x 512 높이)에 대한 사용자 정의 이미지를 업로드하는 옵션이 표시됩니다..

yoast-social-media-optimization

17. 추천 스 니펫의 이미지

추천 스 니펫 Google이 검색 결과 상단에 콘텐츠 일부를 표시하고 이미지를 포함 할 수는 있지만 보장 할 수는 없습니다.. Google은 첫 페이지 결과에서이를 가져옵니다., 그러나 추천 스 니펫이나 이미지를 표시할지 여부는 그들에게 달려 있습니다. 또한 스 니펫이 두 번 표시되며 트래픽을 많이 발생시키는 놀라운 방법입니다..

추천 스 니펫의 3 가지 유형

  • 대답
  • 테이블
  • 기울기

추천 이미지 스 니펫

Google에서 추천 스 니펫을 얻는 방법

  • 사람들이 원하는 키워드 타겟팅 간결한 대답
  • 사용하다 Moz 키워드 탐색기 질문 키워드를 식별하기 위해
  • 더 많은 질문 키워드를 찾으려면 대중에게 답변을 사용하십시오
  • 답변이 단락, 목록 또는 표 중 하나 여야하는지 선택
  • 키워드를 설명하는 멋진 그래픽을 디자인하거나 사진을 찍습니다.
  • 최적의 문자 길이를 사용하십시오 (아래에서 찍은 사진 참조). 모즈)
  • 품질 참조 (링크, 그래픽 등)로 사실 기반 컨텐츠 작성
  • 추천 스 니펫이 있지만 실적이 저조한 키워드 타겟팅
  • 답변 상자를 목표로하는 경우 일치 검색을 사용하여 키워드를 타겟팅하십시오.
  • 키워드의 첫 페이지에 있는지 확인하십시오. 그렇지 않은 경우 콘텐츠를 개선하십시오.

최적의 추천 스 니펫 길이

18. 구조화 된 데이터

이미지를 사용할 수 있습니다 구조화 된 데이터 (과 배지다음 콘텐츠 유형의 경우)

비디오 리치 스 니펫

레시피 리치 스 니펫

제품 리치 스 니펫

어떤 리치 스 니펫 플러그인을 사용해야합니까?
나는 사용한다 MyThemeShop의 WP Review Pro 레시피 및 제품 리뷰를 포함하여 14 가지 데이터 유형을 지원하는 (여기에서 사용하고있는 페이지) WP Rich Snippets를 사용했지만 개발자가 플러그인을 포기했으며 2 년 이상 업데이트되지 않았으며 올인원 스키마 플러그인 그냥 지루합니다 (옵션과 스타일이 부족합니다). WP Review Pro는 사용하기 매우 쉽습니다.

19. 스타일 이미지

이미지 스타일을 잊지 마십시오! 나는 대부분의 테두리를 사용합니다.

  • 이미지 제목
  • 이미지 링크
  • 이미지 테두리
  • 이미지 캡션

20. GIF 크기 조정

이미지의 크기를 올바른 크기로 조정하는 것처럼 GIF도 크기를 조정해야합니다 (사용 GIF GIF).

GIF 크기 조정…

GIF 크기 조정

그런 다음 압축하십시오…

GIF 압축

결과 :-)

개 GIF 최적화

21. 캐시 그라바타

댓글이 많은 게시물이있는 경우, 그라바타 보고서를 완전히 망칠 수 있습니다. 댓글을 비활성화하거나 댓글을 끊어 특정 개수의 댓글 만 표시하거나 Gravatar 캐시 플러그인을 사용해보십시오. 일부 플러그인은 일부 웹 사이트에서 작동하지 않으므로 약간의 테스트가 필요할 수 있습니다..

  • 캐시 그라바타 (최적, 해리, 또는 FV 그라바타 캐시)
  • Gravatars를 완전히 비활성화
  • 기본 Gravatar를 공백으로 설정
  • 가치를 추가하지 않는 댓글 삭제
  • 기본 Gravatar를 서버의 사용자 정의 이미지로 설정
  • Gravatar 이미지를 더 작은 크기로 제한하십시오 (예 : 32px)
  • 한 번에 20 개의 주석 만 표시하도록 WP Disable의 페이지 매김 주석
  • 이 중 아무것도 작동하지 않으면 확인하십시오. WP 로켓의 캐싱 그라바타 튜토리얼

캐시-그라바타 이미지

22. 외부 웹 사이트에서 이미지를 포함시키지 마십시오

항상 웹 사이트에 이미지를 업로드하고 절대 복사 / 붙여 넣기하지 마십시오. 그렇지 않으면 이미지가 서버에서 호스팅되지 않으므로 추가 요청이 발생하여 다른 곳에서 가져와야합니다..

23. 이미지 최적화 도구

중복 기능이있는 플러그인 사용 금지 – Imagify, ShortPixel, Kraken, EWWW 및 Smush는 기본적으로 모두 동일한 작업을 수행합니다 (무손실 압축, EXIF ​​데이터 제거, 이미지 크기 조정). WP Rocket에는 대부분의 캐시 플러그인이 지원하지 않는 지연로드, 캐싱 및 CDN (및 데이터베이스 정리 + 로컬로 Google 웹 로그 분석 호스팅)에 대한 옵션이있어 추가 플러그인을 사용하지 않아도됩니다.

자주 묻는 질문

&# x2705; GTmetrix에서 Optimize Image 오류를 수정하는 방법?

ShortPixel, Imagify 또는 Smush와 같은 플러그인을 사용하여 무손실 압축합니다. GTPtrix에서 항상이 오류를 수정하기 때문에 ShortPixel을 사용합니다..

&# x2705; GTmetrix에서 Serve Scaled Image 오류 해결 방법?

즉, 이미지를 올바른 크기로 자르거나 크기를 조정해야합니다. 이미지가 너무 큰 경우 GTmetrix는 배율 조정 된 이미지 오류를 표시하고 크기를 조정해야하는 정확한 크기를 알려줍니다..

&# x2705; GTmetrix에서 이미지 크기 지정 오류를 수정하는 방법?

이 학습서에 표시된대로 이미지의 HTML을보고 지정된 너비와 높이를 갖는지 확인하십시오..

&# x2705; 이미지를 더 빠르게로드 할 수있는 다른 방법?

EXIF 데이터를 제거하고 CDN을 사용하여 이미지를 제공하는 것은 GTmetrix의 권장 사항 이외의 차이를 만듭니다.

&# x2705; 가장 적합한 이미지 최적화?

사실상 품질 손실이 거의 없기 때문에 ShortPixel을 사용하고 GTmetrix에서 이미지 최적화 항목을 수정합니다..

어떻게 생각해?
GTmetrix 보고서가 조금 나아 보이나요? 댓글로 알려주세요! 더 나은 점수 /로드 시간을 얻을 수있는 더 많은 팁을 원한다면 전체 WordPress 속도 가이드를 참조하십시오..

건배,

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