WordPress에 가장 적합한 이미지 형식은 다음과 같습니다. 자동 폴백으로 JPG 및 PNG를 사용하는 사진 및 그래픽용 WebP와 로고 및 아이콘용 SVG. WordPress는 웹에서 큰 비중을 차지하며 이미지는 일반적으로 WordPress가 제공하는 모든 페이지에서 가장 무거운 요소이므로 업로드하는 형식에 따라 사이트 로드 속도와 순위가 직접 결정됩니다. WordPress는 모든 업로드에 대해 다양한 크기를 생성하여 많은 작업을 처리하지만 설정하지 않는 한 이상적인 형식을 선택하지 않습니다. 이 가이드에서는 사용할 형식, WordPress에서 이미지를 처리하는 방법, WordPress 사이트를 빠르게 유지하는 설정 및 플러그인을 다룹니다.

WordPress에서 이미지 형식이 중요한 이유

일반적인 WordPress 페이지에서 이미지는 방문자가 다운로드하는 바이트의 대부분을 차지합니다. 즉 이미지 형식은 페이지 속도를 좌우하는 가장 큰 요소입니다., 페이지 속도는 Google이 순위 신호로 사용하는 Core Web Vitals에 직접 반영됩니다. 테마는 간결하고 호스팅 속도는 빠르지만 너무 큰 JPG로 가득 찬 페이지는 여전히 크롤링됩니다. 효율적인 형식을 선택하고 WordPress에서 적절한 크기의 버전을 제공하도록 하는 것은 대부분의 사이트에서 수행할 수 있는 가장 효과적인 최적화이며 약간의 설정 외에는 비용이 들지 않습니다.

WordPress에서 이미지 업로드를 처리하는 방법

이미지를 업로드하면 WordPress는 이미지를 저장만 하는 것이 아닙니다. 그것 크기가 조정된 여러 복사본을 자동으로 생성합니다., 썸네일, 중형, 대형, 전체 크기로 구성되어 각 상황에 맞는 크기로 제공할 수 있습니다. 또한 브라우저가 장치별로 적절한 크기를 선택할 수 있도록 반응형 srcset 마크업을 구축합니다. 이는 강력하지만 업로드하는 모든 항목에서 작동하므로 5000픽셀 원본은 모든 크기에서 부풀어 오른 사본을 생성합니다. 합리적인 크기로 효율적으로 압축된 원본을 업로드한다는 것은 생성된 모든 버전도 간결하다는 것을 의미합니다.

WebP: 최신 기본값

WebP는 표준화할 형식입니다. 파일을 생성합니다 동일한 품질의 JPG보다 25~35% 더 작음는 PNG와 같은 투명도를 지원하며 현재 모든 브라우저에서 지원됩니다. WordPress는 버전 5.8부터 WebP 업로드를 지원했으며 올바른 플러그인을 사용하면 기존 JPG 및 PNG의 WebP 버전을 자동으로 제공할 수 있으며 이를 표시할 수 없는 모든 브라우저에서는 원본으로 돌아갈 수 있습니다. 미디어 라이브러리를 WebP로 옮기는 것은 종종 WordPress 사이트가 얻을 수 있는 가장 큰 속도의 승리입니다.

대체 수단으로 JPG 및 PNG 사용

WebP가 이전 형식을 포기한다는 의미는 아닙니다. JPG는 사진의 안전한 대체 수단으로, 투명성이 필요한 그래픽의 경우 PNG로 남아 있습니다., 좋은 최적화 플러그인은 원본을 유지하므로 WebP 지원이 부족한 브라우저는 여전히 작동하는 이미지를 얻을 수 있습니다. 실제로는 평소대로 JPG 또는 PNG를 업로드하면 플러그인이 WebP를 생성하고 함께 제공하여 가능한 한 더 작은 파일을 제공합니다. 이는 호환성 위험 없이 WebP의 비용 절감 효과를 제공하므로 WebP 전용 설정이 아닌 권장 설정입니다.

로고 및 아이콘용 SVG

