Favicon Nginx Configuration Guide

# Nginx Favicon Configuration
# Add to your nginx.conf or site-specific config file

server {
    listen 80;
    listen [::]:80;
    server_name yourdomain.com;

    # Root directory
    root /var/www/html;
    index index.html;

    # ============================================
    # FAVICON CONFIGURATION
    # ============================================

    # 1. Favicon.ico (legacy support)
    location = /favicon.ico {
        alias /var/www/html/favicon.ico;
        access_log off;
        log_not_found off;
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # 2. All favicon files in root
    location ~* ^/(favicon-16x16\.png|favicon-32x32\.png|favicon-96x96\.png|favicon-512x512\.png|apple-touch-icon\.png|android-chrome-.*\.png|site\.webmanifest|browserconfig\.xml)$ {
        access_log off;
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # 3. Dedicated favicons folder (optional)
    location /favicons/ {
        access_log off;
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # 4. SVG favicons
    location ~* \.svg$ {
        add_header Content-Type image/svg+xml;
        access_log off;
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # ============================================
    # COMPRESSION
    # ============================================

    # Gzip compression
    gzip on;
    gzip_vary on;
    gzip_min_length 256;
    gzip_proxied any;
    gzip_comp_level 6;
    gzip_types
        image/svg+xml
        image/x-icon
        application/manifest+json
        application/xml;

    # Brotli compression (if module installed)
    # brotli on;
    # brotli_comp_level 6;
    # brotli_types
    #     image/svg+xml
    #     image/x-icon
    #     application/manifest+json;

    # ============================================
    # MIME TYPES
    # ============================================

    # Ensure correct MIME types
    types {
        image/x-icon                  ico;
        image/png                     png;
        image/svg+xml                 svg svgz;
        application/manifest+json     webmanifest;
        application/xml               xml;
    }

    # ============================================
    # SECURITY HEADERS
    # ============================================

    # Add security headers for favicon files
    location ~* \.(ico|png|svg|webmanifest|xml)$ {
        add_header X-Content-Type-Options "nosniff" always;
        add_header X-Frame-Options "SAMEORIGIN" always;
    }

    # ============================================
    # ERROR HANDLING
    # ============================================

    # Don't log 404 for missing favicons
    location ~ ^/(apple-touch-icon|android-chrome|mstile).*\.(png|ico)$ {
        access_log off;
        log_not_found off;
        return 404;
    }

    # Rest of your configuration...
    location / {
        try_files $uri $uri/ =404;
    }
}