웹사이트 검색

WordPress 이미지 SEO 실수 및 해결 방법

  1. <스팬>1. WordPress 이미지 관리에 대한 최종 가이드
  2. <스팬>2. WordPress의 덜 알려진 이미지 관리 팁 3가지
  3. 3. 현재 읽고 있는 내용: WordPress 이미지 SEO 실수 및 해결 방법

적절한 이미지 SEO 전략을 구현하지 않으면 지난 두 기사에서 배운 모든 내용이 물거품이 될 것입니다. 이미지 SEO는 전반적인 SEO 전략에서 중요한 역할을 하며 튜토리얼을 공유하는 사이트에 매우 중요합니다. 이미지 이름이 잘못 지정되지 않았거나 'alt' 태그가 없거나 더 나쁜 경우, 다른 서버에서 호스팅되지 않은 경우 손실될 모든 트래픽을 생각해 보십시오.

WordPress 이미지 SEO 실수

이미지 SEO와 관련하여 가장 많이 저지르는 실수를 살펴보고 적절한 대책을 권장해 드립니다.

관련 이미지를 사용하고 있지 않습니다.

Ronald와 회사를 만나보세요

당신과 당신의 친구들이 다가오는 여행을 위해 어떤 교통 수단을 이용할지 진지하게 논의하고 있는 모습을 상상해보세요. 주간 버스와 비행기 모두 좋은 옵션처럼 보이지만 예산 대 시간 논쟁에 갇히게 됩니다. Ronald와 Jeremy가 이끄는 두 팀이 있습니다. Ronald는 금요일 회의 일정을 다시 조정할 필요가 없도록 비행기를 타고 싶어합니다. 반면에 어머니 지구를 숭배하는 Jeremy는 주간 버스 여행에서 앞으로 펼쳐질 아름다운 경치를 즐기기 위해 회의 일정을 바꾸는 것을 꺼리지 않습니다. 물론, 여행 그룹의 모든 구성원은 편을 선택합니다. 10시간의 긴 버스 여행을 원하지 않는 사람들은 Ronald와 함께 싸우고 있습니다. 대자연의 아름다움을 감상하고 싶은 다른 팀은 버스를 타는 것이 꼭 필요하다고 생각합니다.

양측은 상대방이 자신의 편을 들도록 설득하기 위해 최선을 다하고 있습니다. 인생에서 가장 중요한 토론 중 하나로 보이는 토론 중에 Ron은 다음과 같은 말을 하는 실수를 저질렀습니다.

RON: 안녕하세요 여러분, 저는 두 가지 교통수단 모두 괜찮습니다. 주말에는 누가 내 고양이를 돌봐야 할까요?
JEREMY: 뭐? 에밀리네 집에 놔둬도 돼요! 잠깐, 우리가 왜 이 문제에 대해 논의하고 있는 걸까요?
JEREMY 팀의 남자: 네, 지금 우리가 중요한 대화를 나누고 있는 것 같지 않나요?
롤랜드 팀의 남자: 자, 어서!
ROLAND: 도대체 론! 우리가 지금 위기에 처해 있다는 걸 모르시나요?
RON(약간 당황함): 알았어, 알았어. Sarah는 Emily에게 맡길게. 이런.
전체적으로: 젠장, 론! 넌 항상 이렇게 해…

그리고 논쟁이 재개됩니다.

이제 론이 되고 싶지 않죠? 관련성도 마찬가지입니다. 이미지는 천 단어의 가치가 있습니다. 하지만 조심하지 않으면 다른 생각으로 인해 그 사람의 주의를 잃을 수도 있습니다.

아마 지금쯤 뉴욕을 생각하고 계실 텐데요.

게시물에 이미지를 추가하는 첫 번째 규칙 중 하나는 아이디어를 전달하는 방식을 향상시키는 것입니다. 이미지는 가치를 전달하도록 설계되었습니다.

