Simplified Responsive Design Mode
Responsive design is a well-established practice of creating designs that adapt to different screen sizes.
Enabling the Inspection of Web Content in Apps
Web Inspector is a powerful tool that allows you to debug the layout of web pages, step through JavaScript, read messages logged to the console, and more.
Taming CSS Variables with Web Inspector
CSS Custom Properties, better known as CSS variables, have been widely adopted by web designers to build reusable and configurable design systems.
Introducing CSS Grid Inspector
CSS Grid Layout is a web-standard layout system used to define a grid structure of rows and columns in CSS.
Wide Gamut Color in CSS with Display-P3
Display-P3 color space includes vivid colors that aren’t available in sRGB.
WebGPU and WSL in Web Inspector
In Safari Technology Preview release 91, beta support was added for the WebGPU API and WSL.
How Web Content Can Affect Power Usage
Users spend a large proportion of their online time on mobile devices, and a significant fraction of the rest is users on untethered laptop computers.
Changing Page Settings on iOS Using Web Inspector
If you’ve ever used Web Inspector before, chances are you’ve used (or are at least familiar with) the Develop menu.
WebDriver is Coming to Safari in iOS 13
As anyone who has developed a mobile-friendly site can tell you, mobile browsers and desktop browsers are different.
CPU Timeline in Web Inspector
Web Inspector now includes a new CPU usage timeline that lets developers measure a page’s CPU usage, estimate its energy impact, and more easily investigate sources of script execution that may be contributing to poor energy utilization.
Creating Web Inspector Audits
This post is a followup to the Audits in Web Inspector post, and explains the capabilities of and how to write an audit.
Audits in Web Inspector
Often when creating web pages, there are particular rules or guidelines that are set by the site author, or by an included library/framework.