Semua proyek
Konten dan SEO

Blog Artikel dengan Rumus dan Ilustrasi

Blog edukasi berbasis MDX dengan rumus matematika yang tajam, ilustrasi vektor, daftar isi, RSS, dan ajakan bertindak di akhir artikel.

Status
Sudah berjalan
Lapisan
FrontendOtomasi
Dipakai oleh
Siswa, orang tua, dan guru yang mencari penjelasan topik matematika lewat Google.
Artikel blog Numekara tentang volume dan luas permukaan bangun ruang dengan daftar isi
Tangkapan layar

Masalahnya

Artikel bermuatan rumus sering tampil sebagai gambar buram atau teks rusak, sehingga sulit dibaca dan kurang disukai mesin pencari.

Solusinya

Rumus dirender sebagai teks dengan KaTeX, ilustrasi dibuat dari sumber TikZ menjadi SVG, dan gambar sampul dibuat otomatis. Setiap artikel ditutup dengan ajakan ke latihan, course, atau konsultasi.

Cara kerjanya

Apa yang terjadi, langkah demi langkah, dari sudut pandang pengguna.

  1. 01

    Penulis menulis artikel MDX

    Artikel ditulis sebagai teks biasa dengan rumus di dalamnya, lalu disimpan bersama kode website.

  2. 02

    Ilustrasi digambar dari kode

    Gambar seperti grafik dan bangun datar ditulis dalam TikZ, lalu skrip mengubahnya menjadi SVG yang tajam.

  3. 03

    Sampul dibuat otomatis

    Skrip membuat gambar sampul berisi judul dan ilustrasi utama, yang dipakai saat artikel dibagikan.

  4. 04

    Pembaca membuka artikel

    Rumus tampil sebagai teks tajam lewat KaTeX, lengkap dengan daftar isi untuk melompat ke bagian tertentu.

  5. 05

    Ajakan sesuai topik

    Setiap artikel ditutup dengan ajakan yang cocok: ikut les, latihan mandiri, atau konsultasi gratis bila belum ada produk yang sesuai.

Desain sistemnya

Siapa yang memakai, apa yang mereka lihat, apa yang bekerja di belakang layar, dan di mana data disimpan. Baca dari kiri ke kanan.

  1. 1Pengguna

    • PenulisMenulis artikel dan sumber gambarnya.
    • PembacaDatang dari Google, media sosial, atau RSS.
  2. 2Yang dilihat

    • Daftar artikelKartu artikel dengan sampul dan kategori.
    • Halaman artikelRumus, ilustrasi, daftar isi, dan ajakan penutup.
  3. 3Yang bekerja di belakang

    • Pengolah MDXMengubah teks artikel menjadi halaman; rumusnya dirender KaTeX.
    • Skrip gambarMengubah TikZ menjadi SVG dan membuat gambar sampul.
  4. 4Tempat data disimpan

    • Folder artikel35 artikel MDX tersimpan bersama kode website.
    • Umpan RSSDaftar artikel terbaru untuk aplikasi pembaca berita.

Fitur utama

  • Rumus tajam dengan KaTeX
  • Ilustrasi SVG dari TikZ
  • Daftar isi otomatis
  • Umpan RSS
  • Ajakan bertindak per topik

Dibangun dengan

  • Next.js
  • MDX
  • KaTeX
  • LaTeX
  • TikZ

Angka yang bisa dibuktikan

35
Artikel MDX

Yang didapat bisnis

  • Rumus tetap tajam dan mudah dibaca di HP.
  • Halaman lebih ramah mesin pencari karena rumus berupa teks, bukan gambar buram.
  • Setiap artikel mengarahkan pembaca ke langkah berikutnya yang relevan.
  • Gambar sampul untuk media sosial tidak perlu didesain manual.

Istilah di halaman ini

MDX
Format teks seperti dokumen biasa yang bisa disisipi komponen website, misalnya kotak rumus.
KaTeX
Alat yang menampilkan rumus matematika sebagai teks tajam di browser.
TikZ
Bahasa untuk menggambar ilustrasi matematika lewat perintah teks.
SVG
Format gambar berbasis garis yang tetap tajam saat diperbesar.

Bisa dipakai untuk bisnis Anda?

Untuk bisnis teknis, pendidikan, atau keuangan yang butuh blog SEO dengan rumus, tabel, dan diagram yang tetap rapi.

Konsultasikan proyek ini