워드프레스에서 avif 이미지를 지원한다는건 avif 이미지를 보여주는데 필요한 이런저런게 준비 되어있다는 것이지, 우리가 이미지 파일을 업로드하면 avif로 바꿔준다는 건 아니다. 그건 플러그인이 한다.
워드프레스에 jpg나 png 파일을 업로드하면 avif 파일로 변환해서 사용할 수 있게 하는 방법을 소개한다. (설치는 우분투 서버 24.04 LTS 기준)
워드프레스가 설치 되어 있는 서버에서 avif 지원하는지 확인
워드프레스 관리 화면 왼쪽 사이드바 메뉴에서 도구->사이트 건강->정보 탭->미디어 처리(클릭해서 펼치기)
imagick가 설치되어 있고 지원 파일 포맷에 avif 가 있으면 된다.
gd에도 지원 파일 포맷에 avif 가 있는데 지금 내 환경에 gd 는 쓸만한게 못 되는데 아마 앞으로 avif 지원이 제대로 될 것이라 여러분 환경에서는 잘 될지도 모르겠다.
GD는 아직 제대로 안되더라.
PHP imagick 모듈 설치
imagick가 표시 되어 있지 않으면 PHP imagick 모듈을 설치 해야한다.
1
sudo apt install php8.3-imagick
설치 후 모듈에 imagick가 있는지 확인하고, 미디어 처리에 avif 파일 지원이 있는지 확인.
1
php-m
모던 이미지 포맷 플러그인 활성화
워드프레스 플러그인으로는 워드프레스 공식으로 만들어진 Performance Lab을 설치한다.
설치하면 여럿 플러그인으로 나뉘어서 활성화 할 수 있는데 [모던 이미지 포맷]을 활성화하면 된다.
그 후 관리화면 왼쪽 메뉴에서 설정->미디어로 들어가면 모던 이미지 포맷 설정이 있는데 여기서 AVIF를 선택하면 된다. php에서 gd 나 imagick 모듈이 avif 포맷을 지원하지 않으면 avif 를 지원하지 않는다는 메시지가 표시 된다.
avif 파일 지원이 안되는 경우에는 webp를 선택할 수도 있는데 imagick 모듈을 설치하지 않고 gd 모듈로 webp를 쓰려고 해도 여러가지 문제가 생긴다. webp 변환이 제대로 안되서 0byte 파일이 나오거나. 내 환경에서는 그랬다…
이제 워드프레스에서 jpg나 png 포맷의 이미지 파일을 업로드 해 보면 avif 파일로 변환 되어 있는걸 볼 수 있다. png 파일이 avif 파일로 변환 되어 있다.
파일 용량은 avif 압축 설정에 따라서 달라서 그림이 복잡한 파일은 그렇게까지 줄지는 않는듯한데 이미지 품질 자체는 괜찮은 것 같아서 계속 써 보려 한다.
화질 용량 비교 참고 – 차세대-이미지-포맷-avif-webp-jpeg-화질-용량-비교
php 8.3을 사용 중에, PHP를 업그레이드하면서 자동으로 8.4 버전이 설치 되어 버렸다.
다른 버전이 설치 되는거야 윈도우였다면 조금 다른 버전이면 덮어쓰기로 설치 될 것이고, 설사 따로 설치가 되었어도 내가 안쓰면 상관이 없는 문제인데 리눅스 시스템에서는 이게 여러가지 문제가 생긴다.
먼저 콘솔에서 php 를 실행하면 새로운 8.4 버전이 실행 된다.
예를 들면 워드프레스에서 imagick 모듈을 설치하고나서, 워드프레스 관리 메뉴에서 도구->사이트 건강으로 들어가서 imagick 모듈이 안보이면 php -m 명령으로 모듈 설치를 확인해야 하는데 php 8.3에 있는 imagick모듈을 설치하고 php -m 명령을 치면 php 8.4의 모듈을 확인하게 되니 설치가 되어있을리가 없다.
웹서버에 연결된 php는 8.3이 되는데, php-fpm은 8.3이 이미 가동 중이었고, 8.4 버전에 fpm은 설치하지 않았으니 웹서버에서 가동하는 php 버전은 8.3이 된다. 8.4 버전에 모듈을 설치하면 웹서버가 작동시키는 php 에서는 모듈이 설치 안되어있으니 작동이 안될 것이다.
모듈 설치시에 아래 두 커맨드처럼 8.3이냐 8.4를 고를때 콘솔에서 작동할건지, 웹서버에서 작동할건지 잘 생각하고 설치해야한다.
1
2
sudo apt install php8.3-imagick
sudo apt install php8.4-imagick
속편하게 그냥 둘다 설치하면 제일 좋다.
워드프레스에서 콘솔에서 wp media generate 명령으로 이미지 썸네일을 작성할 수 있는데, 이 커맨드는 콘솔에서 작동하므로 8.4 버전의 php를 사용하게 된다.
워드프레스 관리화면에서 imagick 모듈이 설치 되어 있다고 해도, 이건 php8.3-fpm에 설치되어있다는 뜻.
여기서 헷갈리기 시작하면 망하니 그냥 둘 다 똑같이 모듈을 설치하는게 낫다.
나는 하나만 쓰고 싶다하는 사람이 있으면
update-alternatives를 검색해 보면 된다. 여러 버전에 프로그램이 설치된 경우에 어떤걸 사용할지 정할 수 있다.
게임 스크린샷을 풀사이즈로 올리니 이미지 파일 용량이 너무 커지는게 신경 쓰였는데, 우분투 서버 버전을 올리고 워드프레스 플러그인 정리를 좀 하다 보니 워드프레스 공식으로 나온 새로운 이미지 포맷 지원 플러그인이 있길래 설치했다.
플러그인에서는 webp, avif 이미지 포맷을 지원하는데 webp 다음에 나온게 avif 포맷이고 지원하는 브라우저는 webp 보다 적다고 하는데 최신 브라우저는 전체적으로 더 좋은건 avif 라 avif 포맷으로 가기로 결정.
플러그인을 설치하고 설정에서 avif 포맷을 선택하고 썸네일 등 이미지 재생성을 하려고 우분투 콘솔에서 wp media regenerate 커맨드를 실행했다.
여기서부터 문제가 발생하는데, 일단 처음엔 php에 있는 gd 모듈이 avif 포맷을 지원하지 않았다.
우분투 서버 24.04 버전에서는 php 8.3을 설치하는데 avif 를 지원한다고 하는 gd 버전이 설치되어 있어도 워드프레스 플러그인에는 avif 지원을 하지 않는다고 표시 된다.
이래저래 알아본 결과 ppa(개인 패키지 저장소)에 있는 gd 모듈을 설치하면 문제 없다는 글을 발견해 리포지토리를 추가.
1
sudo add-apt-repository ppa:ondrej/php
없을 경우
1
sudo apt install software-properties-common
리포지토리 추가 후
1
sudo apt upgrade
업그레이드를 하면 php8.4도 같이 설치되더라.
php 버전이 두개가 설치되면 좀 헷갈림… php -v 해서 지금 작동하는게 어떤 버전인지 확인하도록. php 8.4가 설치되면 기본적으로 이게 우선된다.
워드프레스 관리화면에서 도구->사이트 건강->정보(탭)->미디어 처리 항목->GD 지원 파일 포맷에 AVIF가 추가 되어있을 것이다.
GD 버전은 2.3.3으로 업그레이드 이전과 같은게 함정.
wp media geraerate 커맨드로 다시 avif 파일 생성을 시도해 보면 avif파일이 생성이 되긴하는데 곳곳에 경고가 뜨고, 파일이 제대로 만들어지지 않아 0byte 파일이 생성되거나 하더라.
예를 들면 gd가 팔레트 이미지를 지원하지 않아서 생기는 에러.
Warning: imageavif(): avif doesn’t support palette images
이것저것 찾아보면서 php 에서 gd 외에 이미지 처리를 하는 라이브러리가 imagick 이라고 하나 더 있는데 이걸 쓰면 된다는 이야기가 있어서 설치해 봤다.
