Cara Kerja SHTML: Pengertian, SSI, dan Perbedaannya dengan HTML

SHTML (Server Side HTML) adalah format file HTML yang diproses oleh server web menggunakan teknologi Server Side Includes (SSI) sebelum dikirim ke peramban pengguna. Tidak seperti file HTML biasa yang dikirim apa adanya, server membaca perintah SSI di dalam file SHTML—seperti menyisipkan navigasi atau footer dari file terpisah—sehingga memudahkan pemeliharaan situs web tanpa memerlukan bahasa pemrograman backend yang kompleks seperti PHP.

Mekanisme inti dari SHTML terletak pada instruksi pra-pemrosesan server (server-side pre-processing). Saat peramban meminta halaman berekstensi .shtml, server web (seperti Apache atau Nginx) memindai file tersebut untuk mencari direktif khusus SSI. Setelah direktif tersebut dieksekusi dan digabungkan dengan konten utama, hasil akhirnya berupa file HTML murni yang kemudian dirender oleh browser pengunjung.

Tabel Perbandingan SHTML, HTML, dan PHP

Fitur HTML (.html) SHTML (.shtml) PHP (.php)
Pemrosesan Server Tidak ada (statis murni) Ya (melalui SSI) Ya (eksekusi skrip penuh)
Kebutuhan Database Tidak ada Tidak ada Sangat umum (MySQL, dll)
Kompleksitas Sangat rendah Rendah Sedang hingga tinggi
Penggunaan Utama Halaman tunggal/landing page Situs kecil dengan elemen berulang Aplikasi web dinamis, CMS

Sintaks Dasar dan Contoh Perintah SSI

Perintah SSI dituliskan di dalam komentar HTML khusus yang dikenali oleh server web. Direktif paling umum adalah #include untuk menyisipkan file eksternal seperti menu navigasi atau hak cipta kaki halaman.

<!--#include virtual="/header.html" -->
<h1>Selamat Datang di Website Kami</h1>
<p>Ini adalah konten utama halaman SHTML.</p>
<!--#include virtual="/footer.html" -->

Selain #include, terdapat beberapa direktif SSI lain yang sering digunakan untuk menampilkan informasi dinamis sederhana:

  • <!--#echo var="DATE_LOCAL" -->: Menampilkan tanggal dan waktu lokal saat ini dari server.
  • <!--#flastmod file="index.shtml" -->: Menampilkan tanggal terakhir file tersebut dimodifikasi.
  • <!--#printenv -->: Menampilkan variabel lingkungan server (biasanya untuk debugging).

Langkah-Langkah Mengaktifkan SHTML di Server Apache

Agar server web mengenali dan memproses file SHTML, modul SSI harus diaktifkan pada konfigurasi server (misalnya melalui file .htaccess atau httpd.conf).

  1. Buka atau buat file .htaccess di direktori root situs web Anda.
  2. Tambahkan baris kode untuk mengaktifkan handler dan filter SSI:
    AddType text/html .shtml
    AddHandler server-parsed .shtml
    Options +Includes
  3. Simpan file dan unggah ke server hosting Anda.
  4. Uji file SHTML dengan menyertakan perintah SSI sederhana untuk memastikan server memprosesnya dengan benar.

Kelebihan dan Kekurangan Penggunaan SHTML

Meskipun sudah jarang digunakan pada situs web modern berbasis CMS seperti WordPress, SHTML memiliki keunggulan spesifik untuk kebutuhan tertentu:

  • Kelebihan: Sangat ringan karena tidak memerlukan parsing database, aman dari kerentanan injeksi basis data, dan memudahkan pembaruan elemen berulang (seperti menu) tanpa harus mengubah ratusan halaman secara manual.
  • Kekurangan: Kurang fleksibel dibanding bahasa skrip seperti PHP, membebani CPU server jika terlalu banyak file yang harus diparsing secara bersamaan pada lalu lintas tinggi, dan tidak mendukung logika pemrograman tingkat lanjut (kondisional kompleks atau perulangan array).