로고 및 인터페이스 아이콘의 경우 SVG가 모든 래스터 형식보다 뛰어납니다. 그것은 벡터이므로 하나의 작은 파일에서 모든 화면 밀도에서 매우 선명하게 유지됩니다.. WordPress에서는 SVG에 스크립트가 포함될 수 있으므로 보안상의 이유로 기본적으로 SVG 업로드를 허용하지 않으므로 업로드 시 파일을 삭제하는 플러그인을 사용하여 이를 활성화합니다. 활성화되면 SVG로 제공되는 로고는 PNG 로고보다 작고 선명하며 여러 크기를 생성할 필요가 없습니다. 사진이 아닌 로고, 아이콘, 간단한 그래픽용으로 SVG를 예약하세요.

올바른 이미지 크기 선택

WordPress에서는 여러 크기를 생성하지만 크기는 사용자가 제어할 수 있습니다. 설정 콘텐츠 영역보다 넓지 않은 큰 크기, 종종 약 1200~1600픽셀이므로 전체 너비 이미지가 불필요하게 크지 않습니다. 콘텐츠 열 너비가 800픽셀일 때 4000픽셀 사진을 업로드하면 생성된 가장 큰 복사본의 크기가 여전히 너무 크기 때문에 WordPress의 크기가 조정된 후에도 대역폭이 낭비됩니다. 등록된 이미지 크기를 테마의 실제 레이아웃에 맞추면 사이트에서 제공하는 모든 이미지가 표시되는 위치에 비례하여 유지됩니다.

압축 및 최적화 플러그인

최적화 플러그인은 전체 파이프라인을 자동화합니다. 인기있는 옵션 모든 업로드를 압축하고 WebP 버전을 생성하며 불필요한 메타데이터를 제거할 수 있습니다., 이미지를 손으로 터치하지 않고도 모든 작업을 수행할 수 있습니다. 또한 많은 사람들이 기존 라이브러리를 대량으로 최적화하여 수년간 축적된 JPG 및 PNG를 한 번에 WebP로 변환합니다. 일부는 호스팅을 아끼기 위해 자체 서버로 처리 작업을 오프로드합니다. 어느 쪽을 선택하든 효과는 동일합니다. 이미지는 자동으로 압축되어 최상의 형식으로 페이지에 도착합니다. 이는 각 이미지를 수동으로 최적화하는 것보다 훨씬 더 안정적입니다.

지연 로딩 이미지

지연 로딩은 방문자가 이미지 근처에서 스크롤할 때까지 이미지를 지연시키므로 페이지의 초기 로드에서는 즉시 표시되는 것만 가져옵니다. WordPress에서는 기본적으로 지연 로딩을 활성화합니다. 접힌 부분 아래 이미지에 로딩 속성을 자동으로 추가합니다. 이렇게 하면 이미지가 많은 페이지에서 첫 번째 페인트 속도가 눈에 띄게 빨라집니다. 한 가지 예외는 스크롤 없이 볼 수 있는 가장 큰 이미지(종종 영웅)입니다. 이 이미지는 콘텐츠가 포함된 최대 페인트 측정항목을 지연시키지 않도록 열심히 로드해야 합니다. 대부분의 최적화 플러그인에서는 단일 설정으로 지연 로딩에서 해당 이미지를 제외할 수 있습니다.

스트리핑 메타데이터

사진에는 웹사이트에 거의 필요하지 않고 무게를 더하는 메타데이터, 카메라 모델, GPS 위치, 색상 프로필이 포함됩니다. 이 메타데이터를 제거하면 각 파일이 축소됩니다. 눈에 띄는 변화는 없으며 대부분의 최적화 플러그인은 압축의 일부로 이를 수행합니다. GPS 데이터를 제거하면 사진을 찍은 위치를 게시하고 싶지 않을 수도 있으므로 개인 정보 보호 혜택도 있습니다. 색상 정확도가 중요한 경우 보관할 가치가 있는 유일한 메타데이터는 색상 프로필입니다. 그렇지 않으면 이를 제거하면 전체 라이브러리에 걸쳐 눈에 보이지 않는 무료 크기 감소가 이루어집니다.

권장되는 WordPress 이미지 설정

