Batch Image Conversion — Naming and Folder Conventions
Batch image conversion creates chaos without naming rules — duplicate webp files, lost sources, and broken CMS imports. Folder structure and filename patterns that scale.
The deploy broke hero images — banner.webp, banner (1).webp, banner-final.webp, and banner_final_v2.webp in the same folder. CMS expected homepage-hero-1200w.webp. Nobody remembered which batch script made which.
Batch conversion without naming rules is entropy at scale.
Principles
- Masters immutable — originals never overwritten
- Predictable pattern — machine and human sortable
- Format visible — extension matches actual file
- Variant explicit — width, purpose, or density in name
- One convention per project — document in README
See also Batch Renaming Before Upload.
Filename pattern template
{project}_{asset}_{variant}_{width}w.{ext}
Examples:
adsense_hero_desktop_1200w.webpadsense_icon_search_32w.pngblog_phishing-diagram_featured_1600w.jpg
Lowercase, hyphens preferred for URLs importing to static hosts.
Folder structure
assets/
originals/
hero.psd
hero-master.png
export/
webp/
jpeg/
png/
archive/
2026-10-batch/
Or route-based:
public/images/blog/phishing-pdf-attachments/
featured-1200w.webp
diagram-metadata-800w.webp
Batch conversion tools
Browser tools — WebP Converter, PNG to JPG, JPG to PNG, Resize Image — one at a time for small sets.
CLI for volume:
# illustrative — adjust tools to your stack
for f in originals/*.png; do
cwebp -q 85 "$f" -o "export/webp/$(basename "${f%.png}").webp"
done
Log conversions to manifest.csv — source, output, date, quality.
Responsive sets
Retina Images 2x — export 1x and 2x with width in filename.
Image CDN vs Browser Resize — if CDN handles variants, simplify local names.
SVG to raster batches
SVG to PNG When Needed — logo.svg → logo-512w.png explicit.
Compression pass
After convert, Compress Image — don't compress before naming final output or traceability breaks.
How Image Compression Affects Quality.
CMS and import pitfalls
- Spaces →
%20URL ugliness - Uppercase extensions break Linux deploys
- Overwriting same name in CDN cache — version suffix
hero-v3.webpor content hash
Dark mode pairs
Dark Mode Screenshots — suffix _dark / _light: docs-editor_dark_1200w.png
Troubleshooting
How should I name files in a batch image conversion? Use consistent pattern: project_asset_variant_size.format — example: homepage_hero_desktop_1200w.webp. Include width or purpose in name when exporting responsive variants. Avoid spaces; use hyphens or underscores consistently.
Should I keep original files after batch conversion? Yes in a separate originals/ or masters/ folder untouched. Convert outputs to dist/ or publish/. Never overwrite masters without backup — re-export needs source quality.
What folder structure works for batch image exports? project/originals/, project/export/webp/, project/export/jpeg/, or by page route: /blog/post-slug/images/. Mirror CMS import paths in folder names to reduce upload errors.
Limitations
When not to use this approach
Conclusion
originals/ + pattern + manifest before batch convert fifty PNGs to WebP.
homepage-hero-1200w.webp beats banner (1).webp when production breaks at 11 PM. Name like someone else will deploy blind.
Git LFS vs committed binaries
Repos exceeding 500 MB image assets — Git LFS with pointer files; CI pulls LFS on build. Filename conventions even more critical when assets distributed across LFS.
Checksum in manifest
Add SHA-256 column to conversion manifest — detect corrupted re-copy. sha256sum Linux, CertUtil -hashfile Windows.
Deprecation workflow
hero-v2.webp active, hero-v1.webp in archive/ — calendar reminder delete v1 from CDN after 90 days if no rollback need.
Worked example: blog image batch
Imagine publishing a post with eight screenshots. Without conventions you get image1.png through image8.png. Six months later, which diagram shows the merge dialog?
Better pipeline:
- Save masters to
originals/blog-merge-guide/ - Crop each in Crop Image
- Export
merge-guide_step-01_upload_800w.webpthroughstep-08_download - Log in
manifest.csvwith source hash and quality setting - Reference in MDX:
When Google Search Console shows an old image URL still indexed, you know exactly which file to replace without renaming guesswork.
Collaboration rules for agencies
Agencies delivering assets to clients should document naming in handoff PDF — one page in deliverables folder NAMING-CONVENTION.md. Client dev teams inherit structure; arguments drop 90%. Include examples of wrong names with red X — humor helps compliance.
Automation pitfalls
Watch folder scripts that auto-convert on drop sometimes fire twice, creating file.webp and file-1.webp. Debounce script or move source to processed/ after conversion. Failed conversions should log error not silent skip — silent skip produces missing images in production build that CI doesn't catch if MDX references wrong path.
Frequently Asked Questions
Common questions answered to help you get the most from this tool.
Vertex Solutions Editorial Team
Guides and articles are produced under this collective byline — not attributed to invented individual experts. We research tool workflows, check steps against live tools where practical, and avoid fabricated personal stories, client anecdotes, or invented test results.
- Content research — Topics come from real tool workflows, common questions, and gaps in existing guides.
- Technical review — Steps, tool behavior, and examples are checked against the live tools on this site before publication when practical.
- Fact checking — Claims about formats, browser behavior, and calculator outputs are verified against documentation and tested sample inputs where practical.
- Updates — Pages may be revised when tools, official guidance, or browser behavior changes. There is no fixed review calendar for every URL.
- Corrections — Report factual errors via Contact.
Full policy: Editorial Standards. Tool checks: How we verify tools.