How to Use Dev Tools to View Your Site on Mobile

Most readers are on mobile devices! When making adjustments to your ads (or your site!) viewing on mobile is best.

Heather Tullos avatar
Written by Heather Tullos
Updated over a week ago

Developer tools can help you with all sorts of website details, but at Mediavine we use them most often to emulate different mobile experiences when we are helping you to make adjustments to your Mediavine ads.

If you are looking to make adjustments to your site or your ads, we recommend opening the page you want to view in an incognito window. This will allow you to see things that might normally be cached for you such as email opt-ins or options to enable push notifications, etc.

To test ads, you will want to add either ?test=houseads OR ?test=placeholders to the end of the URL you are testing. So the it'll look like this:

TO ACCESS DEVELOPER TOOLS

The Chrome browser is the easiest way to access dev tools and will also offer you fun things like Lighthouse Pagespeed Insights.

With the Chrome browser open, you can click the three little dots in the upper righthand corner. This menu will appear:

Mouse down to More Tools > Developer Tools and click to open.

On a Mac the shortcut is Option + Command + I.

On a PC running Windows the shortcut is F12 or Control + Shift + I.

Alternately you can right click on the page you want to inspect:

Clicking Inspect prompts the dev tools window to open.

ADJUST DEVELOPER TOOLS

Next you will want to change your view so that you can see your post or page on different devices. The default view will be "Responsive". We find it is best to select a few different specific devices to mimic the experience of your readers.

HOT TIP: Head to Google Analytics > Audience > Mobile > Devices to see the most common devices used by your readers.

Now that you've selected the device, you may need to refresh the page.

That's it! Scroll through your content and make notes about what you might do differently.

Did this answer your question?