그렇기 때문에 WPExplorer의 튜토리얼은 스크린샷으로 가득 차 있고 테마 목록은 각 테마의 최고의 비트/데모를 표시하는 데 중점을 둡니다.

이 값은 (a) 본질적으로 정보를 제공하거나, (b) 시각적 또는 정서적 영향을 전달하거나, (c) 이 두 가지가 혼합된 것일 수 있습니다. 최고의 이미지는 대부분 세 가지의 조합입니다.

Github의 랜딩 페이지 예 – 업무용 책상에 앉아 있는 개발자의 그림

즉, 이미지를 추가하기 위해 이미지를 사용하는 것은 의미가 없습니다. 그러한 행동은 종종 비생산적입니다. 반면에 올바른 이미지는 전환에 여러 가지 이점을 제공할 수 있습니다.

위 스크린샷은 Github의 많은 랜딩 페이지 중 하나입니다. 이미지를 살펴보겠습니다. 먼저, 이 이미지는 실제로 벡터 일러스트레이션이라는 것을 알 수 있습니다. 이 그림은 모든 인종/민족 장벽을 극복합니다. 또한 페이지의 전체적인 색상 구성과 조화를 이루는 파란색은 잠재의식적인 프로파일링을 무효화합니다. 놀라운 카피와 CTA가 결합되어 이미지를 올바르게 사용하여 훌륭한 랜딩 페이지를 만드는 훌륭한 예입니다.

이미지 파일 이름에 집중하지 않고 있습니다

알겠습니다. 양질의 튜토리얼을 만드는 것은 힘든 일입니다. 각 단계는 명확하게 문서화되어야 하지만 독자가 자신의 지능에 대한 모욕으로 받아들일 정도로 설명적이지 않아야 합니다.

1800 단어로 된 튜토리얼을 작성하고 12개가 넘는 스크린샷을 다루었다면 설득력을 얻어 스크린샷-1, 스크린샷-17 등과 같은 이름을 사용하는 것은 매우 쉽습니다.

그러나 실제로 이는 SEO에 절대적으로 해를 끼칩니다.

WordPress 영구링크 설정

생각해 보십시오. 누군가가 위에 표시된 이미지와 원격으로 관련된 것을 검색하는 경우 'screenshot-1' 또는 'image-1'을 사용할 것입니까, 아니면 "permalinks를 끄는 방법"을 검색할 가능성이 더 높습니까? 워드프레스 ”

관련 메모에서 이미지 SEO에 100%를 적용하려면 이미지에도 TITLE 속성을 추가하세요. 이 TITLE 태그의 값은 이미지의 파일 이름이 될 수 있습니다.

ALT 태그를 정의하고 있지 않습니다.

ALT 태그는 이미지의 대체 텍스트를 나타냅니다. 크기, 우선순위 등에 상관없이 모든 이미지에 사용해야 합니다. 간단히 말해 ALT 태그는 이미지에 대한 설명입니다. 당신의 이미지는 문자 그대로 무엇을 나타냅니까?

ALT 태그는 검색 엔진에서 이미지를 크롤링하는 데 사용됩니다. 이미지를 렌더링할 수 없는 경우 이미지의 ALT 태그가 대신 사용됩니다. ALT 태그는 시력을 잃은 사람들을 위한 화면 판독기에서도 사용됩니다.

예를 들어 이전 스크린샷의 ALT 태그나 설명 텍스트는 다음과 같을 수 있습니다.

Screenshot of the WordPress dashboard showing the permalinks settings, with the default option checked.

상세한 ALT 태그를 작성하는 것은 정말 번거로운 일이지만 그 노력은 보상을 받습니다. 안타깝게도 ALT 태그 최적화로 인한 유기적 트래픽 증가를 보여주는 최근 연구를 찾을 수 없습니다. 대부분은 포럼의 댓글입니다. 그러한 연구를 접하게 된다면, 우리와 공유해 주세요!

