Web Development

Panduan Markdown untuk Menulis Artikel Blog yang Rapi

Belajar Markdown dari heading, tautan, gambar, daftar, dan code block hingga frontmatter agar artikel blog mudah dibaca serta konsisten.

KKXID Editorial··3 menit baca
Ilustrasi sampul artikel Panduan Markdown untuk Menulis Artikel Blog yang Rapi dengan desain teknologi KKXID
On This Page — Daftar Isi

Panduan Markdown untuk Menulis Artikel Blog yang Rapi

Ada sesuatu yang menyenangkan dari menulis tanpa harus mengatur ukuran font setiap beberapa menit. Markdown membiarkan kita fokus pada struktur tulisan. Judul tetap judul, daftar tetap daftar, dan potongan kode bisa dibedakan tanpa membuka menu formatting yang panjang.

Untuk blog seperti KKXID, Markdown juga praktis karena setiap artikel hanyalah file teks yang bisa ditinjau melalui Git.

Mulai dari heading yang jelas

Markdown memakai tanda pagar untuk heading:

# Judul utama
## Bagian besar
### Subbagian

Pada template blog, judul utama biasanya berasal dari frontmatter dan ditampilkan sebagai H1. Karena itu, isi artikel cukup dimulai dari H2. Jangan memilih heading berdasarkan ukuran huruf yang paling menarik; gunakan sesuai urutan gagasan.

Untuk membuat teks tebal, gunakan **teks**. Untuk miring, pakai *teks*. Tautan memiliki bentuk [teks tautan](https://example.com).

Tautan yang bagus menjelaskan tujuan, bukan sekadar “klik di sini”. Misalnya, “baca dokumentasi resmi Astro” lebih informatif daripada “baca selengkapnya” di tengah paragraf.

Membuat daftar dan langkah kerja

Gunakan - untuk daftar tanpa urutan dan angka untuk proses yang harus dilakukan secara bertahap. Jika langkah membutuhkan hasil pemeriksaan, jelaskan dulu apa yang seharusnya terlihat sebelum melanjutkan ke langkah berikutnya.

Jangan menyatukan semua perintah dalam satu blok besar tanpa konteks. Pembaca perlu tahu perintah dijalankan di mana, apa yang diubah, dan bagaimana mengecek hasilnya.

Code block dengan nama bahasa

Potongan kode paling mudah dibaca bila ditulis di antara tiga backtick dan diberi nama bahasa seperti bash, html, atau typescript.

```bash
npm run build
```

Penanda bahasa membantu syntax highlighting bekerja lebih baik. Untuk perintah yang berisiko menghapus data, tambahkan peringatan sebelum code block, bukan setelahnya.

Menambahkan gambar secara benar

Bentuk dasar gambar:

![Deskripsi singkat gambar](./gambar.png)

Teks dalam tanda kurung siku menjadi alt text. Deskripsikan informasi penting dari gambar; jangan menjejali kata kunci SEO. Untuk thumbnail artikel, gunakan gambar rasio konsisten dan kompresi yang memadai agar halaman tidak berat.

Apa itu frontmatter?

Frontmatter adalah metadata di bagian awal artikel yang dibatasi ---:

---
title: "Panduan Menulis Markdown"
description: "Belajar membuat artikel terstruktur dengan Markdown."
pubDate: 2026-10-13
category: web-development
tags: [Markdown, Astro]
---

Field yang tersedia bergantung pada schema situs. Jika sebuah proyek mewajibkan gambar cover, jangan lupa mengisinya. Validasi frontmatter membantu mencegah artikel terbit tanpa judul atau metadata penting.

Sunting sedikit, pratinjau, lalu cek hasilnya

Setelah menulis, jalankan server development dan periksa tampilan. Pastikan blok kode tidak keluar dari layar ponsel, link bekerja, dan heading mudah dinavigasi melalui daftar isi.

Markdown memang sederhana, tetapi kebiasaan editorial tetap menentukan hasil akhirnya. Tulisan dengan struktur jelas akan lebih mudah dipahami manusia dan lebih mudah dipelihara ketika artikelnya bertambah banyak.

Bacaan dan sumber lanjutan

Artikel terkait

Diskusi & komentar

Komentar menggunakan GitHub Discussions. Untuk menulis komentar, masuk menggunakan akun GitHub kamu. Jaga diskusi tetap sopan dan sesuai topik.

Komentar melalui GitHub sedang disiapkan. Diskusi akan tersedia setelah repositori GitHub Discussions dihubungkan.