🌐
Hack the Web
  • Welcome to Hack the Web
  • Getting Started
    • 🔥Course Overview
    • Why This is Important
    • 🛠️What We Will Build
  • Build with the Basics
    • Build with the Basics
    • HTML
    • CSS
    • JavaScript
    • 💥Putting it all together
    • Design Systems and CSS Frameworks
  • Design Basics
    • What Makes Good Design
    • 🏳️‍🌈Colors, Colors, Colors
    • 🔡Typography and Fonts
    • 🌀Graphics for Your Site
      • Types of Images
      • Where to Find Graphics
      • Image Formats
      • Other Media Formats
    • 🦄Icons
  • Don't Start From Scratch
    • ▶️Template Walkthrough
  • Misc Topics
    • Search Engine Optimization
    • ⭐Favicons
    • ☑️HTML & CSS Validation
    • 📊Performance Testing
    • Markdown
    • Mobile Responsive Design
  • Advanced Topics
    • Hosting Sites
    • ↔️Backend vs Frontend Development
    • ⚙️Browser Built-In Web Tools
  • Real-World Applications
    • 💼Career Paths in Web Design
    • Wordpress, Drupal, Website Builders
  • Conclusion
    • 🎉Course Recap
    • 📝Quiz for Certificate
    • 🦉Keep on Learning
  • SouthHills Info Request
Powered by GitBook
On this page
  1. Design Basics
  2. Graphics for Your Site

Image Formats

Image Formats Commonly Used

JPG (JPEG): A commonly used format with lossy compression, ideal for photographs and images with gradients, but may lose quality during editing due to compression.

HEIC: A format used by Apple, employing advanced compression, providing better image quality and smaller file sizes compared to JPG. Not universally supported across all platforms.

PNG: Supports lossless compression with transparency features, making it excellent for graphics and images requiring sharp edges, but usually results in larger file sizes.

WEBP: Designed by Google, it offers both lossy and lossless compression with smaller file sizes for web use, but may not be compatible with all browsers and tools.

SVG: A vector format ideal for logos and icons that require scaling without losing quality. Useful for illustrations, not suitable for complex images like photographs.

PreviousWhere to Find GraphicsNextOther Media Formats

Last updated 6 months ago

🌀