Homepage merupakan halaman muka dari sebuah situs web. Pengertian lainnya adalah halaman default yang diset untuk sebuah browser. halaman ini ditayangan di Internet melalui media World Wide Web(www). Biasa digunakan orang untuk mempromosikan informasi, jasa, produk-produknya, dll.
A. Ada beberapa hal yang perlu kita perhatikan dalam pembuatan homepage yaitu:
1. Tujuan dibuatnya Homepage, misal kita akan membuat homepage untuk mahasiswa kelas A091.
2. Siapa yang menjadi target utama untuk melihat homepage yang kita buat. Misal yang menjadi target utama untuk melihat dan megakses adalah teman-teman di Stikom Bali dari semester pertama sampai semester akhir.
3. Klasifikasikan informasi yang akan ditampilkan dalam homepage.
4. Hasil klasifikasi tersebut akan mewakili satu halaman homepage sedangkan hasil klasifikasi yang lain akan ditampilkan sebagai hyperlink yang akan ditampilkan pada saat pengguna mengakses link tersebut.
B. Perangkat lunak untuk membuat homepage tersebut adalah sbb:
1. Browzer (seperti internet explorer, mozila firefox, google chrome, opera, netscape navigator, mozaic, dll).
2. HTML(Hyper Text Markup Language) editor seperti Notepad, Microsoft FrontPage, Macromedia Dreamweaver, dll untuk mendesain homepage dan komponen-komponennya. Selain itu juga digunakan untuk menggabungkan gambar,suara dan animasi yang telah dibuat di dalam homepage. HTML yang bersifat graphical user interface akan mengurangi waktu dalam penulisan sintaks. Salah satu produk microsoft sebagai editor HTML yaitu Microsoft FrontPage XP.
3. Software Animator (seperti Macromedia Flash) software ini digunakan untuk membuat animasi gambar dan suara.
4. Software untuk menangani pekerjaan Web mastering seperti FTP (File Transfer Protocol)
5. Software pengaman jaringan.
C. Membuat Layout Homepage.
Layout atau frame merupakan bentuk format navigasi dari homepage yang akan ditampilkan. Beberapa layout halaman homepage tersedia di Microsoft FrontPage XP. Penggunaan layout tergantung jenis navigasi dan informasi yang akan ditampilkan dalam homepage.
Langkah – langkah dalam pembuatan layout pada homepage adalah sbb:
1. Buka microsoft FrontPage( klik start – all program – ms. FrontPage).
2. Pilih menu file – new page or web.
3. Setelah itu anda pilih page templates pada bagian new from templates.
4. Kemudian akan ditampilkan kotak dialog page templates yang terdiri atas General,Frames Pages dan Style Sheets.
5. Lalu pilih jenis frame lalu tekan tombol OK.
D. Menerapkan Hyperlink
Link merupakan komponen yang terdapat pada HTML yang apabila diklik menggunakan mouse akan menuju pada halaman web tertentu. Biasanya bentuk link pada Web Page mempunyai warna biru terang dan diberi garis bawah. Link mempunyai tujuan atau sasaran dari dokumen HTML yang lain akan berpindah dari satu halaman ke halaman lain. Ada tiga jenis Link yaitu sbb:
1. Link Relatif
Link relatif digunakan untuk membuat link pada suatu halaman ke halaman lain dalam suatu Website dengan tidak memerlukan URL (alamat internet) secara lengkap. Biasanya halaman – halaman web terletak dalam suatu direktori.
2. Link Absolute
Link absolute digunakan membuat link ke halaman web lain pada website yang berbeda di internet. Untuk itu pada link absolute ini alamat internet harus ditulis dengan lengkap.
3. Link self
Link self merupakan navigasi dengan cara membuat link dengan antarbagian dengan menandai setiap bagian tersebut dengan nama. Dokumen akan terbagi atas bagian yang bernama sehingga di bagian tertentu dapat diletakkan link untuk menuju bagian lain.
Untuk membuat link menuju suatu bagian tertentu dalam dokumen yang sama adalah dengan menyertakan “#” setelah nama bagian.
A. Penerapan Cascading Style Sheet (CSS)
Cascading style Sheet (CSS) merupakan skrip buatan yang berisi informasi dan perintah tentang format tampilan website pada web browzer. CSS dapat memisahkan format tampilan dengan isi dokumen HTML. Selain itu CSS juga bisa membantu dalam memformat layout atau tampilan website dengan memanggil kembali nama tersebut tanpa harus kembali mengklik ulang format tampilan yang akan diterapkan pada setiap dokumen HTML.
Perintah CSS terdiri dari dua elemen dasar , yaitu “selector” dan “declaration”. Selector biasanya berupa tag HTML
1. Membuat Halaman pada Homepage
Terdiri dr 4 halaman;
a. Membuat Halaman 1
1. Aktifkan Ms Front page, pilih fine – new - page or web.
2. Pilih page templates – tab general.
3. Pilih tab culomn body with contens on left kemudian tekan OK.
4. Pada page frame sebelah kiri hapus SECTION 2 sampai 4
5. Pada page frame utama yang diperoleh hapus semua tulisan dibawah “Fish Photo Caption”.
6. Ganti tulisan “Your Heading Goes Here” dengan “Kegiatan Mahasiswa”
7. Ganti SECTION 1 dengan “Kegiatan Mahasiswa”, Title 1 dengan “Jadwal Kuliah”, Title 2 dengan “Data Mahasiswa”, dan Title 3 dengan “Link Bermanfaat”.
8. Tulis “Kegiatan Mahasiswa” lalu Enter, tulis “kembali” dan naikkan kursor.
9. Pilih menu Table-insert-Table masukkan jumlah baris dan kolom (sesuai keinginan) kemudian tekan OK.
10. Simpan pada lokasi C\KAMPUSKU dengan nama file “kegiatanmahasiswa.htm”
11. Kita akan membuat link dari navigasi yang terdapat pada frame kiri. Blok ‘Kegiatan Mahasiswa’ kemudian pilih menu Insert-Hyperlink atau tekan Ctrl-K. Tentukan tujuan Link yaitu file” kegiatan Mahasiswa.htm” lalu OK.
12. Simpan hasil perubahan halaman 1 melaluimenu file-save
b. Membuat halaman 2
1. Pastikan halaman “kegiatan mahasiswa.htm” masih terbuka
2. Pilih menu file-save as beri nama file “jadwalkuliah.htm”. tekan tombol change title untuk mengganti page title dari data Mahasiswa menjadi Jadwal Kuliah pada bagian frame isi.
3. Kita hanya akan memodifikasi frame isi dan header dari halaman kegiatan mahasiswa,ganti ‘Kegiatan Mahasiswa’ di frame header menjadi ‘Jadwal Kuliah’ dan ‘Jadwal kuliah’ pada bagian frame isi.
4. Ubah isi frame di bawah “Jadwal Pelajaran” lalu simpan kembali.
c. Membuat halaman 3
1. Pilih menu file-save as dan beri nama file a’datamahasiswa.htm”
2. Tekan tombol Change Title untuk mencari page title menjadi data mahasiswa lalu tekan save.
3. Ubah isi tabel lalu simpan kembali hasil perubahannya.
d. Membuat halaman 4
1. Pilih menu file-Save As- beri nama file “linkbermanfaat.htm”.
2. Tekan tombol Change Title untuk mengganti Page Title menjadi Link Bermanfaat, lalu save.
3. Ubah isi tabel lalu simpan kembali hasilnya.
4. Mengaplikasikan CSS
1. Copy file yang telah dibuat sebelumnya yaitu file KAMPUSKU.css ke dalam direktori C:\KAMPUSKU\CSS.
2. Masukkan diantara tag
3. Simpan halaman tersebut, anda dapat melihat tampilan akhirdengan cara klik 2x file “kegiatanmahasiswa.htm” melalui windows explorer.
Tidak ada komentar:
Posting Komentar