Membuat Template Halaman Web Sederhana

Melamun, merenung disinggasana kamarku eeh terlintas di benakku  akan halaman blog yang kagak pernah aku update untuk posting artikel terbaru ..berfikir dan berfikir kali ini aku mau posting apaya..? disaat asik terbuai dengan alam fikiranku eh tiba-tiba aku dikejutkan oleh seorang teman yang tiba-tiba datang...seketika itupun lamunanku buyar..dan kami mulai ngobrol..eh ternyata temanku butuh bantuan untuk dibuatkan template web sederhana, dan akhirnya terlintas difikiranku sekalian aja buat posting blogku...

Ok tanpa berbasa-basi lagi untuk kali ini ane mau posting tutorial cara membuat template halaman web sederhana mengunakan Dreamweaver CS5 dan Xampp 1.7.3 dimana halaman web ini meliputi halaman frontend saja...saya asumsikan teman-teman sudah mengistal adobe dreamweaver CS5 dan Xampp sebagai servernya jika belum teman-teman bisa mendownload dreamweavernya disini dan Xampp disini dan jika semua peralatan tempur sudah dipersiapkan kita berangkat ke medan perang *hehe gila emang prajurit* Ok berikut langkah-langkahnya :

1. Buka aplikasi dreamweaver anda kemudian pilih menu site → new site isi seperti apa yang terlihat pada gambar dimana C merupakan tempat aplikasi Xampp terinstal dan htdocs merupakan tempat mengelola seluruh project kita nantinya ( buat folder tutorial didalam folder htdocs ) :




2. Kemudian klik pada server isikan sesuai dengan apa yang terlihat pada gambar berikut :




3. Lalu klik simpan dan akan tampil gambar sebagai berikut klik sekali lagi tombol simpan




4. Jika Berhasil Pada Sebelah kanan akan terlihat site baru dengan nama tutorial seperti terlihat pada gambar




5. Sekarang sobat sudah memiliki site dimana nantinya semua file project akan disimpan disana untuk langkah selanjutnya seperti yang terlihat pada gambar diatas klik pada create new→PHP simpan dengan nama index.php seperti yang terlihat pada gambar dibawah ini :




6. Buat file baru dengan type Css klik File→New→Css dan simpan dengan nama style.css, kemudian buka file index.php copykan script dibawah ini dan simpan kembali




7. Buka file Css yang sudah sobat simpan kemudian copy script berikut ini :




8. Nah sekarang coba sobat jalankan melalui browser sobat, pada tab browser ketikan localhost/tutorial/indek.php dan jika berhasil maka tampilannya akan terlihat seperti gambar berikut :

Ok sekian dulu tutorial kali ini semoga bermamfaat...tunggu postingan selanjutnya pada seri membuat template halaman web sederhana Part 2..selamat mencoba