이미지 스티커와 SEO: 대체 텍스트, 파일 크기, 이미지 검색
글쓰기 화면에 작은 캐릭터 스티커 하나를 붙였다. 표정은 귀엽고 글은 한결 부드러워졌지만, 곧 이런 생각이 따라온다.
“이 이미지에도 대체 텍스트를 넣어야 할까? 파일 크기는 얼마나 줄여야 할까?”
워드프레스의 이미지 스티커는 단순한 장식처럼 보인다. 그러나 실제로는 접근성, 검색엔진의 이해, 페이지가 열리는 속도에 함께 영향을 주는 이미지 자산이다.
귀여움만 보면 놓치는 것이 있다.
스티커는 그림이면서 웹페이지의 정보다
워드프레스 이미지 블록에서는 미디어 라이브러리에서 제목, 캡션, 대체 텍스트, 설명, 파일 크기, 이미지 크기를 관리할 수 있다. 같은 스티커라도 이 칸을 어떻게 채우느냐에 따라 역할이 달라진다.
글의 내용을 설명하는 화면 그림이라면 정보가 있는 이미지다. 반면 문단 사이에 놓인 웃는 캐릭터처럼 분위기만 꾸민다면 장식용 이미지에 가깝다.
이 구분이 중요한 까닭은 모든 이미지에 설명을 길게 쓰는 것이 정답이 아니기 때문이다.
먼저 역할부터 가른다.
사람들이 스티커 설정을 신경 쓰는 이유
스티커를 여러 개 넣은 글은 보기에는 풍성하다. 하지만 이미지가 많아지면 페이지가 열릴 때 화면에 보이는 큰 이미지가 늦게 나타날 수 있다.
web.dev에 따르면 화면에서 가장 큰 이미지나 글 블록이 나타나는 시점을 재는 지표가 있다. 이 지표에서 방문자의 75%가 2.5초 안에 큰 요소를 보면 좋은 상태로 본다.
속도 문제는 장식 이미지에서도 생긴다.
의외로 이미지는 이미지 검색에서만 쓰이지 않는다. Google은 일반 검색 결과의 글 목록에도 페이지와 관련 있는 이미지를 함께 보여 줄 수 있다고 설명한다.
그때 검색엔진은 그림만 보지 않는다. 이미지의 대체 텍스트, 본문, 캡션, 제목, 이미지 주변의 글, 이미지 자체를 함께 살핀다.
답은 정보형만 설명하고 모두 가볍게 하는 것이다
모든 스티커에 검색어를 넣는 것이 정답은 아니다. 정보를 전달하는 스티커에는 짧고 구체적인 대체 텍스트를 쓰고, 장식용 스티커의 대체 텍스트는 비워 두면 된다.
파일 크기 줄이기는 이미지 검색 순위를 올리는 비법이라기보다 사용자가 페이지를 빨리 보는 환경을 만드는 일로 이해해야 한다.
핵심은 검색어가 아니다.
정보형 스티커의 대체 텍스트는 “워드프레스 글 작성 화면에서 이미지 블록을 추가하는 과정”처럼 쓸 수 있다. 그림을 보지 못해도 글의 흐름을 이해할 수 있는 설명이면 충분하다.
반대로 본문에서 이미 같은 장면을 설명했다면 스티커에 같은 말을 한 번 더 넣지 않는다. 중복 설명은 정보를 늘리기보다 읽는 흐름을 끊을 수 있다.
대체 텍스트와 파일명은 검색어를 넣는 칸이 아니다
대체 텍스트는 검색엔진을 향해 키워드를 외치는 문장이 아니다. 이미지가 보이지 않아도 문서의 의미가 이어지도록 돕는 설명이다.
Google은 대체 텍스트를 이미지 주제를 파악하는 중요한 정보로 보지만, 같은 단어를 반복해서 넣는 방식은 좋지 않은 사용자 경험과 스팸으로 이어질 수 있다고 안내한다.
파일명도 비슷하다. IMG00023.JPG처럼 의미 없는 이름보다 짧고 설명적인 이름이 낫다. 워드프레스 이미지 블록을 보여 주는 그림이라면 그 내용을 드러내는 파일명을 쓸 수 있다.
이름을 바꿔도 노출은 약속되지 않는다.
다만 파일명과 대체 텍스트를 정리했다고 해서 반드시 검색 결과에 나타나는 것은 아니다. Google은 이미지를 읽고 색인할 수 있어도 노출을 보장하지 않는다.
직접 손볼 때 가장 자주 막히는 지점
실제로 막히는 곳은 스티커를 올리는 순간보다 분류하는 순간이다. 이 그림이 정보를 전달하는지, 단순히 빈 공간을 꾸미는지 판단하기가 생각보다 어렵다.
장식용 캐릭터에 억지로 “귀여운 캐릭터 스티커, 워드프레스 SEO 이미지”처럼 단어를 붙이면 글을 읽는 사람에게 아무 도움도 되지 않는다. 반대로 설명이 필요한 화면 이미지를 장식용으로 처리하면 접근성과 검색 이해에 필요한 기회를 놓칠 수 있다.
잘못된 분류가 가장 큰 실수다.
파일 크기도 한 번에 해결하기 어렵다. 미디어 라이브러리에는 파일 크기와 이미지 크기가 보이지만, 실제 화면에서 어떤 이미지가 크게 나타나는지 글 전체를 다시 확인해야 한다.
이 작업을 수작업으로 반복하면 같은 스티커의 이름과 설명이 달라지기 쉽다. 이미지가 많은 글에서는 어디부터 줄여야 할지 판단하는 데도 시간이 든다.
이미지의 대체 텍스트와 파일 크기를 정하는 일은 DecoBlocks가 대신하는 영역이 아니다. 그 판단은 미디어 설정에서 직접 해야 한다.
다만 스티커를 넣은 글에서 안내 문장과 장식 구역을 나누는 일은 Section Box (Solid)와 Divider Line – Solid로 정리할 수 있다. 이 기능들은 블록 편집기와 클래식 편집기에서 사용할 수 있다.
도구가 있어도 판단까지 대신하지는 못한다.
그래서 직접 관리할 때는 모든 이미지를 똑같이 고치려 하지 말고, 먼저 화면 첫 부분에 크게 보이는 이미지부터 살펴야 한다.
스티커의 역할에 따라 이렇게 설정하자
이제 기준은 세 가지 질문으로 좁힐 수 있다.
- 글의 정보를 보충하는가?
- 본문에 없는 내용을 보여 주는가?
- 화면에서 크게 보여 로딩에 영향을 줄 수 있는가?
정보를 전달하는 스티커라면 짧고 구체적인 대체 텍스트를 쓴다. 파일명과 캡션도 이미지의 실제 내용을 드러내도록 정리한다.
분위기만 꾸미는 캐릭터 스티커라면 대체 텍스트를 비운다. 워드프레스 이미지 블록의 대체 텍스트 칸을 빈 상태로 두어 보조기술이 불필요한 설명을 읽지 않게 하는 방식이다.
큰 대표 이미지나 화면 첫 부분의 스티커는 표시 크기에 맞는 크기로 준비한다. WebP나 AVIF 같은 형식, 적절한 해상도, 화면 크기에 맞는 이미지 제공을 우선 살핀다.
이미지 검색 유입을 기대한다면 스티커 자체에 키워드를 잔뜩 넣기보다 관련 본문과 어울리는 파일명, 대체 텍스트, 캡션부터 정리한다.
결국 워드프레스 스티커의 기준은 “많이 설명하기”가 아니다. 정보형은 정확히 설명하고, 장식형은 조용히 비우며, 크게 보이는 이미지는 가볍게 제공하는 것이다.
역할에 맞게 하나씩 고르면 된다.
DecoBlocks로 스티커와 글의 흐름 나누기
스티커를 실제로 넣어야 하는 글이라면 DecoBlocks의 Insert Character Sticker로 설치한 스티커 팩의 캐릭터 스티커를 글에 배치할 수 있다. 이 기능은 스티커의 대체 텍스트나 파일 크기를 정하는 기능이 아니므로, 정보형과 장식형의 구분 및 미디어 설정은 앞서 말한 기준대로 별도로 확인해야 한다.
스티커가 들어간 글에서 안내나 보조 설명을 본문과 섞지 않으려면 Section Box (Solid)로 관련 내용을 묶고 Divider Line – Solid로 구역을 나눌 수 있다. 긴 글의 이동 경로가 필요하다면 Auto Table of Contents가 게시 후 제목을 바탕으로 목차를 만든다. 블록 편집기와 클래식 편집기에서 글의 표현 방식에 맞는 장식 기능을 선택할 수 있다.
자주 묻는 질문
Q. 내 사이트에서는 무엇부터 고치면 좋을까요?
A. 글의 첫 화면에 크게 보이는 이미지부터 확인하세요. 정보형이면 설명을 쓰고, 장식형이면 대체 텍스트를 비운 뒤, 표시 크기에 맞게 파일 크기를 줄이면 됩니다.
Q. 이 문제를 도구로 쉽게 해결할 수 있나요? 어떤 도구를 쓰면 되나요?
A. 이미지 편집이나 최적화 도구를 활용할 수 있지만, 먼저 정보형과 장식형을 사람이 구분해야 합니다. 도구는 파일 크기와 형식을 다듬는 데 쓰고, 대체 텍스트는 이미지가 전달하는 실제 의미에 맞춰 직접 확인하는 편이 좋습니다.
Q. 장식용 캐릭터 스티커에도 대체 텍스트를 넣어야 하나요?
A. 정보나 기능을 전달하지 않는 장식용 이미지라면 대체 텍스트를 비워 두는 것이 좋습니다. 본문과 같은 설명을 반복해서 넣을 필요도 없습니다.
Q. 장식 기능이 대체 텍스트와 파일 크기도 정리해 주나요?
A. 대체 텍스트와 파일 크기는 장식 기능과 별도로 워드프레스 미디어 설정에서 확인해야 합니다.
DecoBlocks는 글에 캐릭터 스티커를 넣고, Section Box (Solid)와 Divider Line – Solid로 관련 내용과 구역을 표현하는 플러그인입니다. 따라서 장식 배치와 이미지 접근성·용량 점검을 나누어 진행하는 것이 맞습니다.
워드프레스 관련 플러그인
