안녕, 후지이, 나 강해. "워드프레스 디스플레이 속도를 높이기 위한 이미지 압축"에 대해 설명하겠습니다.
이 글을 읽으면 사이트 표시 속도를 높이고 페이지 로딩의 스트레스를 크게 줄일 수 있는 웹사이트를 만들 수 있습니다.
비용은 없습니다. *유료 옵션도 도입할 예정이지만, 사용 여부는 자유롭게 선택할 수 있습니다.
먼저, 이미지 압축이 무엇인지 설명해 보겠습니다.
이미지 압축이란 무엇인가요?
왜 워드프레스 웹사이트에서 이미지 파일을 압축해야 하나요?
이유는 간단합니다. 이는 이미지 압축이 데이터 양을 줄일 수 있기 때문입니다.이미지 품질을 해치지 않으면서 데이터 볼륨을 줄이는 방법당신은 할 수 있어요.
큰 파일 크기를 가진 이미지를 표시하려고 하면 로딩에 시간이 오래 걸립니다. 하지만 데이터 양을 줄일 수 있다면 페이지 로딩 속도를 크게 향상시킬 수 있습니다.
이미지 압축은 디스플레이 속도를 높이는 매우 효과적인 방법입니다.
그렇다면 왜 웹사이트를 더 빠르게 해야 할까요?
왜 웹사이트를 더 빠르게 보이게 하나요?
통계에 따르면, 40%의 사용자가 웹페이지가 3초 이상 로드되면 페이지 읽기를 포기하고 떠납니다.
즉, 콘텐츠의 질이 좋더라도,페이지가 느려지는 것은 방문자에게 귀찮은 일입니다그 말은
인터넷을 서핑할 때 페이지가 쉽게 나타나지 않을 때 답답함을 느껴본 적이 있나요?
페이지 로딩이 오래 걸리면 방문자에게 스트레스를 줄 수 있습니다.
페이지 표시 속도는 구글의 SEO 조치와 관련이 있습니다
또한페이지 로딩 속도는 구글의 SEO 관점에서 매우 중요합니다그럴 수 있어.
2018년에 도입된 구글의 알고리즘 업데이트인 "Speed Update"는 사이트 디스플레이 속도가 검색 결과 순위 변화와 어떻게 연관될 수 있는지 설명합니다.
느린 페이지 표시 속도도 SEO에 단점입니다.
워드프레스 웹사이트의 표시 속도를 빠르게 향상시키려면 어떻게 해야 할까요?
효율적이고 스트레스 없는 최대 속도를 위해이미지 압축그럴 수 있어.
이미지 압축이 페이지 표시 속도를 바꾸나요?
상황은 변할 것입니다. 이것은 '이론 이론'이 아니라 실제로 페이지의 표시 속도를 변경합니다.
이 사이트의 사례 연구를 참고해 주세요. 이것은 이미지 압축 전의 페이지 속도입니다.
우리는 구글에서 제공하는 PageSpeed Insights로 모바일 조회 속도를 측정했습니다. 결과가 위의 이미지입니다.
디스플레이 점수는 96점으로 아무 문제 없이 나옵니다. 하지만 모바일 뷰어에서는 페이지 속도가 느린 것을 분명히 볼 수 있습니다.
이미지 압축 후 페이지 속도
그렇다면 이미지 압축 후에는 어떻게 달라졌나요?
모바일에서 90점.
디스플레이에는 94점이 표시되어 있습니다. 특히 모바일 디스플레이 측면에서 크게 개선했습니다.
위 결과는 단순히 이미지 압축입니다. 웹사이트 표시 속도를 높이기 위해 다른 작업은 하지 않고 있습니다.
워드프레스 사이트의 표시 속도를 근본적으로 향상시키고 싶다면, 아래 글도 읽어보시기 바랍니다.
>> [최신] 워드프레스 디스플레이 속도 느린 원인과 15분 만에 초고속 재생 방법
이제 사이트 표시 속도를 크게 향상시키는 '이미지 압축 방법'에 대해 자세히 설명하겠습니다.
사이트 표시 속도를 향상시키기 위한 "이미지 압축" 방법
워드프레스 웹사이트에서 이미지를 압축하는 방법을 살펴보겠습니다.
이번에는 이미지 압축을 위한 무료 워드프레스 플러그인에 대해 이야기하려고 합니다.쇼트픽셀저도 사용해요.
여러 이미지 압축 플러그인을 사용해봤지만, 결국 ShortPixel을 선택했습니다.
또한 특정 리뷰 논문도 썼습니다. 아래로 내려가 주세요.
이 섹션에서는 ShortPixel을 사용하고 설정하는 방법을 설명합니다.
저와 같은 페이지 표시 속도를 목표로 한다면, 복사해서 그대로 설치해 주세요.
하지만 웹사이트 설정에 따라 문제가 발생할 수 있습니다. 책임은 본인 몫입니다. 만일을 대비해 백업을 준비하세요. 백업은 설정에 설명되어 있습니다.
여기서는 이미지를 더 압축하고 사이트 표시 속도를 높이기 위한 단계와 흐름을 적겠습니다. 각 부분을 구체적인 포인트로 설명하겠습니다.
이 글을 끝까지 읽으셨고 "여기서 무슨 뜻인가요?"라는 질문이 있다면, 블로그 하단 댓글란에 자유롭게 남겨 주세요. 대답해.
이제 구체적인 절차와 단계에 대해 살펴보겠습니다.
ShortPixel을 통한 초강력 이미지 압축 단계
가장 먼저 해야 할 일은 WordPress 대시보드에서 ShortPixel을 설치하는 것입니다.
설치 후에도 활성화해 주세요.
다음으로, ShortPixel을 활성화하는 데 필요한 API 키를 받으세요. 무료이고 쉽게 구할 수 있으니 빨리 받으세요.
ShortPixel API 키를 얻는 방법
첫째이 공식 페이지접근성.
"무료 가입"이라고 적힌 빨간 버튼을 클릭하세요.
이메일 주소를 입력하세요. 그 후 아래 확인란을 확인하고 "가입"이라는 버튼을 클릭하세요.
네. 그거에요. ShortPixel API 키를 보실 겁니다.
여기서 실수로 페이지를 닫아도 괜찮아요. 이전에 입력한 이메일 주소의 API 키를 받았습니다. 꼭 확인해 보세요.
여기서 얻은 API 키는 ShortPixel 구성에 사용됩니다. API 키를 복사하세요.
ShortPixel에 API 키를 입력하세요
워드프레스 관리자에서 ShortPixel 설정→ 들어가면 API 키를 입력할 수 있는 페이지가 나옵니다.
"이미 API 키가 있다면"이라는 항목이 있습니다. 방금 얻은 API 키를 입력하세요. 이렇게 하면 ShortPixel API 키의 인증이 완료됩니다.
API 키를 검증하면 ShortPixel을 사용해 한 달에 100장의 이미지를 압축할 수 있습니다.
이제 주요 배경을 말씀드리겠습니다.
워드프레스 웹사이트의 표시 속도를 극적으로 향상시키려면 속도 중심 설정을 설정해야 합니다. ShrotPixel에서 이미지 압축을 설정하는 방법을 알려드려서 최대한 빠른 속도를 낼 수 있습니다.
"ShortPixel"을 설정하여 디스플레이 속도를 가속화하는 방법
이 설정은 디스플레이 속도를 향상시키는 데 중요합니다. 각 항목을 설명하겠습니다. 먼저, 설정을 업로드하겠습니다.
- 압박 유형:비가역적 (손실)
- 썸네일은 다음과 같습니다:확인해 주세요
- 이미지 백업:확인해 주세요
- EXIF 제거:확인해 주세요
- 대형 이미지 변경:너비 1,200× 높이 675
부록을 만들겠습니다. 꼭 읽어보세요.
첫째, 압축 유형은 이미지를 가장 많이 압축할 수 있는 "손실 압축(Lossy)"을 지정합니다. 매우 압축되어 있지만, 육안으로 볼 수 있는 화질 차이는 크지 않습니다.
썸네일도 확인해 보세요. 자주 표시되기 때문에 썸네일도 압축하는 것이 권장됩니다.
이미지 백업은 선호사항입니다. 하지만 이미지 압축 때문에 보험 차원에서 백업을 해두었고, 다시 시도할 경우를 대비했습니다.
그리고 아이템을 입력해서 큰 크기 이미지를 변경하기도 합니다. 이 부분에서 배경이 문제가 됩니다. 솔직히 블로그를 사용하고 싶다면 위 크기 설정을 사용할 수 있습니다.
*포트폴리오 사이트를 만드는 경우, 이 크기 명칭은 포함하지 말아 주세요.
이 설정은 이미지 품질을 떨어지지 않도록 극한까지 압축하여 디스플레이 속도를 향상시키기 위한 것입니다.
다음으로는 "고급 설정"으로 넘어가세요.
ShortPixel의 "Advanced"로 디스플레이 속도를 향상시키기
"고급" 설정을 커스터마이즈하여 디스플레이 속도를 더 높일 수 있습니다.
일반 탭 옆에 있는 "고급용"을 선택하세요.
- PNG 이미지를 JPEG로 변환하기: 체크 해제
- CMYK에서 RGB 변환: 확인해 보세요
- 차세대 이미지: 모두 확인해 보세요
- 페이지 코드 변경 없이(.htaccess를 통해): 확인
- 고화질 이미지 최적화: 확인
- 기타 썸네일 최적화: 확인
- 최적화 PDF: 확인
- 업로드 시 미디어 최적화: 확인
- 프론트엔드 처리: 확인
여기서도 덧붙이겠습니다. 고급 사용자만 위한 것이기 때문에, 여기서 중요한 것은 개별 사이트에 적용됩니다.
"PNG 이미지를 JPEG로 변환하기"를 체크하지 않았습니다. 그 이유는 PNG 포맷에서 투명성을 잃을 위험을 고려한 결과입니다. 하지만 JPEG는 PNG보다 이미지를 더 밝게 만들 가능성이 더 큽니다. 화질이 약간 떨어지긴 하지만...
하지만 만약 당신의 웹사이트가 주로 이미지로 매력적이지 않다면, 이 항목을 체크할 수 있습니다. 화질은 정상적이고 가능한 한 밝은 상태이며, 합리적으로 볼 수 있는 이미지를 원한다면 확인해 보세요.
"PDF 최적화"를 체크했지만, PDF 파일을 다루지 않는다면 삭제할 수 있습니다. 프론트엔드 프로세싱도 마찬가지로, 필요하지 않으면 제거하세요.
이제 ShortPixel으로 이미지를 압축하기만 하면 됩니다.
결론: 이미지 압축으로 디스플레이 속도를 개선하기
이 글에서는 ShortPixel을 사용해 워드프레스 웹사이트의 표시 속도를 획기적으로 향상시킬 수 있는 방법을 설명했습니다.
웹사이트의 목적에 맞게 "고급 사용자" 설정을 설정해 주세요. *기본 설정만으로도 충분히 빨라집니다. 꼭 백업해 주세요.
ShortPixel으로 무엇을 할 수 있는지 더 알고 싶다면, 제 상세한 리뷰 기사를 참고해 보세요.
또한, 사용에 대해 궁금한 점이 있으시면 이 글 아래 댓글란에 자유롭게 남겨 주세요. 저희는 평균 12시간 이내에 답변을 드립니다.
나중에 봐요.
최신 댓글