TITLE 및 ALT 태그를 키워드로 채우고 있습니다.

키워드 스터핑은 기본적으로 최종 SEO 주스를 얻기 위해 모든 인기 키워드를 추가하는 것과 같습니다. 그러나 실제로는 기름칠이 잘 된 자동차를 만들 때 품질이 좋지 않은 기름을 사용하는 것과 같습니다. Google은 나날이 더 똑똑해지고 있습니다. 즉, 사용자가 언제 문제를 일으키려고 하는지 알 수 있다는 뜻입니다. 결과? 귀하의 SEO 점수가 불이익을 받았습니다.

키워드가 포함된 ALT 태그의 일반적인 예는 다음과 같습니다.

Screenshot of the WordPress dashboard showing the permalinks settings, with the default option checked BEST FREE AND PREMIUM WORDPRESS THEMES WPEXPLORER

나의 충고? 지름길을 택하지 마십시오. ALT 태그를 정의하기 위해 열심히 노력하셨습니다. 노력의 결실이 따를 것입니다.

이미지 캡션을 사용하고 있지 않습니다

ALT 및 TITLE 태그의 문제는 독자/방문자에게 실제로 표시되지 않는다는 것입니다. 검색 엔진은 이를 좋아하지만 기사를 읽는 사람으로서 저는 대체 텍스트를 보기 위해 이미지 위로 마우스를 가져가거나 파일 이름을 보기 위해 새 탭에서 이미지를 열지는 않습니다. (물론, 이미지를 저장하는 경우 멋지고 설명이 포함된 파일 이름이 확실히 마음에 들 것입니다!)

우리는 ALT 및 TITILE 태그가 SEO에 아무리 중요하더라도 방문자의 독서 경험에 실제로 중요한 역할을 하지 않는다는 것을 확인했습니다.

여기서 캡션이 필요합니다. Kissmetrics 연구에 따르면 이미지 캡션이 실제 본문 문구보다 300% 더 많이 읽히는 것으로 나타났습니다. 생각보다 눈이 많이 가는군요.

반응형 디자인. 이미지 캡션 예시입니다!

캡션이 눈길을 끌면 독자가 당신이 말하는 내용을 계속해서 읽을 가능성이 높습니다. 이렇게 생각해 보세요.

  • TITLE 태그는 이미지 파일의 간결한 파일 이름입니다.
  • ALT 태그는 이미지 내용을 설명하는 태그입니다.
  • 캡션은 독자를 위한 것입니다. 방문자의 독서 경험을 향상시키기 위해 설계된 TITLE 및 ALT 태그가 혼합되어 있습니다.

이미지 사이트맵을 제출하지 않았습니다.

웹사이트는 기본적으로 상호 연결된 HTML 페이지 모음입니다. 사이트맵은 웹사이트의 모든 페이지가 어떻게 구성되어 있는지에 대한 정보가 포함된 문서입니다. 여기에는 일반적으로 웹사이트 이미지에 대한 정보가 포함되어 있지 않습니다.

여기가 이미지 사이트맵이 필요한 곳입니다. Udinra 모든 이미지 사이트맵은 작업에 완벽한 플러그인입니다. 플러그인은 NextGen Gallery 및 Envira Gallery와 같은 이미지 슬라이더 플러그인을 지원합니다. WooCommerce, Easy Digital Downloads와 같은 전자상거래 플러그인과 Visual Composer, Site Origin 등과 같은 페이지 빌더 플러그인이 있습니다.

이미지 성능 최적화

사이트의 전반적인 성능은 SEO에서 중요한 요소입니다. 성능 최적화에 있어 완벽한 것은 없습니다. 항상 개선의 여지가 있습니다. Google이 로고를 14,000바이트에서 305바이트로 줄였지만 계속 발전하고 있는 최근 사례를 살펴보겠습니다.

