WordPress에서 Google SEO의 적절한 크기 이미지 경고 수정하는 방법

이미지 크기를 적절하게 조정하라는 Google의 경고는 요즘 매우 일반적입니다. 이는 브라우저에서 제공하는 이미지가 컨테이너보다 큰 경우에 발생합니다. 아래에서 이 문제를 해결할 수 있는 몇 가지 팁을 살펴보겠습니다.

셀룰러 데이터를 저장하고 로드 시간을 개선하기 위해 적절한 크기의 이미지를 제공해야 합니다.

미디어 라이브러리를 통해 직접 이미지를 업로드 하여 필요한 이미지 크기를 사용할 수 있는지 확인한 다음 미디어 라이브러리에서 삽입하거나 이미지 위젯을 사용하여 최적의 이미지 크기(반응형 중단점 포함)가 사용되도록 합니다. 크기가 용도에 적합하지 않은 경우 전체 크기 이미지를 사용하지 않는 게 좋습니다.

적절한 크기의 이미지

WordPress는 srcset 즉시 사용 가능한 반응형 이미지를 지원합니다. 그러나 WooCommerce와 같은 테마 및 플러그인은 WordPress에서 이미 정의한 것과 다른 크기의 이미지를 원할 수 있습니다.

 

예로 250 x 250 픽셀 크기의 이미지가 필요한 컨테이너가 있는 아카이브 페이지가 있을 수 있습니다. 그러나 미디어 라이브러리에 업로드한 이미지는 500x500 픽셀입니다.

 

이 문제를 해결할 수 있는 몇 가지 방법이 있습니다.

 

1. Regenerate thumbnails - 썸네일 재생성

먼저 WordPress 또는 이미지 폴더에서 미디어 설정을 확인하여 현재 이미지에 대해 생성되는 치수를 확인해야 합니다. 적절한 치수가 없는 경우 새 이미지 크기를 등록 해야 할 수 있습니다.

 

미디어 설정이 정상이라면 WordPress 테마 또는 플러그인을 어느 시점에서 변경했고 썸네일 크기를 업데이트해야 할 수 있습니다. 즉, 썸네일을 다시 생성해야 할 수도 있습니다.

 

다음 무료 플러그인 중 하나를 사용하는 것이 좋습니다.

• Regenerate Thumbnails
• reGenerate Thumbnails Advanced

플러그인을 사용하기 전에 WordPress 사이트(미디어 라이브러리 포함)도 백업해야 합니다.

 

 

2. Force smaller images on smaller screens - 더 작은 화면에 더 작은 이미지 강제 적용

다른 옵션은 사이트에 코드 스니펫을 추가하여 더 작은 화면에 더 작은 이미지를 로드하도록 하는 것입니다. 적절한 크기의 이미지 경고와 관련하여 이 GeneratePress 테마를 사용하고 있다면 아래 코드를 참조하세요.

function set_max_srcset_width( $max_width ) {
    if ( class_exists( 'WooCommerce' ) && ( is_product_category() || is_shop() ) ) {
        $max_width = 300;
    } else {
        $max_width = 768;
    }
    return $max_width;
}
add_filter( 'max_srcset_image_width', 'set_max_srcset_width' );

해당 코드에는 두 개의 $max_width 변수가 있습니다.
첫 번째 $max_width = 300은 쇼핑몰 아카이브에서 사용되는 가장 큰 크기의 썸네일 이미지입니다. 이 값은 제품 카탈로그 너비에 있는 값과 일치해야 합니다.
두 번째 $max_width = 768은 사이트의 다른 모든 페이지용이며 필요한 가장 큰 이미지 크기로 설정해야 합니다.

 

이와 관련하여 문제가 있는 경우 테마 개발자에게 연락하여 도움을 요청하는 것이 좋습니다. 이미지 크기를 올바른 크기로 만드는 것과 관련하여 보다 구체적인 지침을 제공할 수 있어야 합니다.