함께 넣어서 설정하면 간단합니다. 테마 레이아웃에 맞는 이미지 크기를 등록하세요. 업로드를 압축하고, 대체 기능을 사용하여 WebP를 생성 및 제공하고, 메타데이터를 제거하는 최적화 플러그인을 설치하세요. 로고와 아이콘에 위생처리된 SVG를 활성화하세요. WordPress의 기본 지연 로딩을 유지하되, 히어로 이미지를 열심히 로드하세요. 그런 다음 적절한 크기의 원본을 업로드하고 파이프라인이 나머지 작업을 수행하도록 하세요. 이를 통해 사이트의 모든 이미지는 자동으로 압축되고 크기가 정확하며 최상의 형식으로 제공되며 라이브러리가 성장함에 따라 사이트는 빠르게 유지됩니다.

AVIF:

WebP를 넘어서는 다음 단계

AVIF는 효율적인 최신 형식이며 WordPress에서도 이를 지원합니다. 압축한다 WebP보다 훨씬 작으며, 종종 다시 20% 더 작습니다., 동일한 시각적 품질로 투명성과 다양한 색상을 지원합니다. 브라우저 지원은 이제 광범위하지만 WebP보다 약간 뒤처져 있으므로 AVIF는 WebP 또는 JPG 대체와 함께 가장 잘 작동합니다. 일부 최적화 플러그인은 WebP와 함께 자동으로 AVIF를 생성할 수 있습니다. 모든 이미지의 마지막 몇 킬로바이트를 추적하는 사이트의 경우 AVIF를 활성화하는 것이 좋습니다. 하지만 현재로서는 WebP가 안전한 기본 형식으로 남아 있습니다.

미디어 라이브러리 및 하우스키핑

시간이 지남에 따라 WordPress 미디어 라이브러리는 사용되지 않는 이미지, 이전 버전 및 백업을 부풀리고 관리자를 혼란스럽게 만드는 복제본으로 가득 차게 됩니다. 사용하지 않는 미디어를 주기적으로 지워 라이브러리를 관리 가능하게 유지합니다. 백업이 줄어들게 됩니다. 플러그인은 게시물이나 페이지에 첨부되지 않은 이미지를 식별할 수 있지만 일부 이미지는 스캔에서 감지할 수 없는 방식으로 사용되므로 삭제하기 전에 검토할 가치가 있습니다. 깔끔한 미디어 라이브러리는 작업하기가 더 쉽고 일단 최적화되면 이미지가 실제로 얼마나 많은 공간을 차지하는지 명확하게 보여줍니다.

테마 변경 후 썸네일 재생성

테마를 전환하거나 등록된 이미지 크기를 변경하면 기존 업로드는 여전히 이전에 생성된 크기를 유지합니다. 축소판을 재생성하면 원본의 모든 크기가 다시 작성됩니다. 전용 플러그인이 전체 라이브러리에 걸쳐 대량으로 수행하는 새로운 차원과 일치합니다. 이 단계를 건너뛰면 새 테마에서 이미지가 늘어나거나 잘못된 크기로 게재될 수 있습니다. 이는 이미지 크기를 변경한 후 일회성 단계이며 이를 실행하면 전체 라이브러리가 현재 테마가 실제로 이미지를 표시하는 방식과 일관되게 유지됩니다.

이미지용 CDN 전송

콘텐츠 전달 네트워크는 각 방문자 근처에 있는 서버에서 파일을 제공하여 이미지 전달 속도를 높입니다. CDN은 전 세계 엣지 위치에 이미지를 캐시합니다., 호스트에서 멀리 떨어진 독자도 여전히 이미지를 빠르게 얻을 수 있습니다. 많은 WordPress 최적화 및 캐싱 플러그인은 CDN을 통합하고 일부 이미지별 CDN도 즉시 변환하고 크기를 조정하여 형식과 크기를 자동으로 처리합니다. 전 세계 사용자가 있거나 트래픽이 많은 사이트의 경우 CDN은 병목 현상으로 인한 이미지 전달을 제거하고 동시에 원본 서버의 부하를 덜어줍니다.

이미지 성능 테스트

