Fungsi SHTML dan Perbedaannya dengan HTML Biasa

SHTML (Server Side Includes HTML) adalah format file web yang memungkinkan penggunaan instruksi khusus berbasis server sebelum halaman dikirimkan ke peramban pengguna. Fungsi utama SHTML adalah menjalankan perintah Server Side Includes (SSI) seperti menyisipkan konten modular (header, footer, atau navigasi) ke dalam banyak halaman sekaligus tanpa harus mengubahnya satu per satu secara manual.

Meskipun saat ini perannya banyak digantikan oleh bahasa pemrograman server-side seperti PHP, Node.js, atau sistem manajemen konten (CMS) seperti WordPress, SHTML tetap digunakan pada server Apache untuk situs web statis yang memerlukan modularitas ringan tanpa overhead pemrosesan database.

Cara Kerja dan Fungsi Inti SHTML

Ketika pengguna mengakses file ber-ekstensi .shtml, server web (seperti Apache) membaca file tersebut terlebih dahulu. Jika server menemukan direktif SSI di dalamnya—misalnya instruksi untuk memuat file header.html—server akan menggabungkan file tersebut menjadi satu kesekutuan dokumen HTML utuh sebelum merendernya ke layar pengunjung.

Fitur / Aspek HTML Biasa SHTML (SSI)
Ekstensi File .html / .htm .shtml
Pemrosesan Server Tidak ada (langsung dikirim) Dipindai untuk direktif SSI
Modularitas Header/Footer Manual copy-paste per halaman Otomatis via #include
Dukungan Basis Data Tidak Tidak (hanya file lokal & variabel server)
Kecepatan Eksekusi Sangat cepat Cepat (sedikit jeda parsing server)

Sintaks Dasar Direktif SSI dalam SHTML

Perintah SSI ditulis di dalam komentar HTML khusus agar tidak terlihat di peramban pengguna. Berikut adalah sintaks dasar yang paling sering digunakan dalam file SHTML:

<!--#include virtual="/includes/header.html" -->
<h1>Selamat Datang di Situs Kami</h1>
<p>Halaman ini diperbarui terakhir pada: <!--#echo var="LAST_MODIFIED" --></p>
<!--#include virtual="/includes/footer.html" -->

Kelebihan dan Kekurangan SHTML

Sebelum memutuskan menggunakan SHTML untuk proyek web, pertimbangkan parameter teknis berikut:

  • Kelebihan: Efisiensi perawatan kode pada situs web statis, tidak membutuhkan konfigurasi database yang rumit, serta konsumsi sumber daya server yang sangat kecil dibanding PHP.
  • Kekurangan: Tidak mendukung logika pemrograman yang rumit (perulangan tingkat lanjut, fungsi kustom), konfigurasi server Apache harus diaktifkan secara manual (Includes module), dan rentan terhadap masalah keamanan jika direktif SSI dieksploitasi dengan buruk.

Cara Mengaktifkan SSI di Server Apache (.htaccess)

Agar file SHTML berfungsi dengan benar di server berbasis Apache, pastikan modul SSI aktif dan tambahkan baris kode berikut ke dalam file .htaccess Anda:

AddType text/html .shtml
AddHandler server-parsed .shtml
Options +Includes