Reading Time: 4 minutes

Looking for a ways to find the image dimension in a WordPress website?

Look no more. Let me share to you what I’ve learned. When you add an image to a page on your website, you can contribute towards your page load speed if the image dimensions are only as large as they need to be. There’s no value adding a 2000 x 1000 sized image into an area that will appear as 200 x 125 on most large screens.

So  how do you tell the dimensions of an image used on a web page? You can use the easy step-by-step instructions below, for Chrome, Safari, Firefox and Internet Explorer.

IMPORTANT NOTE BEFORE YOU START

Managing your images correctly is just one of hundreds of ways to improve your websites performance. Unless you are an active digital professional, managing your own website, can be toxic.

Here’s how to find it in GOOGLE CHROME browser

To find out the dimensions of an image using google chrome browser, follow these steps;

1. Using the Chrome browser, press F12 or right click anywhere inside the web page and select Inspect Element.

WordPress - How to find the dimensions of an image 01

2. In the new window that appears in your browser, click on the magnifying glass to which turns on the inspection function.

WordPress - How to find the dimensions of an image 02

3. Now click on the image to reveal it’s dimensions. The Chrome inspection tool displays the image width and height – the first number is always the width.
WordPress - How to find the dimensions of an image 03

Here’s how to find it in SAFARI browser

To find out the dimensions of an image using safari browser, follow these steps;

1. First off, you’ll enable the Safari Developer Toolbar. Open your Safari Preferences.

1.1 If you’re on a Mac, click Safari and navigate to Preferences

How-to-change-the-Safari-preferences-on-a-mac

1.2 If you’re on a PC, click Ctrl + , to open Safari Preferences, or press Alt to display the top menu and click on Edit > Preferences.

How-to-Edit-your-Preferences-in-Safari

2. Click the Advanced tab (the cog on the far right) then tick the Show Develop menu in menu bar box at the bottom of this window and then close the Preferences window.

Show Develop menu in menu bar
3. Right click anywhere inside your page and select Inspect Element.

Inspect Element

4. In the new window that appears, click on the magnifying glass.magnifying glass

5. Now click on the image to determine it’s dimensions. The Safari inspection tool will display the image width and height – the first number is always the width.
click on the image

Here’s how to find it using FIREFOX browser

To find out the dimensions of an image using Firefox browser, follow these steps;

Right click anywhere inside your web page, and select Inspect Element.

Inspect Element

2. In the new window that appears, click far left arrow/square button (if you hover over it, the description is Pick an element from the page.
Pick an element from the page
3. Now simply hover your mouse over the image you want to learn more about. The Firefox tool displays the image width and height – the first number is always the width.

hover your mouse over the image

Here’s how to find it using INTERNET EXPLORER (EDGE) browser.

To find out the dimensions of an image using Internet explorer (EDGE) browser, follow these steps;

1. Press F12 to bring up the Developer Tools, this will open a new window.

2. Click on Dom Explorer and then click on the far left arrow/square button (if you hover over it, the description is Select element.

Dom Explorer

3. Click on the image that you’d like to find out more about. In the window below you’ll notice an area highlighted in blue – here you’ll find the images width and height.

Click on the image 

Did you find this article helpful?  We hope we manage to address your questions and queries.

https://biztoolreview.com/others/how-to/

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses cookies to offer you a better browsing experience. By browsing this website, you agree to our use of cookies.