Web · Live
Company Profile Dapur Sekar
Contoh website company profile satu halaman untuk usaha kecil, dari perkenalan dan daftar harga sampai tombol pesan.
Nilai jual
Yang membuatnya menonjol.
Pengunjung langsung tahu apa yang dijual
Pesan utama, paket, dan harga terlihat tanpa harus mencari. Tombol pesan selalu ada di bagian atas halaman.
Nyaman dibuka dari ponsel
Tata letak menyesuaikan lebar layar, dari ponsel sampai desktop, tanpa gulir menyamping.
Ringan dan cepat
Satu berkas HTML dengan CSS di dalamnya, tanpa library, dengan foto yang sudah dikompresi, sehingga cepat dimuat di koneksi lambat.
Bisa dilihat sebelum memesan
Contohnya live dan dapat dibuka di halaman demo, sehingga calon klien tahu bentuk yang akan mereka terima.
Masalahnya
Banyak usaha kecil hanya punya akun media sosial. Calon pelanggan sulit menemukan daftar harga, jam buka, dan cara memesan di satu tempat, dan usaha itu tidak muncul ketika dicari di Google.
Untuk siapa
Pemilik usaha kecil dan pengusaha pemula yang butuh kehadiran online pertama, dan calon klien Aufal Tech yang ingin melihat contoh hasil paket Rintisan.
Fitur utama
Delapan bagian siap isi
Pembuka, tentang usaha, paket dan harga, galeri, cara pesan, ulasan pelanggan, kontak, dan footer.
Daftar paket dengan harga
Tiap paket punya harga, isi, dan tombol pesan sendiri, sehingga pengunjung tidak perlu bertanya dulu.
Navigasi dalam halaman
Menu melompat ke bagian yang dituju dengan gulir halus, dan header tetap terlihat saat halaman digulir.
Kontak lengkap
Nomor WhatsApp, alamat, jam buka, dan tempat untuk peta lokasi berada di satu bagian.
Menghormati preferensi gerak
Animasi dimatikan bagi pengunjung yang mengaktifkan pengaturan kurangi gerakan di perangkatnya.
Pendekatan yang sama bisa diadaptasi untuk
- Website profil untuk katering, bengkel, laundry, klinik, atau toko
- Landing page untuk satu produk atau jasa
- Katalog harga sederhana dengan tombol pesan WhatsApp
Arsitektur
Website ini sengaja dibuat sesederhana mungkin: satu berkas HTML statis dengan CSS di dalamnya. Tidak ada framework, tidak ada JavaScript, dan tidak ada proses build. Berkasnya disajikan langsung sebagai aset statis.
Untuk usaha kecil, pilihan ini berarti biaya hosting yang sangat rendah dan hampir tidak ada yang perlu dipelihara.
Detail implementasi
Tata letak tanpa breakpoint berlapis. Grid memakai auto-fit dan minmax, dan ukuran judul memakai clamp, sehingga halaman menyesuaikan lebar layar dengan sangat sedikit aturan khusus ponsel.
Warna lewat variabel. Seluruh palet didefinisikan sebagai variabel CSS di satu tempat, sehingga mengganti warna merek cukup mengubah beberapa baris.
Foto yang ringan. Lima foto di bagian pembuka dan galeri dikompresi ke WebP, totalnya sekitar 400 KB. Fotonya ilustrasi buatan AI dan diberi keterangan di halaman. Pada website klien, bagian ini diganti foto produk asli.
Tidak diindeks mesin pencari. Karena usahanya fiktif, halaman contoh diberi tanda noindex agar tidak muncul di hasil pencarian.
Batasan contoh ini
Dapur Sekar bukan klien dan bukan usaha nyata. Tombol pesan di dalam contoh tidak mengirim apa pun; pada website klien, tombol itu membuka WhatsApp usaha tersebut. Contoh ini hanya tersedia dalam bahasa Indonesia.
Yang bisa diverifikasi
- Ter-deploy dan dapat diakses publik.
- Seluruh halaman adalah satu berkas HTML tanpa JavaScript dan tanpa dependensi.
Tangkapan layar
