워드프레스 이미지최적화 플러그인 Smush

워드프레스 뿐만 아닌 모든 홈페이지 + 블로그 작업을 함에 있어서는 다양한 최적화 작업이 필요합니다.

가독성이 편리한 폰트 “^글꼴“의 경우 구글폰트를 비활성화 하거나 필요없는 폰트는 삭제해서 홈페이지 로딩속도를 개선할 수 있으며 이미지의 경우 해상도를 사용용도에 맞게 끔 리사이징을 하여 보는이로 하여금 프레임에 맞추어 이미지 깨짐은 최소화하고 용량은 작게 압축해서 최상의 컨디션을 조절해야 하는것은 보기 좋게 하는 시각적인 요소를 넘어선 트래픽 감소에 대한 홈페이지 속도에도 중요한 요인이 됩니다.

그래서 기본적으로 이러한 시각적인 요소를 넘어서 홈페이지의 접속 트레픽이 이미지로 하여금 느려진다면 인터넷검색최적화에도 좋지 않은 점수를 줄 뿐만 아니라 사람들이 홈페이지의 내용이 뜨기도 전에 접속을 종료하는 일이 발생합니다.

워드프레스 이미지최적화 Smush 플러그인

그리고 기본적으로 구글의 애드센스 광고를 사용한다면 이러한 모든 글이 표시 된 뒤 광고가 뜨게 되어 있기 때문에 ^{이미지의 최적화 작업은 필수}라고 할 수 있습니다.

그래서 이미지최적화를 위해서는 사진을 업로드하기전에 최적화툴을 이용해서 올리느것이 좋지만 일일이 사진을 올리기전에 최적화 한다느것도 번거러울 뿐더러 이미 올라간 이미지에 대해서도 다시 업로드해야 하는 불편함이 있기 때문에 이번에는 워드프레스를 이용한 이미지를 최적화 할 수 있는 플러그인으로 Smush를 소개해보고자 합니다.

이미지 최적화 전 워드프레스 페이지 속도

우선 이미지를 최적화 하기 전 제 홈페이지의 속도를 구글 페이지 스피드를 통해 확인해보니 53/100점으로 최적화 낮음이 되어있습니다.

이에 대해서 개선할수 있는 최적화 권장사항이 순서대로 표시됩니다.

이미지 최적화 권장사항

• 이미지 최적화
• 스크롤 없이 볼 수있는 콘텐츠에 렌더링 차단 자바스크립트 및 CSS 삭제
• 표시되는 콘텐츠의 우선 순위 지정
• 브라우저 캐싱 활용
• 자바 스크립트 축소
• CSS 축소

위에서 보여주는 이미지최적화 요구외에 최적화는 아래 플러그인으로 성능을 업그레이드 할 수 있습니다.

• Hummingbird 플러그인 Gzip CSS 압축 워드프레스 최적화
• 워드프레스 최적화 WP-Optimize 원클릭 플러그인
• 워드프레스 최적화 WP Rocket 플러그인 구입 설치

현재 실행중인 최적화로는 html 및 방문페이지 리디렉션등이 사용되고 있지만 그래도 현저히 떨어지는 페이지속도 임을 알 수 있습니다.

그리고 제일 큰 개선 효과를 볼수 잇는 이미지최적화 기능을 통해 이미지의 형식을 압축하게 되면 기본적으로 80%의 속도개선을 보인다고 하느데 이 정도의 수치는 거의 대부분의 개선이라고도 볼 수 있습니다.

워드프레스 이미지최적화 플러그인 Smush

워드프레스에서 ^{이미지는 홈페이지 속도를 저하시키는 큰 요소}입니다.

이를 플러그인을 이용해 최적화 압축을 진행할 수 있으며 기본적으로 워드프레스 뿐만 아니라 홈페이지에 이미지를 업로드할때는 기본적인 이해가 필요합니다.

이미지 최적화 워드프레스 사진 업로드 주의사항

워드프레스 플러그인에 Smush 라고 검색하여 설치 후 활성화를 합니다.

이미지 압축 및 최적화 옵션

플러그인을 실행 후 벌크 스매쉬에 이미지 압축을 하게 되면 현재로서 52.4%를 할 수 있다고 합니다.

벌크스매쉬는 이미지 갯수에 따라 시간이 오래 걸리수 있지만 이미지가 많은 사이트라면 필수 플러그인이라고 할 수 있습니다.

그 외에도 자동 Smush 를 체크하여 이미지를 사이트에 업로드 시 자동 최적화 기능을 활성화하면 앞으로 ^{이미지를 업로드 할때 자동으로 최적화}가 진행됩니다.

1. 그 외에도 추가적으로 Super Smush – 다중 패스 손실 압축으로 2배이상의 최적화 및 이미지 내에 있는 메타 데이터 제거를 체크합니다.
2. 이미지에 촬영한 위치나 시간 날짜등의 정보도 필요없다면 메타 데이터 제거를 통해 더욱 용량을 최소화할 수 있습니다.
3. 이미지를 크게 해서 업로드한게 있다면 최대 너비 사이즈를 조정해서 로드 시간을 줄일 수 있습니다.

1. 마지막으로 PNG 파일은 이미지에 투명도가 있어 용량이 JPG보다 매우 큰 장 단점이 있습니다.
2. 투명도가 필요없는 홈페이지라면 PNG 파일을 JPEG로 바꿔주는 것도 큰 도움이 됩니다.

1. 이 후 다시 홈페이지 속도를 체크해보았습니다.
2. 기존에 빨간불이였던 데스크톱의 페이지 속도가 녹색으로 뜨고
3. 모바일 버전으로 최적화 중간까지 올라간것을 볼 수 있습니다.

이렇게 홈페이지 속도가 너무 느린 분들은 간단하게 이미지 최적화만으로도 간단하게 어느정도 해결할 수 있습니다.

참고 : 워드프레스 이미지 압축 Webp 변환 – Imagify

워드프레스 이미지 엑박 갑자기 안 뜰때 해결방법