Lack of Image Optimization and Modern Format Support

[codeCraft-Ritik]

Summary :

The project currently uses standard .jpg and .png files without explicit dimensions or modern format fallbacks, leading to slower page loads and "Layout Shift" (CLS).

Detailed Description :

The Problem: High-resolution images (like the hero banner and course thumbnails) are currently loaded in legacy formats. This increases the "Initial Page Load" time, especially for users on mobile devices or slower networks. Additionally, without width and height attributes, the layout "jumps" as images load.

Proposed Solution :

• Convert existing assets to WebP or AVIF formats to reduce file size by up to 30-50% without losing quality.
• Implement the tag to provide fallbacks for older browsers.
• Add loading="lazy" to images below the fold to prioritize the "above-the-fold" content.

Impact : This will significantly improve the Google Lighthouse performance score and provide a smoother experience for mobile users.