If you’re a Web designer, boy, are you gonna love this. Under the secret “Develop” menu, the new version of Safari is hiding something cool—the ability to view a site as it would appear on different devices and under different user agents, all in one place! That’s just…well, that’s awesome, is what that is.
To use this, first you’ll need to turn on the aforementioned “Develop” menu, the toggle for which is within Safari > Preferences under the “Advanced” tab.
Once that’s on, you’ll see “Develop” appear in your menu bar. Click it, and then choose “Enter Responsive Design Mode.”
Then you’ll be treated to a screen where you can see how your current webpage would look on quite a few different devices.
If you want, you can also change the User Agent (which browser the site will think it’s loading on) with the drop-down menu at the upper-right.
And finally, the site you’ve got open will have little draggy handles around it so you can change the dimensions to match your specific needs.
And yes, “draggy handles” is the correct technical term.
So here’s your chance to go nuts. Drag things around! View the TMO website at 576 x 553! Imagine what your new iPad Pro’s display would look like if you had one! Or I guess you could go do something actually productive with your time if you want to be all boring like that. I don’t recommend it.