다음은 이전 게시물에서 공유한 몇 가지 이미지 최적화 팁입니다.

이미지를 최적화하고 있지 않습니다

  • 이미지를 최적화하는 가장 좋은 방법 중 하나는 TinyPNG와 같은 도구를 사용하여 파일 크기를 줄이고 최적화하는 것입니다.
  • 또한 모든 이미지의 최대 크기를 정의하고 최대 크기보다 큰 모든 이미지의 크기를 조정해야 합니다.
  • 하지만 위의 작업을 시작하기 전에 이미지 저장을 위한 올바른 형식을 배워야 합니다.

나는 당신이 이미 이것을 가지고 있다고 가정합니다. 그렇지 않다면 첫 번째 게시물을 읽어보세요. 이것이 우리가 이야기하는 전부입니다!

반응형 이미지를 사용하고 있지 않습니다

우리는 모두 반응형 웹사이트를 사용합니다. 요즘 시대에는 모바일 친화적인 웹사이트를 갖는 것이 절대적으로 중요합니다. 그렇지 않으면 SEO 점수는 말할 것도 없고 잠재적으로 고객을 잃을 수도 있습니다. (예, 귀하의 웹사이트가 모바일 친화적이지 않은 경우 Google은 실제로 귀하에게 불이익을 줄 것입니다.)

이제 반응형 이미지에 대해 살펴보겠습니다. WordPress 4.4에서는 반응형 이미지 속성이 기본적으로 활성화되어 있습니다. 이미지를 업로드하면 WordPress에서는 다양한 화면 크기에 맞는 여러 버전을 생성합니다.

반응형 이미지에 대한 새로운 지원을 통해 WordPress에서는 사용 가능한 모든 이미지 크기를 srcset 속성에 포함합니다. 이를 통해 웹 브라우저는 옵션 중에서 선택하고 장치의 화면 크기에 따라 가장 적절한 이미지 크기를 다운로드할 수 있습니다. 브라우저는 다른 것을 무시합니다. 잠재적으로 대역폭을 절약하고 프로세스에서 페이지 로드 시간을 단축할 수 있습니다.

어떤 이유로 WordPress 4.4로 업데이트하지 않은 경우 RICG Responsive Images 플러그인을 사용하여 동일한 기능 세트를 얻을 수 있습니다. 최신 버전의 WordPress를 사용하는 경우에는 실제로 이 플러그인이 필요하지 않습니다.

무료 CDN을 사용하고 있지 않습니다

성능을 향상시키는 두 번째 방법은 인기가 높은 Jetpack 모듈의 Photon과 같은 무료 CDN을 사용하는 것입니다. 우리는 여러 가지 이유로 Jetpack을 좋아하며 Photon은 그 중 하나일 뿐입니다. Photon이 무엇인지 궁금하시다면 WordPress의 무료 이미지 CDN 서비스입니다. Jetpack의 Photon 모듈은 사이트의 모든 이미지를 가져와 WordPress.com의 글로벌 콘텐츠 배포 네트워크에 저장합니다. 이미지는 서버에서 오프로드되고 더 빠르게 로드되며 대역폭 비용이 절약됩니다. 또 무엇을 원할 수 있습니까?

당신은 게으른 이미지 로딩이 아닙니다

냄새나는 고양이, 게으른 고양이, 그들은 당신에게 무엇을 먹일까요?

지연 로딩을 활성화하면 이미지가 뷰포트에 나타날 때 로드됩니다. 예를 들어, WordPress를 위한 최고의 팟캐스팅 솔루션에 관한 2000단어 기사를 읽고 있다고 가정해 보겠습니다. 기사가 끝날 때까지 모든 이미지를 볼 필요는 없습니다. 지연 로딩을 활성화하면 로딩 시간이 크게 줄어들고 귀하와 방문자의 대역폭이 모두 절약됩니다.

