[Solved]”Video outside the viewport” How to Fix Index Error

How to solve the problem of a video outside the viewport not being indexed or served on Google? I think that's why you came to this blog post. One of my clients sent me an email, asking:

I've seen this alert previously, so nothing you did. But, do you know if it's an easy fix? If not, maybe I should just remove the video.
video not indexed issues

Troy

Well, of course, you can delete the video so Google won't send you that annoying message but it also has bad effects on your UX. And it hurts your designer's heart as well. Let's not be so cruel.

What does “Video outside the viewport” mean?

Here is Google's official explanation of "Video outside the viewport",

The video must appear in the viewport when loading the page to be considered for indexing. Move the video so that the entire video is inside the renderable area of the page and seen when the page loads.

Google Console Help

How to Solve the “Video Outside the Viewport” Problem?

The key is making sure Googlebot can both discover and render the video when crawling the page. Moving it above the fold is the safest option, but the other tactics may also help in cases where that isn't ideal.

  • Move the video higher up on the page so it is within the initial viewport when the page loads. This is Google's recommended fix.
  • Use JavaScript to trigger the video to play automatically when the page loads. This may make Googlebot detect and index the video even if it's below the fold.
  • Link to the video page from higher up on your main pages so Googlebot discovers the video more easily.
  • Make sure the video thumbnail image is visible within the initial viewport. Google may still detect the video this way.
  • If the video is in an iframe, make sure the iframe itself is rendered within the initial viewport.
  • Check for any other errors on the page that may be blocking Googlebot from indexing the lower content.
  • Submit the page to Google in Search Console and request re-indexing to prompt Googlebot to crawl the page again.

What Did I Do?

Looking at those solutions led me to a dilemma. I don't want to change the layout of the original page nor do I want to delete that video. It introduces the features of the product and is a highlight of the page.

So what do I do?

Suddenly when I checked the backend to see what I can manipulate, I found that the video on that page is not shareable. The retailer made it private thus it's not visible on the page?!

Would it be possible that Google couldn't get the video thumbnail image and sent me the error message?

So I replaced it with a shareable video and asked Google to validate it. Then I started to wait for the result.

I've heard people say "Time flies," but for me, time seems to inch along at a snail's pace while waiting.

Just so you know, I submitted for validation on 7/18/23 and it's 8/15/23. I finally got this message this morning:

[Solved]"Video outside the viewport" How to Fix Index Error

Conclusion

In my case, the "Video Outside the Viewport" Problem is actually not because the video is outside the viewport. Just the video thumbnail is not visible.😂