Gambar yang tidak dioptimasi bisa memperlambat website hingga 80%. Image SEO adalah bagian penting dari technical dan on-page SEO.
Kenapa Image SEO Penting?
Impact of Image Optimization:
✓ Page speed improvement: 40-80%
✓ Google Images traffic: 20-30% potential
✓ User experience: Better engagement
✓ Core Web Vitals: Better LCP score
Langkah-Langkah Optimasi Gambar
1. Pilih Format yang Tepat
| Format | Best For | Compression |
|---|---|---|
| WebP | All-purpose | Terbaik |
| AVIF | Modern browsers | Lebih baik |
| JPEG | Photos | Good |
| PNG | Transparent | Larger |
| SVG | Icons/logos | Vector |
Rekomendasi: Gunakan WebP sebagai default
2. Compress Images
Tools gratis:
– Squoosh.app – Browser-based
– TinyPNG – PNG/JPEG
– ImageOptim – Mac
– ShortPixel – WordPress plugin
Target size:
– Hero images: < 200KB
– Content images: < 100KB
– Thumbnails: < 30KB
3. Resize Sebelum Upload
Jangan upload gambar 4000x3000px untuk ditampilkan 800x600px
Best practice:
- Upload sesuai display size
- Gunakan srcset untuk responsive
- Max width: 2000px (untuk retina)
4. Tulis Alt Text Deskriptif
<!-- Buruk -->
<img alt="image1" src="...">
<img alt="gambar" src="...">
<img alt="" src="...">
<!-- Baik -->
<img alt="Cara optimasi gambar untuk SEO - screenshot dashboard" src="...">
<img alt="Diagram proses image compression" src="...">
Tips alt text:
– Deskriptif tapi concise
– Include keyword naturally
– Max 125 karakter
– Describe image content
5. Gunakan Descriptive Filename
❌ IMG_20260107.jpg
❌ photo123.png
❌ untitled.webp
✓ cara-optimasi-gambar-seo.webp
✓ image-compression-comparison.webp
✓ webp-vs-jpeg-quality.webp
6. Implement Lazy Loading
<img src="image.webp" loading="lazy" alt="Description">
Benefits:
– Faster initial load
– Reduced bandwidth
– Better Core Web Vitals
7. Responsive Images dengan Srcset
<img
src="image-800.webp"
srcset="image-400.webp 400w,
image-800.webp 800w,
image-1200.webp 1200w"
sizes="(max-width: 600px) 400px,
(max-width: 1200px) 800px,
1200px"
alt="Responsive image example">
8. Gunakan CDN untuk Images
CDN benefits:
– Faster delivery
– Global coverage
– Automatic optimization
– Format conversion
Popular CDNs:
– Cloudflare Images
– Imgix
– Cloudinary
– BunnyCDN
9. Add Width and Height
<!-- Mencegah layout shift (CLS) -->
<img
src="image.webp"
width="800"
height="600"
alt="Description">
10. Image Sitemap
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:image="http://www.google.com/schemas/sitemap-image/1.1">
<url>
<loc>https://example.com/page</loc>
<image:image>
<image:loc>https://example.com/image.webp</image:loc>
<image:title>Image title</image:title>
</image:image>
</url>
</urlset>
Checklist Image SEO
Pre-Upload:
☐ Resize to display dimensions
☐ Compress (target <100KB)
☐ Convert to WebP
☐ Rename with descriptive filename
On-Page:
☐ Add descriptive alt text
☐ Include width/height attributes
☐ Implement lazy loading
☐ Use responsive srcset
Technical:
☐ Enable browser caching
☐ Use CDN if possible
☐ Submit image sitemap
☐ Check Core Web Vitals
Tools untuk Image SEO Audit
- Google PageSpeed Insights – Image recommendations
- Lighthouse – Image audit
- Screaming Frog – Find missing alt text
- WebPageTest – Image loading analysis
Kesimpulan
Image SEO adalah low-hanging fruit yang sering diabaikan. Dengan optimasi yang tepat, Anda bisa:
– Meningkatkan page speed 40-80%
– Mendapat traffic dari Google Images
– Improve user experience
– Better Core Web Vitals score
Ditulis oleh
Hendra Wijaya