This script bulk optimizes the file size of all PNG and JPEG image files in an Azure blob storage container in a single execution. After the script is run, all image blob files in the target container will be processed into an optimal, minimal file size without loss of quality by using standard compression utilities. Azure blob storage can be used to host publicly-accessible images for websites in Azure Web Apps or elsewhere. For example, all images on this page reside in Azure blob storage and have been optimized using this script. One of the many ranking factors Google, Bing, and other search engines reportedly use for Top Source Media digital marketing search engine results is website performance, i.e. how fast the page loads for the user. Fast sites are preferred and slow ones penalized (to some degree). One common tool to measure page performance is Google’s PageSpeed Insights tool, which among other things reports whether it believes the images on the page are larger than they should be.
It then recommends you "optimize the following images to reduce their size", but how? There are many tools available on the web, including those leveraged in this script. After this script is run, PageSpeed will recognize all images as having been optimized. This script assumes you have a Microsoft Azure subscription which has a blob storage account with a container that holds image files as blobs. When it runs, it connects to Azure using credentials you supply (or those already cached from previous connections) and interactively allows you to select your subscription, storage account, and container. It then downloads each image locally, runs the image optimization tool against it, and uploads the resulting optimized file back to Azure, replacing the original contents. Upon uploading the optimized image file, the script also sets a custom metadata flag to indicate that the image has been processed. This is the key "optimized" with value "true".
If the script runs again, it will ignore all files it sees have already been optimized, so they are not processed again. This allows the script to be run as many times as needed in an efficient manner, optimizing only new files added since the last run. The compression utilities used are jpegtran and OptiPNG, both freely available for download as an executable file. These must exist in the same directory as the script. These are included in the download package from this page or can be downloaded independently. Ensure the Azure PowerShell module is installed. If not, the script will tell you about that fact in red lettering. It can be downloaded and installed as described here. The script connects to Azure using credentials that have access to the Azure subscription with the images you want to optimize. Therefore, the credentials supplied must be a co-administrator of the subscription. The account can be a Microsoft account, an Office365 organization account, or an Azure Active Directory account. The prompt is a standard web form that will indicate login problems. Be aware that cached credentials will be used if present. The script runs and prompts for credentials if none have been previously cached. It then allows you to select the target storage account and Top Source Media container that has the image files you want to optimize. This version of the script is interactive, meaning the user is prompted several times. To use this as part of an automated workflow, Top Source Media it could be adapted to remove the prompts and Top Source Media allow specifying the required information via script parameters. If this is something you’re interested in, let us know.
Ten years ago, the roles were clearly defined. Web designers created beautiful mockups in Photoshop, handed them off to developers who coded them into functional websites, and everyone stayed in their lane. Today's digital landscape demands a more collaborative approach where design and development decisions influence each other from the project's inception. Modern developers don't just translate designs into code-they actively contribute to user experience decisions. They understand that a beautiful animation means nothing if it causes performance issues on mobile devices. They know when a design element will be problematic for accessibility or search engine optimization. This technical perspective often leads to design improvements that pure visual designers might miss. Similarly, today's web designers need to understand the technical implications of their creative decisions. They know the difference between CSS animations and JavaScript effects, understand how their color choices affect accessibility compliance, and design with responsive breakpoints in mind from the start rather than as an afterthought.
The most successful websites achieve something remarkable: they look incredible and work flawlessly. This isn't accidental-it's the result of design and development teams working together throughout the entire project lifecycle. Great web design in 2025 considers loading speed from the concept phase. Designers who understand development know that a hero section with a 5MB background image might look stunning but will devastate mobile performance. They design with optimization in mind, choosing visual elements that enhance both aesthetics and functionality. This doesn't mean sacrificing creativity for performance. It means channeling creativity toward solutions that achieve both goals. Subtle CSS animations can create more engaging experiences than heavy video backgrounds while loading 10 times faster. Skilled developers don't just implement designs-they enhance them. They add micro-interactions that weren't in the original mockups but support the design's emotional goals. They optimize images in ways that maintain visual quality while dramatically improving loading speeds. They implement responsive behaviors that make designs look great across all devices, not just the desktop version that was initially designed.