How to get webpage dimensions using page ruler

How many times have you seen a website where the ads are overlapped or one corner of the video goes out of the frame or out of the place where it should have actually been. I have seen this multiple times, specially with new bloggers or those who are not very much aware of basic coding or those who blindly copy the embedded code from YouTube to their blog or website. Also, I have seen ads in the right side widget bar appearing outside the actual template frame. This is a common mistake and will not look good to the end user or visitors.

Also check: How to place Ads in a website

The main reason why such a thing happens is website owners or admins 'assume' things when it comes to webpage dimensions. Let me give a simple example. Consider that you have Google Adsense ad or any other display ad which is  a 300*250 medium rectangle and your website or blog template has a side bar. And you want to place this ad in the side bar. Before you place an ad on side bar make sure that the width of the sidebar where you can place widgets is more than 300 or at-least equal to 300. Height of the widget should not be a problem here, but is better to consider that as well. If the widget size that is allowed by the template in the sidebar is less than 300 and if you place your ad code, then the ad will appear outside the frame. It's always good to know the exact dimensions of your widgets, sidebar, post etc so that you can place your ads accordingly.

If you are using Chrome browser then the best way to measure a webpage's dimension is to download and use extensions or apps likes Page Ruler, Ruul, Ruler, Accurate Ruler etc from Chrome Store. In the below image as an example I have used Page Ruler chrome extension to measure my webpage dimensions. This is very handy to measure the exact webpage dimensions.

Let me give you another example. Say, you want to embed YouTube video to your website or blog. Check out my previous post on How to resize YouTube video for your website. If you know the exact dimension of the allowed space in your webpage post then, all that you need to do is enter the dimensions before embedding the YouTube code in your website. Else, the video might overlap with other content if the dimensions are not proper.

If you like this post then don’t forget to share it with your friends and follow us on Social Media or subscribe to our blog via email.