Alt text (alternative text) adalah deskripsi teks untuk gambar yang membantu search engines dan screen readers memahami konten visual. Penting untuk SEO dan aksesibilitas.
Apa itu Alt Text?
<img src="image.webp" alt="Deskripsi gambar di sini">
Alt text muncul ketika:
– Image gagal load
– Screen reader membaca halaman
– Search engine menganalisis halaman
Kenapa Alt Text Penting?
SEO benefits:
✓ Google Image search ranking
✓ Context untuk search engines
✓ Additional keyword opportunity
✓ Image SEO optimization
Accessibility benefits:
✓ Screen reader support
✓ Visual impairment users
✓ Slow connection fallback
✓ Legal compliance (some countries)
Best Practices Alt Text
1. Be Descriptive but Concise
Ideal length: 125 characters or less
BAD:
alt="image"
alt="photo"
alt=""
GOOD:
alt="Diagram showing SEO keyword research process"
alt="Red running shoes Nike Air Max on white background"
2. Describe What’s in the Image
Focus on:
- Main subject
- Action happening
- Important details
- Context if relevant
Example image: Person typing on laptop
BAD:
alt="person computer"
GOOD:
alt="Freelancer working on SEO audit using laptop at cafe"
3. Include Keywords Naturally
DO:
Include target keyword if relevant
Natural integration
DON'T:
Keyword stuff
Force irrelevant keywords
Example for SEO article:
GOOD: alt="Screenshot of Google Search Console performance report"
BAD: alt="SEO SEO tools SEO software SEO platform"
4. Don’t Start with “Image of” or “Picture of”
Screen readers already announce it's an image
BAD:
alt="Image of a laptop"
alt="Picture of sunset"
GOOD:
alt="MacBook Pro on wooden desk"
alt="Sunset over Jakarta skyline"
5. Context Matters
Same image, different contexts:
For product page:
alt="Nike Air Max 270 running shoes, black and white"
For blog about shoe cleaning:
alt="Dirty running shoes before cleaning process"
For fashion article:
alt="Athletic streetwear look featuring Nike sneakers"
Alt Text untuk Berbagai Image Types
Product Images
Include:
- Product name
- Brand
- Key features
- Color/size if relevant
Example:
alt="iPhone 15 Pro Max 256GB Natural Titanium - front view"
Screenshots
Describe what the screenshot shows:
alt="Google Analytics dashboard showing organic traffic increase"
alt="WordPress plugin settings page for Yoast SEO"
Infographics
Summarize the key information:
alt="Infographic showing 10 steps of SEO audit process"
alt="Statistics chart comparing CPC across industries"
Stock Photos
Describe the scene relevantly to content:
For leadership article:
alt="Business team meeting in modern office"
For remote work article:
alt="Woman working remotely from home office"
Decorative Images
If purely decorative, use empty alt:
alt=""
Or use CSS background instead
Examples of decorative:
- Design elements
- Spacer images
- Background patterns
Logos
For logos:
alt="[Brand Name] logo"
Examples:
alt="Google logo"
alt="Nike swoosh logo"
Charts and Graphs
Describe the data/conclusion:
alt="Bar chart showing SEO traffic growth 200% year over year"
alt="Pie chart of traffic sources: organic 60%, direct 25%, social 15%"
Common Mistakes
❌ Empty alt text on important images
❌ "Image" or "Photo" as alt text
❌ Keyword stuffing
❌ Too long (over 125 chars)
❌ Not describing actual image
❌ Same alt text for all images
❌ Ignoring context
Alt Text Audit
Finding Missing Alt Text
Tools:
1. Screaming Frog
- Images > Missing Alt Text
2. Browser extensions
- Web Developer Toolbar
- SEO Meta in 1 Click
3. Google Search Console
- May flag as issue
Audit Process
1. Crawl website
2. Export images without alt
3. Prioritize by importance
4. Write alt text for each
5. Update in CMS/code
6. Verify implementation
Alt Text Template
Product: [Brand] [Product Name] [Key Feature] [Color/Variant]
Person: [Who] [Action] [Location/Context]
Screenshot: [App/Tool] [Feature/Page] showing [Key Info]
Chart: [Chart Type] showing [Data Summary]
Location: [Place/Scene] [Notable Features]
Checklist Alt Text
For every image:
☐ Is it descriptive?
☐ Under 125 characters?
☐ Includes relevant keyword (naturally)?
☐ No "image of" prefix?
☐ Matches image content?
☐ Provides context?
☐ Unique (not copy-paste)?
For decorative images:
☐ Empty alt="" or CSS background
Kesimpulan
Alt text adalah small but important SEO element. Luangkan waktu untuk menulis alt text yang deskriptif dan natural – ini membantu SEO sekaligus membuat website lebih accessible.
Ditulis oleh
Hendra Wijaya
Artikel Sebelumnya
Cara Meningkatkan Page Speed Website untuk SEO
Artikel Selanjutnya
Cara Menulis Content SEO Friendly: Panduan Lengkap