# ImageGuide
> Free reference site and browser tools for image optimization on the web: formats, compression, responsive images, Core Web Vitals, and delivery. 103 guides and 10 conversion guides, no account, no paywall.


ImageGuide (www.imageguide.dev) is published by Sirv, an image CDN company. Every guide and tool is free to read and use. Where a guide gives a file size or a compression ratio, the figure comes from an encode run on a stated image set rather than from a vendor claim.

For structured reference information, including limitations, see [AI info](https://www.imageguide.dev/ai-info).

## Entity summary

- Entity: ImageGuide
- Website: https://www.imageguide.dev/
- Category: Web performance, image formats, front-end development
- Published by: Sirv, an image CDN and media hosting company
- Price: Free. No account, no sign-up, no paywall.
- Scope: Still images for the web, plus short video conversion. Not print production.

## Tools

- [ImageGuide Image Auditor](https://www.imageguide.dev/tools/extension/): Chrome extension that audits every image on the open page: format, transfer size, wasted pixels, and the saving from a modern format. Ten checks per image. Runs in the browser and sends no data anywhere. MIT licensed.
- [Format converter](https://www.imageguide.dev/convert/): Convert an image between formats.
- [Compressor](https://www.imageguide.dev/tools/compress/): Reduce the file size of an image.
- [Image comparison](https://www.imageguide.dev/tools/compare/): Compare two images side by side.
- [Image analyser](https://www.imageguide.dev/tools/analyze/): Inspect one image and report its format, size, and dimensions.
- [Dimensions reference](https://www.imageguide.dev/dimensions/): Image dimensions and aspect ratios by platform.
- [Format reference](https://www.imageguide.dev/formats/): Each image format, what it suits, and its browser support.
- [Claude skill](https://www.imageguide.dev/tools/claude-skill/): An installable skill carrying the site guidance to Claude.

## Image formats

- [10 Image Export Settings You're Probably Getting Wrong](https://www.imageguide.dev/guides/image-export-settings/): The export settings that quietly ruin web images - quality at maximum, wrong colour space, chroma subsampling on graphics, baseline JPEG, the 300 DPI myth, interlacing, missing output sharpening - and the correct value for each.
- [10 Ways to Convert Any Image to JPG on Any Device](https://www.imageguide.dev/guides/convert-any-image-to-jpg/): Turn any image into a JPG - Windows, macOS, iPhone, Android, Linux, browser and command line. Plus how to find out what your file really is when the extension is lying.
- [12 Image File Types Explained: When to Use Each](https://www.imageguide.dev/guides/image-file-types-explained/): A practical guide to 12 image file formats - JPEG, PNG, GIF, WebP, AVIF, SVG, HEIC, JPEG XL, TIFF, RAW, BMP and ICO. Compression, transparency, animation, browser support, and the right job for each.
- [7 Ways to Turn a Video Into a GIF (and Why You Often Should Not)](https://www.imageguide.dev/guides/video-to-gif/): Convert MP4 or MOV to GIF with ffmpeg palettes, gifski, screen recorders and browser tools. The three levers that control size, the frame rates GIF cannot represent, and when an MP4 wins.
- [8 Ways to Convert an Image to Vector (JPG and PNG to SVG)](https://www.imageguide.dev/guides/convert-image-to-vector/): How to turn a JPG or PNG into a vector - Inkscape, Illustrator Image Trace, potrace, VTracer, AI vectorizers and manual redraw - what each one is good at, and the cases where tracing is the wrong answer.
- [8 Ways to Convert HEIC to JPG (iPhone, Mac, Windows and Batch)](https://www.imageguide.dev/guides/heic-to-jpg/): Convert iPhone HEIC photos to JPG - Shortcuts, Finder Quick Actions, sips, ImageMagick, libheif and Windows. Plus the setting that stops your phone making HEICs at all.
- [8 Ways to Convert Images to WebP in Bulk](https://www.imageguide.dev/guides/convert-to-webp/): Convert PNG and JPG to WebP with cwebp, sharp, ImageMagick, libvips and CDNs. Which quality setting matches your JPEG, when lossless wins, and how to serve WebP without breaking anything.
- [8 Ways to Convert WebP to PNG or JPG (and Why Sites Serve WebP)](https://www.imageguide.dev/guides/webp-to-png-jpg/): You saved an image and got a .webp file. Here is how to convert it on every platform with dwebp, ImageMagick, Preview and browser tools - plus why converting to PNG makes it bigger, not better.
- [9 Things to Get Right When Converting RAW to JPEG](https://www.imageguide.dev/guides/raw-to-jpeg/): CR2, NEF, ARW and DNG to JPEG - free tools, batch commands, and the embedded preview trick that skips processing entirely. Plus the settings that only exist while the file is still RAW.
- [9 Ways to Convert a PDF to JPG or PNG (Without Losing Quality)](https://www.imageguide.dev/guides/pdf-to-image/): Turn PDF pages into images with pdftoppm, ImageMagick, Ghostscript, Preview, Acrobat and browser tools. Why DPI decides everything, and the ImageMagick error that stops most people.
- [9 Ways to Convert an Image to PDF (JPG, PNG and HEIC)](https://www.imageguide.dev/guides/image-to-pdf/): Turn photos and screenshots into a PDF - built-in tools on macOS, Windows, iPhone and Android, plus img2pdf, ImageMagick and Acrobat. Which methods re-encode your images, and how to stop them.
- [Adobe DNG Converter: A Complete Guide to the Digital Negative Format](https://www.imageguide.dev/guides/dng-converter/): The Adobe Digital Negative Converter is free, standalone, and the safest way to archive RAW files. How DNG works, lossless vs lossy DNG, a full walkthrough, batch conversion, and when you should not convert at all.
- [EXIF Orientation: Why Your Photos Open Sideways and How to Fix It](https://www.imageguide.dev/guides/exif-orientation/): What EXIF orientation means, all 8 orientation values explained, why an image rotated sideways opens correctly in one app and wrong in another, and how to fix rotation permanently with exiftool, ImageMagick, or sharp.
- [HDR Images on the Web: Complete Implementation Guide](https://www.imageguide.dev/guides/hdr-images-web/): Learn how to serve HDR images on the web. Covers HDR formats, display detection, tone mapping, and practical implementation for modern browsers and devices.
- [HEIC/HEIF: From iPhone to Web](https://www.imageguide.dev/guides/heic-heif-web-guide/): Convert iPhone HEIC photos for web use. Learn about HEIF format, conversion tools, automation strategies, and why you shouldn't serve HEIC directly on the web.
- [How to Remove JPEG Artifacts and Fix Blurry Compressed Images](https://www.imageguide.dev/guides/remove-jpeg-artifacts/): Remove JPEG artifacts from blocking, ringing, banding, and chroma bleed. Learn why lost data never comes back, which reduction techniques actually work, and when to re-export from source instead.
- [JPEG Optimization Mastery: The Definitive Guide](https://www.imageguide.dev/guides/jpeg-optimization-mastery/): Master JPEG optimization with this comprehensive guide covering compression fundamentals, quality settings, progressive encoding, chroma subsampling, and advanced techniques for maximum performance.
- [JPEG to JPG: There Is Nothing to Convert (and 7 Other Name Traps)](https://www.imageguide.dev/guides/jpeg-vs-jpg/): JPEG and JPG are the same format - the shorter name is a leftover from MS-DOS. Rename instead of converting, and learn the seven other extension traps that break uploads and web servers.
- [JPEG XL: The Future Image Format (Adoption Guide)](https://www.imageguide.dev/guides/jpeg-xl-future-format/): Everything you need to know about JPEG XL - the next-generation image format offering superior compression, HDR support, and lossless JPEG transcoding. Track browser support and learn implementation strategies.
- [Migrating from GIF to Modern Animated Formats](https://www.imageguide.dev/guides/gif-to-modern-formats/): Complete guide to replacing GIFs with modern alternatives. Learn WebP animations, video formats, Lottie, and CSS animations for better performance and quality.
- [PNG Optimization: Transparency Done Right](https://www.imageguide.dev/guides/png-optimization-transparency/): Master PNG optimization for web performance. Learn PNG-8 vs PNG-24 vs PNG-32, transparency techniques, compression tools, and when to choose PNG over modern formats.
- [PNG to ICO: 9 Steps to a Favicon That Works Everywhere](https://www.imageguide.dev/guides/png-to-ico-favicon/): Convert a PNG to a multi-size ICO and ship the four favicon files that actually matter in 2026 - plus the SVG dark-mode trick, the caching problem, and why the 20-file bundle is obsolete.
- [PNG to JPG and Back: 9 Ways to Convert Without Wrecking the Image](https://www.imageguide.dev/guides/png-to-jpg/): Convert PNG to JPG or JPG to PNG on any platform. Why transparency turns black, why JPG to PNG never restores quality, and which direction is right for photos, logos and screenshots.
- [SVG Best Practices for Web Performance](https://www.imageguide.dev/guides/svg-best-practices/): Master SVG optimization for the web. Learn accessibility, animation, icon systems, optimization tools, and performance techniques for scalable vector graphics.
- [The Complete AVIF Guide: Next-Generation Image Format](https://www.imageguide.dev/guides/complete-avif-guide/): Master AVIF image format with this comprehensive guide covering encoding, browser support, quality optimization, HDR capabilities, and real-world implementation strategies.
- [The Complete WebP Guide: Everything You Need to Know](https://www.imageguide.dev/guides/complete-webp-guide/): Master WebP image format with this comprehensive guide covering encoding, optimization, browser support, conversion strategies, and real-world implementation.

## Performance and Core Web Vitals

- [11 Image Optimization Myths That Refuse to Die](https://www.imageguide.dev/guides/image-optimization-myths/): The image optimization advice that was wrong, or stopped being true years ago - 300 DPI, PNG quality, lazy loading everything, quality 100, 3x retina, and seven more myths, with what is actually true.
- [11 Responsive Image Mistakes That Ship Broken Layouts](https://www.imageguide.dev/guides/responsive-image-mistakes/): srcset without sizes, lazy-loaded hero images, missing dimensions, art direction in the wrong element. The responsive image errors that quietly waste bandwidth and wreck Core Web Vitals.
- [12 Image Optimization Mistakes That Slow Down Your Website](https://www.imageguide.dev/guides/image-optimization-mistakes/): The 12 image mistakes that cost the most performance, why each one hurts, how to spot it in DevTools, and the exact fix. Covers oversized files, missing dimensions, lazy-loaded LCP images, and more.
- [8 Image SEO Mistakes That Hurt Your Rankings](https://www.imageguide.dev/guides/image-seo-mistakes/): The image SEO mistakes that keep pages out of Google Images and slow down rankings - meaningless filenames, weak alt text, unindexable lazy loading, missing structured data, no image sitemap - and how to fix each one.
- [9 Ways to Reduce Image File Size Without Losing Quality](https://www.imageguide.dev/guides/reduce-image-file-size/): Nine practical techniques to shrink image files while keeping them sharp: right-sizing, modern formats, quality tuning, metadata stripping, chroma subsampling, lossless optimizers, and CDN negotiation.
- [Automated Image QA and Testing: Catch Issues Before Production](https://www.imageguide.dev/guides/automated-image-qa-testing/): Implement automated quality assurance for images in your development workflow. Learn visual regression testing, performance validation, and accessibility checks.
- [Automatic Social Share Images: Build an OG Image Generator for Every Page](https://www.imageguide.dev/guides/automatic-social-share-images/): Generate a dynamic og image for every page automatically. Compare static, build-time, and on-demand OG image generators with @vercel/og, astro-og-canvas, Puppeteer, and sharp.
- [Batch Image Processing Workflows: Scale Your Optimization](https://www.imageguide.dev/guides/batch-image-processing-workflows/): Process thousands of images efficiently with batch workflows. Learn command-line tools, scripting techniques, and cloud services for large-scale image optimization.
- [Bootstrap Images: Every Class You Need, Plus What Bootstrap Won't Do for You](https://www.imageguide.dev/guides/bootstrap-images/): A practical guide to bootstrap images: img-fluid, img-thumbnail, alignment classes, figures, cards, carousels, lazy loading, and responsive srcset patterns that Bootstrap 5 does not handle for you.
- [Broken Image Fix: The Complete Guide to img onerror and Image Fallbacks](https://www.imageguide.dev/guides/image-error-fallbacks/): Fix broken images with the img onerror handler, capture-phase listeners, placeholder swaps, React and Next.js fallbacks, and Service Worker recovery. Why images fail, what broken images cost your UX and SEO, and how to prevent failures before deploy.
- [Browser DevTools for Image Debugging: Complete Guide](https://www.imageguide.dev/guides/browser-devtools-image-debugging/): Master browser DevTools for diagnosing image performance issues. Learn to analyze loading, inspect compression, debug responsive images, and identify optimization opportunities.
- [Cache-Control for Images: The Complete Guide to Image Caching Headers](https://www.imageguide.dev/guides/image-caching-headers/): How image cache-control headers work: max-age, s-maxage, immutable, stale-while-revalidate, and ETag revalidation. Copy-paste configs for nginx, Apache, Vercel, Netlify, and Express, plus the mistakes that keep your images from caching.
- [CI/CD Image Optimization Pipelines: Automate Your Workflow](https://www.imageguide.dev/guides/cicd-image-optimization-pipelines/): Build automated image optimization into your CI/CD pipeline. Learn GitHub Actions, GitLab CI, and Jenkins configurations for consistent, optimized images on every deploy.
- [Color Spaces, Profiles, and the Web](https://www.imageguide.dev/guides/color-spaces-profiles-web/): Master color management for web images. Learn sRGB, Display P3, color profiles, wide gamut displays, and ensuring consistent color across devices.
- [CSS Background Images: image-set(), Responsive Loading, and CLS Fixes](https://www.imageguide.dev/guides/css-background-images/): A practical guide to the CSS background image: why it hurts Core Web Vitals by default, how to use image-set() for AVIF and WebP fallbacks, responsive media-query backgrounds, preload and lazy-load patterns, and when an img element is the better choice.
- [Hero Image Size: The Complete Guide to Hero Image Dimensions for Every Layout](https://www.imageguide.dev/guides/hero-image-size/): The right hero image size is 1920×1080 or 2560×1440 at the source, delivered responsively. Learn aspect ratios per layout, text-overlay safe zones, a file weight budget under 200KB, and platform-specific dimensions.
- [Hotlinking: What It Is, How to Detect It, and Whether Hotlink Protection Is Right for You](https://www.imageguide.dev/guides/prevent-hotlinking/): What is hotlinking, how do you detect it in your access logs, and when should you prevent image hotlinking at all? Nginx, Apache, signed URL, and CDN hotlink protection examples, plus the watermark alternative and the gotchas that block legit users.
- [How to Change Image on Hover: CSS Image Hover Effects That Don't Hurt Performance](https://www.imageguide.dev/guides/image-hover-effects/): Change image on hover with pure CSS, zoom images smoothly, and add css image hover effects without layout shift. Includes preload rules for the hover state, touch-device fallbacks, and accessibility parity.
- [How to Lower Image Resolution: Pixels, File Size, and Quality Explained](https://www.imageguide.dev/guides/lower-image-resolution/): Learn how to lower image resolution the right way. Pick target dimensions for screen and print, resize with built-in tools, ImageMagick, sharp, or Pillow, and keep quality high.
- [How to Migrate Images to a CDN Without Losing SEO](https://www.imageguide.dev/guides/migrate-image-cdn/): A complete image CDN migration checklist: inventory every image URL, choose between identical paths and a new hostname, set up 301 redirects, warm the cache, and monitor Search Console so rankings on image search survive the move.
- [Image CDN for Image Hosting](https://www.imageguide.dev/guides/image-cdn-for-image-hosting/): Learn when to use an image CDN for hosting pictures, product media, responsive images, WebP/AVIF delivery, transformations, and global speed.
- [Image Metadata: EXIF, IPTC, and Privacy](https://www.imageguide.dev/guides/image-metadata-privacy/): Understand image metadata, its privacy implications, and optimization impact. Learn to read, strip, and manage EXIF, IPTC, and XMP metadata for web images.
- [Image Optimization for Core Web Vitals](https://www.imageguide.dev/guides/core-web-vitals-images/): Master image optimization to improve LCP, CLS, and INP. Learn practical techniques to pass Core Web Vitals with proper image loading, sizing, and format strategies.
- [Image Placeholders: LQIP, Blurhash, and Thumbhash Explained](https://www.imageguide.dev/guides/image-placeholders/): Every image placeholder technique compared: solid colors, LQIP, Blurhash, Thumbhash, SQIP, and CSS-only blurs. How each one works, what it costs to decode, and which to pick for your stack.
- [Image Preloading and Priority Hints](https://www.imageguide.dev/guides/image-preloading-priority-hints/): Master image preloading and fetchpriority for optimal performance. Learn when to preload, priority hints, responsive preloading, and avoiding common mistakes.
- [Image Resizing for the Web: The Complete Guide](https://www.imageguide.dev/guides/image-resizing-web-guide/): Master image resizing for web performance. Learn optimal dimensions, aspect ratios, responsive sizing strategies, and automated resizing with CDNs and build tools.
- [Image SEO: File Names, Structured Data, and Search Rankings](https://www.imageguide.dev/guides/image-seo-guide/): Master image SEO with this comprehensive guide covering file naming conventions, structured data markup, sitemaps, and optimization techniques that drive organic traffic.
- [Images in AI Search: What Microsoft's Retail Guide Asks For](https://www.imageguide.dev/guides/ai-search-image-optimization/): Microsoft published a guide telling retailers how to be recommended by AI assistants. Its image advice is two bullet points. Here is what those bullets mean in practice, and the four things they leave out.
- [Lazy Loading Implementation Strategies](https://www.imageguide.dev/guides/lazy-loading-strategies/): Master image lazy loading for web performance. Learn native loading, Intersection Observer, placeholder techniques, and framework implementations for optimal user experience.
- [Lighthouse Image Audit: Fix Every Image Warning](https://www.imageguide.dev/guides/lighthouse-image-audit-guide/): Fix all Lighthouse image-related warnings and opportunities. Step-by-step solutions for properly size images, serve modern formats, defer offscreen images, and more.
- [Naming Images for SEO: Filename Rules, Examples, and Workflows](https://www.imageguide.dev/guides/naming-images-for-seo/): Naming images for SEO starts with the filename. Learn the hyphenated descriptive-slug pattern, before-and-after examples, per-context recipes for stores, blogs, and docs, and how to rename files without breaking URLs.
- [Retina/HiDPI Images: Complete Implementation Guide](https://www.imageguide.dev/guides/retina-hidpi-images/): Master retina and HiDPI image delivery. Learn device pixel ratios, srcset, responsive images, and optimization strategies for sharp images on all displays.
- [The Complete Image Optimization Guide for the Web](https://www.imageguide.dev/guides/image-optimization-guide/): Image optimization in one place: pick the right format, size images responsively, compress at the right quality, and deliver through a CDN. A decision framework, format tables, quality settings, and a checklist you can run on any site.
- [The Complete Responsive Images Guide](https://www.imageguide.dev/guides/responsive-images-complete-guide/): Master responsive images with srcset, sizes, and picture elements. Learn resolution switching, art direction, and modern implementation patterns for optimal web performance.
- [Understanding Image Compression: Lossy vs Lossless Deep Dive](https://www.imageguide.dev/guides/understanding-image-compression/): Master image compression fundamentals. Learn how lossy and lossless compression work, quality metrics, format comparisons, and optimization strategies for the web.

## Industry use cases

- [10 Product Photo Mistakes That Hurt E-commerce Conversions](https://www.imageguide.dev/guides/product-photo-mistakes/): The product image mistakes that cost sales - inconsistent framing, cluttered backgrounds, single angles, no scale reference, zoom that is too low-resolution, wrong colour, slow galleries and missing structured data - with the fix for each.
- [360 Product Viewer: Images, Spins and Zoom](https://www.imageguide.dev/guides/360-product-viewer/): Build a fast 360 product viewer with the right image count, sizing, compression, lazy loading, zoom, and Sirv Media Viewer setup.
- [7 Ways to Turn an Image Into an Editable Word or Excel File](https://www.imageguide.dev/guides/image-to-word-excel/): Get text and tables out of a photo or screenshot and into Word, Excel or Google Docs - including Excel's Data From Picture, Tesseract TSV output and the layout problem nobody warns you about.
- [7 Ways to Upscale an Image Without Making It Look Fake](https://www.imageguide.dev/guides/upscale-image-quality/): How to convert a picture to high resolution honestly - finding the real original, Lanczos resampling, Real-ESRGAN and waifu2x, AI upscalers, re-rendering from source - and when upscaling is the wrong answer.
- [9 Image Accessibility Mistakes That Exclude Real Users](https://www.imageguide.dev/guides/image-accessibility-mistakes/): Image accessibility goes well beyond alt text. Nine mistakes that lock people out - text baked into images, colour-only meaning, unlabelled icon buttons, autoplaying animation, inaccessible lightboxes, undescribed charts - and the fix for each.
- [Accessible Images for Screen Readers: A Developer's Guide](https://www.imageguide.dev/guides/accessible-images-screen-readers/): Build truly accessible websites with this comprehensive guide to screen reader compatibility. Learn ARIA labels, role attributes, and testing techniques for image accessibility.
- [AI Alt Text: How Alt Text Generators Work and When to Use Them](https://www.imageguide.dev/guides/ai-alt-text/): An AI alt text generator writes image descriptions in seconds. Learn how auto alt text works, where it fails, and how to combine generation with human editing.
- [AI Image Generation: Optimizing for Web Use](https://www.imageguide.dev/guides/ai-image-generation-optimization/): Learn how to optimize AI-generated images for web performance. Covers post-processing workflows, format selection, and best practices for Gemini 3 Pro, GPT Image 1.5, and other AI generators.
- [E-commerce Product Image Optimization](https://www.imageguide.dev/guides/ecommerce-product-images/): Master product image optimization for online stores. Learn techniques for product galleries, zoom functionality, color accuracy, and conversion-focused image strategies.
- [Email Image Optimization: The Complete Guide](https://www.imageguide.dev/guides/email-image-optimization/): Optimize images for email campaigns with this comprehensive guide. Learn format selection, size limits, retina support, and techniques that work across all email clients.
- [Free Stock Photos: Licenses, Sources, and How to Optimize What You Download](https://www.imageguide.dev/guides/free-stock-photos/): Where to find free stock photos and free images you can legally use. Compare Unsplash, Pexels, Pixabay, Burst and more, learn the license rules, then resize, convert to WebP or AVIF, and compress every download before it ships.
- [How to Create a Photo Gallery Website That Loads Fast](https://www.imageguide.dev/guides/photo-gallery-website/): Plan a photo gallery website that stays fast with 50+ images: grid and masonry layouts, thumbnail budgets, lazy loading, lightbox behavior, CLS-free masonry, and hosting options from self-hosted files to a CDN gallery.
- [How to Watermark Photos: Every Method Compared](https://www.imageguide.dev/guides/watermark-images/): How to watermark photos and protect your images: text and logo watermarks, tiled patterns, ImageMagick batch jobs, sharp and Pillow scripts, Photoshop actions, and CDN watermarking on the fly.
- [Image Alt Text: The Complete Writing Guide](https://www.imageguide.dev/guides/image-alt-text-guide/): Learn how to write effective alt text for images that improves accessibility, SEO, and user experience. Includes examples, best practices, and common mistakes to avoid.
- [Image Background Removal: Tools, Techniques & Automation](https://www.imageguide.dev/guides/background-removal-guide/): Complete guide to removing image backgrounds for web, e-commerce, and marketing. Compare AI tools, APIs, CSS techniques, and batch processing workflows.
- [Maps and Data Visualization Images: Optimization Guide](https://www.imageguide.dev/guides/data-visualization-images/): Optimize charts, graphs, maps, and infographics for the web. Learn format selection, responsive strategies, and accessibility best practices for data visualizations.
- [Photography Portfolio Optimization Guide](https://www.imageguide.dev/guides/photography-portfolio-optimization/): Optimize your photography portfolio for web display. Learn color accuracy, gallery performance, high-resolution delivery, watermarking, and SEO for photographers.
- [Screenshots and Documentation Images: Optimization Guide](https://www.imageguide.dev/guides/screenshots-documentation-images/): Create crisp, optimized screenshots for documentation, tutorials, and help content. Learn format selection, annotation best practices, and automation strategies.
- [User-Generated Content Image Optimization at Scale](https://www.imageguide.dev/guides/user-generated-content-images/): Handle user-uploaded images at scale. Learn processing pipelines, moderation, storage strategies, optimization techniques, and best practices for UGC.
- [Visual Search Optimization: Google Lens, Pinterest & Beyond](https://www.imageguide.dev/guides/visual-search-optimization/): Optimize images for visual search engines. Learn how Google Lens, Pinterest Lens, and AI-powered search discover and rank images, with practical optimization strategies.

## Platform guides

- [Angular Image Optimization with NgOptimizedImage](https://www.imageguide.dev/guides/angular-image-optimization/): Master Angular's NgOptimizedImage directive for optimal image performance. Learn priority loading, automatic srcset, lazy loading, CDN integration, and performance patterns.
- [Best WordPress Image Optimizer Plugins](https://www.imageguide.dev/guides/wordpress-image-optimizer-plugin/): Compare WordPress image optimizer plugins for compression, WebP, AVIF, lazy loading, CDN delivery, WooCommerce, and Core Web Vitals.
- [Next.js Image Component Mastery](https://www.imageguide.dev/guides/nextjs-image-mastery/): Master the Next.js Image component for optimal performance. Learn configuration, optimization strategies, responsive images, and advanced patterns for image handling.
- [React Image Optimization: Complete Guide](https://www.imageguide.dev/guides/react-image-optimization/): Optimize images in React applications. Learn lazy loading, responsive images, WebP/AVIF delivery, CDN integration, and performance patterns for React, Vite, and CRA projects.
- [Shopify Image Optimization Bible](https://www.imageguide.dev/guides/shopify-image-optimization/): Complete guide to image optimization in Shopify. Master Liquid image filters, theme development, product images, and performance optimization for faster stores.
- [Squarespace Image Optimization Guide](https://www.imageguide.dev/guides/squarespace-image-optimization/): Optimize images on Squarespace for speed and quality. Learn upload best practices, focal points, galleries, banners, and performance tips for the platform.
- [Webflow Image Optimization: The Complete Guide](https://www.imageguide.dev/guides/webflow-image-optimization/): A practical guide to Webflow image optimization. Learn how Webflow handles uploads, which image settings matter, when to optimize before upload, and how to fix the mistakes that slow Webflow sites down.
- [Wix Image Optimization: Complete Guide](https://www.imageguide.dev/guides/wix-image-optimization/): Master image optimization on Wix. Learn how Wix handles images automatically, best upload practices, gallery optimization, SEO settings, and performance tips for faster Wix sites.
- [WordPress Image Performance Complete Guide](https://www.imageguide.dev/guides/wordpress-image-performance/): Master image optimization in WordPress. Learn core features, plugins, WebP/AVIF support, responsive images, WooCommerce optimization, and performance best practices.

## Comparisons

- [12 Free Image Tools Every Web Developer Should Bookmark](https://www.imageguide.dev/guides/free-image-tools/): Twelve genuinely free image tools - Squoosh, Sharp, ImageMagick, FFmpeg, SVGO, oxipng, MozJPEG, ExifTool, DevTools and more - with the exact commands and the job each one is best at.
- [12 Image Converters Compared: Browser, Desktop, CLI and API](https://www.imageguide.dev/guides/image-converters-compared/): Which image converter to use - browser tools, XnConvert, IrfanView, ImageMagick, libvips, sharp, Pillow and CDNs. Compared on batch size, formats, speed, privacy and cost.
- [8 Signs Your Website Needs an Image CDN](https://www.imageguide.dev/guides/signs-you-need-an-image-cdn/): How to tell whether an image CDN is worth it - variant explosion, uncontrolled uploads, international latency, format lag, origin load - plus an honest look at when a build step is still the better answer.
- [9 Ways to Extract Text From an Image (OCR Methods Compared)](https://www.imageguide.dev/guides/extract-text-from-image/): Convert a photo to text with the method that fits the job - phone camera, Google Drive, Windows and macOS built-ins, Tesseract, cloud OCR APIs, and Acrobat - plus how to raise accuracy on bad scans.
- [Build Tool Image Plugins Compared](https://www.imageguide.dev/guides/build-tool-image-plugins/): Compare image optimization plugins for Webpack, Vite, Rollup, and other build tools. Configuration examples, performance tips, and recommendations.
- [Image CDN Comparison: Cloudinary, Imgix, Sirv and More](https://www.imageguide.dev/guides/image-cdn-comparison/): Compare leading image CDN services. Features, pricing, performance, and use cases for Cloudinary, Imgix, Sirv, Bunny, Cloudflare, and more.
- [Image Compression Tools Compared: TinyPNG vs Squoosh vs ShortPixel & More](https://www.imageguide.dev/guides/image-compression-tools-compared/): In-depth comparison of image compression tools for web. Compare TinyPNG, Squoosh, ShortPixel, ImageOptim, Sharp, and CDN-based solutions with benchmarks and recommendations.
- [JPG vs PNG: Which Format Should You Use (and When Both Lose)](https://www.imageguide.dev/guides/jpg-vs-png/): JPG vs PNG compared on compression, transparency, color depth, file size, metadata, and browser support. See real size numbers for photos and screenshots, plus the hybrid workflow pros use.
- [PNG vs WebP: Which Format Should You Use in 2026?](https://www.imageguide.dev/guides/png-vs-webp/): A practical PNG vs WebP comparison: lossless against lossless, lossy WebP against lossless PNG, transparency, animation, browser support, tooling gaps, and when PNG still wins.
- [WebP vs AVIF vs JPEG XL: Which Format When?](https://www.imageguide.dev/guides/webp-avif-jpeg-xl-comparison/): Comprehensive comparison of modern image formats. Learn the strengths, weaknesses, browser support, and ideal use cases for WebP, AVIF, and JPEG XL.

## Social media sizing

- [12 Social Media Image Sizes Worth Bookmarking](https://www.imageguide.dev/guides/social-media-image-sizes/): Current image dimensions for Instagram, Facebook, LinkedIn, X, Pinterest, YouTube, TikTok and more - with safe zones, aspect ratios, file limits, and one master-image workflow that generates every crop.
- [Social Media Ad Sizes: Every Paid Placement Spec in One Table](https://www.imageguide.dev/guides/social-media-ad-sizes/): Current social media ad sizes for Meta, Google Display Network, X, LinkedIn, TikTok, Pinterest and YouTube - plus banner sizes, profile picture sizes, safe zones, file limits, and one master-image workflow that covers every placement.
- [Social Media Image Optimization: Platform-by-Platform Guide](https://www.imageguide.dev/guides/social-media-image-optimization/): Optimize images for every social platform. Get the exact dimensions, formats, and best practices for Instagram, Facebook, Twitter/X, LinkedIn, Pinterest, and TikTok.

## Conversion guides

Step-by-step conversion walkthroughs attached to the format converter pages. Each covers methods, quality expectations, and pitfalls.

- [HEIC to PNG: When to Convert, and How on iPhone, Mac, Windows and the Command Line](https://www.imageguide.dev/convert/heic-to-png/): Convert HEIC to PNG on iPhone, iPad, macOS, Windows, or in bulk with ImageMagick, libheif, sharp and pillow-heif. Plus when PNG is the wrong choice and JPEG will serve you better.
- [How to Change Image Format: The Complete Convert Image Format Guide](https://www.imageguide.dev/convert/): Convert image format the right way: pick the right target format for photos, screenshots, logos and animations, avoid generation loss, and batch-convert with OS built-ins, ImageMagick, sharp or Pillow.
- [How to Convert Word to JPG: Every Method Compared](https://www.imageguide.dev/convert/word-to-jpg/): Convert Word to JPG the right way - export to PDF first, then render pages as images. Covers Word, Google Docs, LibreOffice headless batch pipelines, DPI settings, fidelity pitfalls, and when PNG beats JPG for text.
- [JPG to BMP and BMP to JPG: When This Conversion Makes Sense (and When It Really Does Not)](https://www.imageguide.dev/convert/jpg-to-bmp/): Convert JPG and BMP files in both directions with Paint, Preview, ImageMagick, Pillow and sharp. Why BMP is almost always the wrong target, which legacy systems still need it, and how the variants differ.
- [JPG to PNG With a Transparent Background: Every Method That Works](https://www.imageguide.dev/convert/jpg-to-png/): Convert JPG to PNG with transparent background the right way. JPEG cannot store transparency, so learn the two-step process: convert to PNG, then remove the background with AI tools, GIMP, ImageMagick, or Python.
- [PDF to Vector: How to Get a Real Vector File Out of a PDF](https://www.imageguide.dev/convert/pdf-to-vector/): Convert a PDF to a vector file the right way. Learn how to tell if your PDF already contains vector paths, how to extract them with pdf2svg, Inkscape, mutool or pdftocairo, and when a scanned PDF needs tracing instead.
- [PNG Converter: 9 Ways to Convert Any Image to PNG](https://www.imageguide.dev/convert/png/): Convert files to PNG with built-in tools, ImageMagick, ffmpeg, sharp or Pillow. When PNG is the right target, when a photo becomes huge as PNG, and how to keep converted files small.
- [PSD to JPG: How to Flatten and Convert Photoshop Files (Every Method)](https://www.imageguide.dev/convert/psd-to-jpg/): Convert PSD to JPG with Photoshop, GIMP, Photopea, ImageMagick or Python. What flattening does to your layers, which export settings to pick, and the pitfalls that turn transparent backgrounds black.
- [TIFF to PDF: 8 Ways to Convert TIFF Files (Multi-Page, Batch and CLI)](https://www.imageguide.dev/convert/tiff-to-pdf/): Convert TIFF to PDF with macOS Preview, Windows Print to PDF, img2pdf, ImageMagick and tiff2pdf. Handle multi-page TIFFs, pick JPEG or Flate compression inside the PDF, and convert PDF back to TIFF.
- [WebP to GIF: Convert Static and Animated Images the Right Way](https://www.imageguide.dev/convert/webp-to-gif/): Convert WebP to GIF with ffmpeg, ImageMagick, sharp or Pillow. Learn when the conversion makes sense, why animated files explode in size, and how to keep frame timing and transparency intact.

## Optional

- [All guides](https://www.imageguide.dev/guides/): Index of every guide.
- [Privacy policy](https://www.imageguide.dev/privacy): The extension collects no data. The site counts page views without cookies.