BJ Lazy Load 플러그인이 답입니다. 50,000개 이상의 활성 설치가 있으므로 잘못될 일이 없습니다. 플러그인을 다운로드하고 활성화하면 한 번의 클릭으로 마법이 시작됩니다.

그러나 반대로 이미지를 지연 로딩하는 경우에는 몇 가지 잠재적인 함정이 있습니다. 주의하지 않으면 SEO 점수가 하락할 위험이 있습니다. 권장 플러그인을 사용하면 정렬되므로 안심하세요. 또한 다른 지연 로그인 플러그인을 사용하는 경우 웹사이트용 Fetch as Google을 사용하여 검색 엔진에서 모든 콘텐츠를 제대로 크롤링할 수 있는지 확인하세요.

이미지 사용에 대한 몇 가지 팁

다음 팁은 실수로 간주되어서는 안 되며 콘텐츠 품질을 향상시킬 수 있는 일반적인 지침에 가깝습니다.

일반 스톡 사진을 피하세요

이 이미지를 볼 때 가장 먼저 떠오르는 것은 무엇입니까?

문의하기 페이지에서 고객 지원 담당자가 미소를 짓고 있는 이미지보다 더 기분 나쁜 것은 없습니다. 또는 회사 소개 또는 더 나쁜 경우 가입 페이지에 모델의 뻔한 스톡 사진이 있습니다. 모든 사람은 그것에 너무 익숙해서 거의 즉각적으로 알아볼 수 있습니다. 잠재 고객이나 고객이 귀하에게 연락하기를 원하는 경우(훌륭한 지원 팀 사진을 가지고 있거나 간단하게) 유용한 문의 양식을 만드십시오. 그러나 (하나님의 사랑을 위해) 회사 소개, 가입 또는 문의 페이지에 스톡 이미지를 사용하지 마십시오. 오늘날, 그들은 확실히 득보다 실이 더 많을 것입니다.

가능하다면 GIF를 사용하세요

4chan부터 9GAG, 모든 주요 소셜 네트워크(예, Facebook과 Twitter를 바로 보고 있습니다)에 이르기까지 GIF의 인기가 높아지고 이를 지원하는 키보드도 있습니다. GIF가 여기에 남아 있다는 사실을 부인할 수 없습니다. 게시물에 GIF 사용을 고려하고 있다면(그리고 그 사실에 만족하셨다면) GIPHY는 좋은 GIF 이미지를 찾을 수 있는 좋은 장소입니다!

라이선스를 신중하게 사용하세요 – #CC0

사람들은 결코 너무 조심할 수 없다고 말합니다. 아니요, 저는 여러분에게 종말 이후의 벙커 건설을 시작하라고 요청하는 것이 아닙니다. 그러나 이미지 라이선스의 경우 무료로 다운로드하여 사용할 수 있는 CC0 이미지를 선택하는 것이 가장 좋습니다. 충분한 마케팅 예산이 있다면 Shutterstock 구독을 구매하고 블로그와 뉴스레터에 사용할 멋진 로열티 프리 사진을 다운로드하세요.

결론

이 게시물 시리즈를 마무리하면서 지금까지 배운 내용을 검토해 보겠습니다.

  1. 올바른 이미지 형식을 사용하세요.
  2. 블로그 게시물에 스톡 사진을 업로드하는 방법에 대한 팁
  3. 이미지 최적화 - 크기, 크기, 품질 및 웹용 저장
  4. WordPress 사이트 URL 변경 시 이미지 관리
  5. WordPress에서 외부 이미지 가져오기
  6. WordPress에서 이미지 핫링크 방지
  7. WordPress 이미지 SEO의 일반적인 실수
  8. 지연 로딩 이미지
  9. WordPress의 이미지 사이트맵
  10. WordPress의 반응형 이미지

이 시리즈 게시물에 대해 어떻게 생각하시나요? 중요한 팁이 누락되었나요? 아래 댓글로 알려주세요.