In web development, the term “viewport” refers to the visible area of a web page, typically on a desktop or mobile device. When a video is embedded on a web page, it should be positioned within the viewport so that users can see it without scrolling. If a video is positioned outside the viewport, it means that users will need to scroll down or up to view it.
Google Say About Video Outside the Viewport
Here’s the recommendation of Google Search Central:
- Video outside the viewport: Reposition the video on the page so that the entire video is inside the renderable area of the page and seen when the page loads.
- Video too small: Increase the height of the video so that it’s larger than 140px or the width of the video so that it’s larger than 140px and at least a third of the page’s width.
- Video too tall: Decrease the height of the video so that it’s smaller than 1080px.
Google Search Console Report:
(GSC) may report the issue of “Video outside the viewport” if it detects that a video on a website is positioned outside the viewport. This can have a negative impact on a website’s search engine optimization (SEO) as Google may not index the video properly.
Some Reasons of the “Video Outside the Viewport”
Here are the main reasons why Google may flag the issue of “Videos outside the viewport”:
- Poor video positioning: The video is positioned too far down or to the right on the page, causing it to fall outside the viewport.
- Fixed or absolute positioning: The video or its container is set to a fixed or absolute position in CSS, causing it to be positioned outside the viewport regardless of the page’s layout.
- Lazy loading: The video is lazy loaded, meaning it is not loaded until the user scrolls down to it. This can cause Googlebot to miss the video when crawling the page.
How to fix Video outside the viewport, Video too small, Video too tall in GSC?
Three reasons why Google might not be able to determine the prominent video on page and how to resolve them:
1: Video outside the viewport:
- Issue: video is positioned outside the visible area of the page, meaning users need to scroll to see it.
- Solution: Reposition the video within the viewport so that it is visible without scrolling. It can be done by adjusting the video’s position in the page’s HTML/CSS code.
2: Video too small
- Issue: This video is too small to be considered prominent. Google recommends that videos be at least 140px tall or wide.
- Solution: Increase the size of the video to at least 140px in either height or width.
Video too tall
- Issue: The video is too tall and may be distracting from other content on the page. Google recommends that videos be no taller than 1080px.
- Solution: Reduce the height of the video to no more than 1080px. This can be done by adjusting the video’s dimensions in the HTML code or using CSS to control its size.
This can help to improve your website’s search ranking and User Experience.
FAQ’s
Q: What are the common reasons for videos appearing outside the viewport?
Videos may extend beyond the viewport due to improper sizing, incorrect coding, or issues with responsive design. Additionally, discrepancies between various devices and browsers can also lead to this problem.
Q: How does ‘Video outside the viewport’ impact user engagement?
Positioned outside the viewport, users might not have easy access to the content, leading to frustration and potential disengagement. It can result in users missing crucial information, leading to a negative experience on the site.
Q: What role does responsive design play in addressing ‘Videos outside the viewport’ issues?
Responsive design is crucial in ensuring that content, including videos, adjusts appropriately to different screen sizes. Implementing responsive design principles can help resolve issues related to videos extending beyond the viewport.
Q: How often should I check for ‘Video outside viewport’ issues in Google Search Console?
Regular monitoring is key. Checking Google Search Console for such issues should be part of routine site maintenance. Set a schedule to review and address any problems related to video placement to maintain an optimal user experience.
Conclusion
In conclusion, resolving issues related to videos outside the viewport is pivotal for an optimal online presence. Addressing these concerns through the Google Search Console and implementing best practices ensures a seamless user experience and improved SEO performance. By addressing the “Video outside viewport” issue, you can improve the user experience and potentially enhance your website’s SEO performance.