최적화 후 결과를 측정합니다. PageSpeed Insights와 같은 도구는 이미지 관련 문제를 보고합니다., 대형 이미지 플래그 지정, 최신 형식 누락, 레이아웃 변경을 유발하는 크기가 없는 이미지 등이 있습니다. 이는 Core Web Vitals에 직접 연결되므로 이들의 조언은 Google이 측정하는 것과 일치합니다. 최적화 단계 전후에 테스트를 실행하면 페이지 속도가 얼마나 빨라졌는지 정확히 알 수 있고 여전히 방해가 되는 이미지가 강조 표시됩니다. 이러한 보고서를 이미지의 무게를 최대한 줄이기 위한 체크리스트로 활용하세요.

일반적인 WordPress 이미지 실수

몇 가지 습관으로 인해 WordPress 사이트가 조용히 느려집니다. 전체 해상도 카메라 이미지 업로드, 압축 건너뛰기, WebP 활성화 안 함 가장 일반적이며 각각은 작은 파일이 할 수 있는 곳에 큰 파일을 남깁니다. 다른 것에는 이미지 크기 설정을 잊어버려서 레이아웃이 바뀌는 것과 절약하는 것보다 더 많은 무게를 추가하는 느리고 기능이 많은 플러그인을 사용하는 것이 포함됩니다. 위의 설정으로 이러한 모든 문제를 쉽게 해결할 수 있습니다. 이를 피하면 라이브러리가 채워지면서 해마다 속도가 느려지는 것을 지켜보는 대신 WordPress 사이트가 성장함에 따라 빠르게 유지됩니다.

WordPress에 가장 적합한 이미지 형식은 무엇입니까?

JPG 및 PNG 대체 기능을 갖춘 사진 및 그래픽용 WebP와 로고용 SVG. WebP 파일은 동일한 품질에서 JPG보다 25~35% 작으며 현재 모든 브라우저에서 이를 지원합니다.

WordPress는 WebP를 지원하나요?

네, WordPress 5.8부터. WebP를 직접 업로드할 수 있으며 최적화 플러그인은 대체 기능을 통해 기존 JPG 및 PNG의 WebP 버전을 자동으로 제공할 수 있습니다.

WordPress에 SVG 파일을 업로드할 수 있나요?

보안상의 이유로 기본적으로는 아닙니다. 업로드 시 SVG를 삭제하는 플러그인 이를 안전하게 활성화하면 SVG로 사용되는 로고와 아이콘이 PNG보다 작고 선명해집니다.

이미지 최적화 플러그인이 필요합니까?

적극 권장됩니다. 플러그인은 업로드를 압축하고 WebP를 생성하며 메타데이터를 자동으로 제거합니다., 이는 각 이미지를 수동으로 최적화하는 것보다 훨씬 더 안정적입니다.

WordPress에 업로드하기 전에 이미지 크기를 조정해야 합니까?

예. 콘텐츠 영역보다 넓지 않게 업로드하세요., 대개 1200~1600픽셀입니다. 거대한 원본은 WordPress에서 생성하는 모든 크기를 너무 크게 만듭니다.

WordPress에서는 AVIF를 지원하나요?

예. AVIF는 WebP보다 약 20% 더 작게 압축합니다. 동일한 품질로 제공되며 일부 최적화 플러그인은 자동으로 생성합니다. 전체 브라우저 지원을 위해 WebP 또는 JPG 대체와 함께 제공하세요.

WordPress 이미지에 CDN을 사용해야 합니까?

글로벌 사이트 또는 트래픽이 많은 사이트의 경우 그렇습니다. CDN은 전 세계 엣지 위치에 이미지를 캐시합니다., 멀리 있는 방문자가 신속하게 해당 정보를 얻을 수 있고 원본 서버에서 로드가 발생합니다.

테마를 변경한 후 이미지가 잘못 보이는 이유는 무엇입니까?

기존 업로드는 이전에 생성된 크기를 유지하기 때문입니다. 축소판을 재생성하면 원본의 모든 크기가 다시 작성됩니다. 새 테마의 크기와 일치합니다.

WordPress 이미지를 지연 로드해야 합니까?

예, 그리고 WordPress에서는 기본적으로 지연 로딩을 활성화합니다. 접힌 부분 아래 이미지에. 계속 유지하되 콘텐츠가 포함된 최대 페인트가 지연되지 않도록 스크롤 없이 볼 수 있는 주요 히어로 이미지를 열심히 로드하세요.

WordPress 사이트 속도에 가장 적합한 이미지 형식