Jumat, 20 April 2012

SITEBIKE

          SITEBIKE merupakan sebuah halaman website yang didesain khusus untuk para pecinta motor. Di dalam halaman website ini terdapat artikel yang membahas tentang motor - motor yang spesial (lain dari pada yang lain). Dijelaskanjuga spesifikasi dan harga jual di pasaran dari motor - motor tersebut. Pada kesempatan ini saya akan menjelaskan langkah pembuatan website sederhana SITEBIKE ini.

Langkah 1 : SIAPKAN BACKGROUND

          Tentukan gambar yang akan dijadikan background dari halaman website yang diinginkan. Usahakan cari background yang menggambarkan dan mewakili isi dari halaman website tersebut. Gambar tersebut dapat didapat dari hasil buatan tangan sendiri (dengan photoshop) atau juga dapat dengan mendownload template gratis yang sudah tersedia di dunia maya.


          Setelah mengalami proses Slicing dengan slice tool (untuk menciptakan field tempat meletakan text dan link-link yang akan dipakai nanti), selanjutnya simpan file photoshop ini ke dalam bentuk html dengan klik menu file > Save for Web & Devices dengan nama index.html

Langkah 2 : ISI FIELD PADA BACKGROUND DENGAN BANTUAN DREAMWEAVER

          Setelah file index.html telah tersimpan, selanjutnya buka file tersebut dengan software DreamWeaverCS5. Setelah jendela design dari halaman index.html telah terlihat, langkah berikutnya ialah isi field - field yang dibutuhkan untuk teks dan link. Teks apa saja yang ingin dituliskan dan link apa saja yang dibutuhkan adalah 2 hal yang sudah seharusnya dipikirkan terlebih dahulu agar website yang diciptakan menjadi sebuah halaman yang cukup efisien dalam hal waktu pembuatan.

          Setelah field - field yang adatelah diisi dengan teks dan link, maka selanjutnya simpan halaman index.html ini kembali. Setelah file index.html telah di save, maka mulailah buat halaman - halaman yang tercantum pada menu (HOME, ARTIKEL, BLOG, dan CONTACT).
           => HOME mengarah pada index.html
           => ARTIKEL mengarah pada artikel.html
           => BLOG mengarah pada halaman blog dari Yonathan Eleazar
           => CONTACT mengarah pada halaman contact.html
          Artikel.html dan contact.html dibuat berdasarkan background yang sudah ada, hanya pada bagian postingannya saja yang diganti dengan artikel - artikel tentang motor. Setelah itu file index.html di save as dengan nama artikel.html untuk halaman yang berisikan artikel - artikel motor yang disediakan. dan file index.html juga di save as dengan nama contact.html untuk halaman yang berisikan keterangan dari Yonathan Eleazar. Total file .html yang terbentuk dalam pembuatan halaman website ini adalah 11 file. dan semuanya itu haruslah diletakkan dalam 1 direktori / folder.

Langkah 3 : KAITKAN HALAMAN INDEX DENGAN HALAMAN LAINNYA

         Setiap artikel yang telah dibuat dalam format .html harus dikaitkan dengan halaman artikel.html. Setelah dikaitkan (dengan membuat link) dengan halaman artikel.html, maka setiap artikel dapat diakses dari halaman artikel.html. 
       Untuk mencoba halaman website baru ini, bukalah file index.html dengan firefox atau browser lainnya.

 -------------------------------------------------------------------------------------------
 -------------------------------------------------------------------------------------------
 ------------------------------------------------------------------------------------------