The Media Library provides centralized asset management for all your site's media files. Upload once, use anywhere - images, videos, audio files, documents, fonts, and icons are organized by type in dedicated tabs. Files maintain their unique identifiers (UUIDs) ensuring references never break, even when moving files between locations. The library supports bulk operations, search functionality, and pagination for efficient browsing. Direct uploads from any page automatically store files in the library for maximum reusability. Each file type has its own optimized display - card layouts for images, list views for documents, and metadata preservation for all formats. The system handles 35+ file formats including modern image formats like WebP, all major video codecs, and web-optimized fonts. Integration with the content management system means selecting media is as simple as browsing and clicking, with instant preview and file information display.
Before Upload: Always compress images!
Use tools like Squoosh.app.
Choosing the right format and optimization level ensures fast loading times while maintaining visual quality. Each format serves specific purposes.
JPEG/JPG - Best for photographs and images with many colors. Use 80-85% quality for optimal balance between file size and visual quality. Typical sizes: 1920px for full-width images, 800-1200px for content images, 400-600px for thumbnails.
PNG - Ideal for logos, icons, and images requiring transparency. Use PNG-8 for simple graphics with few colors, PNG-24 for complex transparencies. Compress using tools like TinyPNG to reduce file sizes by up to 70% without quality loss.
WebP - Modern format offering 25-35% better compression than JPEG/PNG while maintaining quality. Excellent browser support (95%+) makes it the preferred choice for all image types. Provides both lossy and lossless compression options.
SVG - Perfect for icons, logos, and simple graphics. Infinitely scalable without quality loss. File sizes typically under 10KB. Always optimize SVG code to remove unnecessary metadata and comments.
GIF - Reserve for simple animations only. For static images, PNG or WebP provide better quality and compression. Keep animated GIFs under 2MB for acceptable performance.
Videos
MP4 (H.264) - Universal compatibility, best for web delivery. Target bitrates: 2-5 Mbps for 1080p, 1-2 Mbps for 720p. Keep videos under 100MB for smooth streaming.
WebM - Excellent compression with VP9 codec. Provides 30% smaller files than H.264 at same quality.