HanNajib / notes, works, til & snaps

← Kembali ke Beranda
til / 26 Mei 2026 / 2 min read / 0 views

Menerapkan SEO Terstruktur pada Astro

Hari ini saya ingin merangkum bagaimana arsitektur SEO (Search Engine Optimization) modern diterapkan secara efisien pada website ini menggunakan Astro.

SEO yang berkualitas tinggi bukan hanya tentang penempatan kata kunci, melainkan harmonisasi performa situs (Lighthouse > 95) dan kejelasan data terstruktur untuk mesin pencari.

Ada 4 pilar utama SEO yang berhasil diintegrasikan ke dalam basis kode kita:

1. Dinamis Meta & Open Graph (OG) Tags

Di dalam src/layouts/Layout.astro, meta tags dikonfigurasi secara dinamis untuk mendukung rich sharing preview di platform sosial seperti WhatsApp, X/Twitter, dan Discord:

  1. Canonical URL: Mencegah masalah konten duplikat (duplicate content) dengan secara otomatis mencocokkan Astro.url.pathname dengan domain utama.
  2. Twitter & OG Meta: Menyediakan visual preview premium secara dinamis menggunakan judul artikel, deskripsi, dan gambar cover yang disesuaikan per artikel.

2. JSON-LD Structured Data (BlogPosting)

Untuk membantu mesin pencari seperti Google memahami struktur artikel kita secara mendalam dan mendetail, kita menyisipkan skema data terstruktur (Structured Data) berupa JSON-LD di dalam src/pages/[category]/[slug].astro.

Berikut skema minimal yang digunakan secara dinamis:

{
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": "post.title",
"description": "seoDescription",
"image": ["seoImage"],
"datePublished": "post.created_at",
"author": {
"@type": "Person",
"name": "Ahmad Royhan Najib (Han Najib)",
"url": "https://blog.hannajib.my.id"
}
}

Ini membuat artikel di blog kita memiliki kesempatan tinggi muncul dengan Rich Snippets menarik di halaman hasil pencarian.

3. Kontrol Crawling (robots.txt) & Sitemap Otomatis

  1. Sitemap: Menggunakan integrasi @astrojs/sitemap di dalam astro.config.mjs untuk mengindeks halaman-halaman publik secara berkala dan otomatis tanpa intervensi manual.
  2. Robots.txt: Menentukan rute yang boleh dirayapi. Rute sensitif seperti dashboard admin (/admin/*) dan /api/ secara eksplisit diblokir dari bot crawler menggunakan instruksi Disallow untuk keamanan.

4. Performa Kecepatan Tinggi (Hybrid SSG/SSR)

Kecepatan situs adalah salah satu faktor krusial dalam ranking SEO terbaru Core Web Vitals. Website ini memadukan Static Site Generation (SSG) untuk halaman detail artikel dengan cara mendeklarasikan export const prerender = true pada file [slug].astro. Ini membuat waktu pemuatan halaman (FCP - First Contentful Paint) sangat instan!


Hasil Tes Performa Web Ini Di Lighthouse

Diskusi