18 BAB III ANALISA DAN PEMBAHASAN MASALAH 3.1. ANALISA Pada bab analisa ini yang akan dibahas antara lain tentang : 3.1.1. Budi Daya Ikan Air Tawar Budi daya ikan air tawar lebih mudah dibandingkan dengan ikan air laut sebagai contoh budi daya ikan mas sangat mudah sekali dilakukan karena toleransi terhadap lingkungan sangat tinggi, dan sebagai bahan pangan ikan merupakan sumber protein, lemak, vitamin dan mineral yang sangat baik dan prospektif bagi manusia. Mengingat besarnya peranan gizi bagi kesehatan maka ikan merupakan pilihan tepat untuk dikonsumsi karena harga ikan air tawar yang relatif lebih murah dibandingkan ikan air laut, untuk itu maka perlu adanya upaya pengembangan ikan air tawar sedangkan keberhasilan ikan air tawar dapat ditentukan oleh faktor lingkungan itu sendiri, karena faktor lingkungan dapat berpengaruh terhadap cita rasa ikan. Sedangkan ikan sendiri dapat digolongkan menjadi tiga bagian yaitu, ikan air laut, air tawar, dan air payau atau tambak. Ikan yang hidup di air tawar dan air laut sangat banyak sehingga dibedakan menjadi golongan yang dapat dikonsumsi dan ikan hias. Lingkungan hidup ikan air tawar adalah sungai, danau, kolam, sawah atau rawa. Jenis ikan air tawar yang umum dikonsumsi adalah ikan gurame, nila, lele, tawes, sidat, belut, mas, mujair, gabus, sepat siam, betok, jambal dan jelawat. Untuk itu maka penulis mengangkat masalah mengenai penyebarluasan informasi ikan air tawar yaitu ikan nila, ikan gurame, ikan lele, dan ikan tawes maka itu dibutuhkan sebuah media penyampainnya cepat, luas dan praktis melalui website. Dalam penulisan ilmiah ini penulis ingin menamakan website tersebut dengan nama IFIAT atau merupakan kependekan dari informasi tentang ikan tersebut dan jenis – jenisnya, kebiasaan hidup ikan, kebiasaan makan ikan, kebiasaan berkembang biak, pemilihan induk, dan pemijahan di kolam. 19 3.1.2. Manfaat Yang Terkandung Di dalam Ikan Air Tawar Ikan air tawar mempunyai kandungan gizi yang cukup tinggi dan hampir sama dengan ikan air laut, tingginya kandungan protein dan vitamin membuat ikan yang mudah dibudidayakan ini dapat sangat membantu pertumbuhan anak – anak balita dan bagusjuga dikonsumsi orang dewasa, karena banyaknya nilai gizi yang terkandung didalam ikan tersebut. Pengembangan ikan air tawar sebagai bahan pangan. Karena merupakan sumber protein, lemak, vitamin dan mineral yang sangat baik prospektif. Keunggulan utama protein ikan dengan produk lainnya adalah kelengkapan konsumsi asam amino dan kemudahannya untuk dicerna, mengingat besarnya peranan gizi bagi kesehatan ikan merupakan pilihan tepat untuk dikonsumsi dan dibudi daya, ikan air tawar juga lebih mudah dibandingkan dengan ikan air laut. 3.1.3 Analisa Masalah Sarana untuk menyampaikan informasi budi daya ika air tawar selama ini dilakukan lewat media seminar dan buku, baik informasi yang berasal dari luar maupun dari dalam setiap data informasi yang masuk kepada seorang penulis akan ditulis dan dicetak menjadi sebuah buku, yang nantinya akan diterbitkan dan dijual kebeberapa toko buku untuk keperluan pembaca. Informasi ini akan diperbaharui atau diupdate serta mengalami cetak ulang jika perlu bahkan akan ditarik atau dikembalikan jika masa publishnya dianggap sudah cukup lama dan kurang diminati para pembacanya, proses tersebut diatas merupakan proses pengelolaan data informasi secara konvensional. Penulis menganalisa bahwa penyampain informasi secara konvensional tidak lagi efektif dan dinamis, oleh karena itu diperlukan suatu sarana yang baru yang ditampilkan atau diletakkan pada sebuah situs dengan memanfaatkan teknologi internet, sehingga akses terhadap informasi dapat dilakukan setiap saat cara pengelolaan akses data dan informasi dapat lebih mudah, fleksibel, atraktif dan dinamis sehingga tujuan informasi dapat mencapai sasaran. 20 3.1.4 Struktur Navigasi Pada tahap ini berisikan gambaran sebuah web secara konseptual atau terkonsep mengenai informasi apa saja yang akan ditentukan untuk dapat ditampilkan pada website tersebut, agar halaman-halaman yang dibuat dapat disusun dengan baik dan teratur, serta agar lebih jelas dan memudahkan dalam pemahaman spesifikasi informasi pada page-page yang akan dibuat. Struktur navigasi ini diperlukan untuk menentukan alur dari visualisasi dari awal sampai akhir, dimana tampilan utamanya berisi panduan serta link-link yang menghubungkan ke halaman berikutnya. Dalam pembuatan website ini penulis menggunakan struktur navigasi model Hierarki yang mengandalkan percabangan untuk menampilkan data berdasarkan kreteria tertentu. Struktur Navigasinya: HOME JENIS-JENIS IKAN AIR TAWAR PROFIL IKAN GURAME IKAN NILA KRITIK DAN SARAN IKAN TAWES IKAN LELE Pengenalan Jenis Pengenalan Jenis Pengenalan Jenis Pengenalan Jenis Kebiasaan Hidup di Alam Kebiasaan Hidup di Alam Kebiasaan Hidup di Alam Kebiasaan Hidup di Alam Kebiasaan Makan Kebiasaan Makan Kebiasaan Makan Kebiasaan Makan Kebiasaan Berkembang biak Kebiasaan Berkembang biak Kebiasaan Berkembang biak Kebiasaan berkembang biak Memilih Induk Memilih Induk Memilih Induk Pemijahan di Kolam Pemijahan di Kolam Pemijahan di Kolam Memilih Induk Pemijahan di Kolam Gambar 3.1 Struktur Navigasi 21 3.2. PERANCANGAN APLIKASI WEBSITE IFIAT 3.2.1. Halaman Index Home / Index.htm adalah halaman depan dari semua halaman yang ada pada website. Halaman ini juga dapat disebut sebagai halaman pembuka, karena pada saat pertama website dibuka maka halaman inilah yang akan tampil sebelum halaman yang lainnya. Halaman index.htm merupakan main atau home dari halaman-halaman web lainnya yang berada pada link index.htm tersebut. Halaman index.htm mempunyai rancangan tampilan sebagai berikut : Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link text Gambar 3.2 Rancangan Halaman Index Pada menu ini akan ditampilkan halaman index yang berisikan profil, ikan gurame, ikan nila, ikan tawes, ikan lele, dan kritik dan saran Langkah-langkah pembuatannya: 1. Buka aplikasi Microsoft Frontpage 2003. Pilih File > New nanti akan muncul task pane di sebelah kanan layar pilih blank page untuk memulainya. 22 2. Untuk membuat halaman backgroundnya pilih Format > Background. Pada Page Properties tab Formatting pilih background yang diinginkan setelah itu klik ok. 3. Pilih Insert > layer klik 2 kali pada layer maka akan muncul task pane layer kliklah positioning akan muncul position. Isikan left 112px, top 15px, width 800px, dan height 600px. 4. Table > insert table. Pada kolom rows isi dengan 3 dan pada columns isi dengan 1, cell padding isi dengan 0 dan cell spacing isi dengan 0, border size isi dengan 0 sesudah itu klik Ok. 5. Pada row pertama pilih Insert > picture > from file. Cari letak file gambar yang berisikan banner yang telah dibuat pada Photoshop CS2 yang berformatkan GIF. Setelah itu klik insert. 6. Pada row kedua berisikan informasi tentang halaman index. Kita gunakan layer agar posisi tempat dan ukuran halaman dapat diubah-ubah sesuai keinginan. Untuk mengisikan layer pilih Format > layers pada menu bar. Kotak layers akan muncul di sebelah kanan layar, klik insert layer untuk memasukan layer baru ke dalam halaman website. Atur posisinya pada Layer properties > Positioning sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian isikan materi yang ingin disampaikan. 7. Pada baris ketiga bersikan informasi tentang pembuat websitenya, tahun pembuatan, dan hak cipta pembuatnya. Letakkan di tengah-tengah table dan rubah font colornya menjadi putih dengan background pada cell properties warna hitam. 23 3.2.2. Halaman Gurame Gambar 3.3 Rancangan Halaman Ikan Gurame Pada menu ini akan ditampilkan menu pengenalan ikan gurame, kebiasaan hidup di alam, kebiasaan makan, kebiasaan berkembang biak, memilih induk, pemijahan di kolam Langkah – langkah membuat halaman gurame : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman gurame. Masih menggunakan layer untuk menampilkan gambar gurame dan layer tambahan untuk melakukan link ke halaman gurame yang lainnya. Atur Positioning untuk tampilan gambar gurame sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar gurame dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi link mengenai informasi tentang gurame buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan link dengan memblok tulisan yang ingin dirubah menjadi link kemudian klik kanan pilih hyperlink. Pilih halaman tujuan dan klik Ok. 24 3.2.3. Halaman Pengenalan Gurame Gambar 3.4 Rancangan Halaman Pengenalan Gurame Pada menu ini akan ditampilkan tentang pengenalan ikan gurame Langkah – langkah membuat halaman pengenalan gurame : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman gurame. Masih menggunakan layer untuk menampilkan gambar gurame dan layer tambahan untuk melakukan link ke halaman gurame yang lainnya. Atur Positioning untuk tampilan gambar gurame sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar gurame dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang pengenalan gurame buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 25 3.2.4. Halaman Kebiasaan Hidup di Alam Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.5 Rancangan Halaman Kebiasaan Hidup di Alam Pada menu ini akan ditampilkan tentang kebiasaan hidup di alam ikan gurame Langkah – langkah membuat halaman kebiasaan hidup di alam ikan gurame : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman gurame. Masih menggunakan layer untuk menampilkan gambar gurame dan layer tambahan untuk melakukan link ke halaman gurame yang lainnya. Atur Positioning untuk tampilan gambar gurame sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar gurame dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan hidup di alam ikan gurame buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 26 3.2.5. Halaman Kebiasaan makan Gambar 3.6 Rancangan Halaman Kebiasaan Makan Pada menu ini akan ditampilkan tentang kebiasaan makan ikan gurame Langkah – langkah membuat halaman kebiasaan makan ikan gurame : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman gurame. Masih menggunakan layer untuk menampilkan gambar gurame dan layer tambahan untuk melakukan link ke halaman gurame yang lainnya. Atur Positioning untuk tampilan gambar gurame sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar gurame dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan makan ikan gurame buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 27 3.2.6. Halaman Kebiasaan berkembang biak Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.7 Rancangan Halaman Kebiasaan Berkembang Biak Pada menu ini akan ditampilkan tentang kebiasaan berkambang biak ikan gurame Langkah – langkah membuat halaman kebiasaan berkembang biak ikan gurame : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman gurame. Masih menggunakan layer untuk menampilkan gambar gurame dan layer tambahan untuk melakukan link ke halaman gurame yang lainnya. Atur Positioning untuk tampilan gambar gurame sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar gurame dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan berkembang biak ikan gurame buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 28 3.2.7. Halaman Memilih induk Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.8 Rancangan halaman memilih induk Pada menu ini akan ditampilkan tentang memilih induk ikan gurame Langkah – langkah membuat halaman memilih induk ikan gurame : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman gurame. Masih menggunakan layer untuk menampilkan gambar gurame dan layer tambahan untuk melakukan link ke halaman gurame yang lainnya. Atur Positioning untuk tampilan gambar gurame sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar gurame dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang memilih induk ikan gurame buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 29 3.2.8. Halaman pemijahan di kolam Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.9 Rancangan halaman pemijahan di kolam Pada menu ini akan ditampilkan tentang pemijahan di kolam ikan gurame Langkah – langkah membuat halaman pemijahan di kolam ikan gurame : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman gurame. Masih menggunakan layer untuk menampilkan gambar gurame dan layer tambahan untuk melakukan link ke halaman gurame yang lainnya. Atur Positioning untuk tampilan gambar gurame sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar gurame dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang pemijahan di kolam ikan gurame buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 30 3.2.9. Halaman Nila Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Link Link Link Link text Gambar 3.10 Rancangan Tampilan Halaman Ikan Nila Pada menu ini akan ditampilkan menu pengenalan ikan nila, kebiasaan hidup di alam, kebiasaan makan, kebiasaan berkembang biak, memilih induk, pemijahan di kolam Langkah – langkah membuat halaman nila : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman nila. Masih menggunakan layer untuk menampilkan gambar nila dan layer tambahan untuk melakukan link ke halaman nila yang lainnya. Atur Positioning untuk tampilan gambar nila sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar nila dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi link mengenai informasi tentang nila buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan link dengan memblok tulisan yang ingin dirubah menjadi link kemudian klik kanan pilih hyperlink. Pilih halaman tujuan dan klik Ok. 31 3.2.10. Halaman Pengenalan Nila Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.11 Rancangan halaman pengenalan nila Pada menu ini akan ditampilkan tentang pengenalan ikan nila Langkah – langkah membuat halaman pengenalan ikan nila : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman nila. Masih menggunakan layer untuk menampilkan gambar nila dan layer tambahan untuk melakukan link ke halaman nila yang lainnya. Atur Positioning untuk tampilan gambar nila sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar nila dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang pengenalan ikan nila buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 32 3.2.11. Halaman Kebiasaan Hidup di Alam Gambar 3.12 Rancangan halaman kebiasaan hidup di alam Pada menu ini akan ditampilkan tentang kebiasaan hidup di alam ikan nila Langkah – langkah membuat halaman kebiasaan hidup di alam ikan nila: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman nila. Masih menggunakan layer untuk menampilkan gambar nila dan layer tambahan untuk melakukan link ke halaman nila yang lainnya. Atur Positioning untuk tampilan gambar nila sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar nila dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan hidup di alam ikan nila buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 33 3.2.12. Halaman Kebiasaan makan Gambar 3.13 Rancangan halaman kebiasaan makan Pada menu ini akan ditampilkan tentang kebiasaan makan ikan nila Langkah – langkah membuat halaman kebiasaan makan ikan nila: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman nila. Masih menggunakan layer untuk menampilkan gambar nila dan layer tambahan untuk melakukan link ke halaman nila yang lainnya. Atur Positioning untuk tampilan gambar nila sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar nila dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan makan ikan nila buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 34 3.2.13. Halaman Kebiasaan berkembang biak Gambar 3.14 Rancangan halaman kebiasaan berkembang biak Pada menu ini akan ditampilkan tentang kebiasaan berkembang biak ikan nila Langkah – langkah membuat halaman kebiasaan berkembang biak ikan nila: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman nila. Masih menggunakan layer untuk menampilkan gambar nila dan layer tambahan untuk melakukan link ke halaman nila yang lainnya. Atur Positioning untuk tampilan gambar nila sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar nila dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan berkembang biak ikan nila buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 35 3.2.14. Halaman Memilih induk Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.15 Rancangan halaman kebiasaan memilih induk Pada menu ini akan ditampilkan tentang kebiasaan memilih induk ikan nila Langkah – langkah membuat halaman kebiasaan memilih induk ikan nila: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman nila. Masih menggunakan layer untuk menampilkan gambar nila dan layer tambahan untuk melakukan link ke halaman nila yang lainnya. Atur Positioning untuk tampilan gambar nila sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar nila dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan memilih induk ikan nila buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 36 3.2.15. Halaman pemijahan di kolam Gambar 3.16 Rancangan halaman pemijahan di kolam Pada menu ini akan ditampilkan tentang pemijahan di kolam ikan nila Langkah – langkah membuat halaman pemijahan di kolam ikan nila: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman nila. Masih menggunakan layer untuk menampilkan gambar nila dan layer tambahan untuk melakukan link ke halaman nila yang lainnya. Atur Positioning untuk tampilan gambar nila sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar nila dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan pemijahan di kolam ikan nila buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 37 3.2.16. Halaman Tawes Gambar 3.17 Rancangan Tampilan Halaman Ikan Tawes Pada menu ini akan ditampilkan menu pengenalan ikan tawes, kebiasaan hidup di alam, kebiasaan makan, kebiasaan berkembang biak, memilih induk, pemijahan di kolam Langkah – langkah membuat halaman tawes : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman tawes. Masih menggunakan layer untuk menampilkan gambar tawes dan layer tambahan untuk melakukan link ke halaman tawes yang lainnya. Atur Positioning untuk tampilan gambar tawes sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar tawes dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi link mengenai informasi tentang tawes buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan link dengan memblok tulisan yang ingin dirubah menjadi link kemudian klik kanan pilih hyperlink. Pilih halaman tujuan dan klik Ok. 38 3.2.17. Halaman Pengenalan Tawes Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.18 Rancangan halaman pengenalan tawes Pada menu ini akan ditampilkan tentang pengenalan tawes Langkah – langkah membuat halaman pengenalan tawes: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman tawes. Masih menggunakan layer untuk menampilkan gambar tawes dan layer tambahan untuk melakukan link ke halaman tawes yang lainnya. Atur Positioning untuk tampilan gambar tawes sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar tawes dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan makan ikan tawes buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 39 3.2.18. Halaman Kebiasaan Hidup di Alam Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.19 Rancangan halaman kebiasaan hidup di alam Pada menu ini akan ditampilkan tentang kebiasaan hidup di alam ikan tawes Langkah – langkah membuat halaman kebiasaan hidup di alam ikan tawes: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman tawes. Masih menggunakan layer untuk menampilkan gambar tawes dan layer tambahan untuk melakukan link ke halaman tawes yang lainnya. Atur Positioning untuk tampilan gambar tawes sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar tawes dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan hidup di alam ikan tawes buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 40 3.2.19. Halaman Kebiasaan makan Gambar 3.20 Rancangan halaman kebiasaan makan Pada menu ini akan ditampilkan tentang kebiasaan makan ikan tawes Langkah – langkah membuat halaman kebiasaan makan ikan tawes: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman tawes. Masih menggunakan layer untuk menampilkan gambar tawes dan layer tambahan untuk melakukan link ke halaman tawes yang lainnya. Atur Positioning untuk tampilan gambar tawes sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar tawes dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan makan ikan tawes buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 41 3.2.20. Halaman Kebiasaan berkembang biak Gambar 3.21 Rancangan halaman kebiasaan berkembang biak Pada menu ini akan ditampilkan tentang kebiasaan berkembang biak ikan tawes Langkah – langkah membuat halaman kebiasaan hidup di alam ikan tawes: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman tawes. Masih menggunakan layer untuk menampilkan gambar tawes dan layer tambahan untuk melakukan link ke halaman tawes yang lainnya. Atur Positioning untuk tampilan gambar tawes sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar tawes dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang kebiasaan hidup di alam ikan tawes buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 42 3.2.21. Halaman Memilih induk Gambar 3.22 Rancangan halaman memilih induk Pada menu ini akan ditampilkan tentang memilih induk ikan tawes Langkah – langkah membuat halaman memilih induk ikan tawes: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman tawes. Masih menggunakan layer untuk menampilkan gambar tawes dan layer tambahan untuk melakukan link ke halaman tawes yang lainnya. Atur Positioning untuk tampilan gambar tawes sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar tawes dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang memilih induk ikan tawes buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 43 3.2.22. Halaman pemijahan di kolam Gambar 3.23 Rancangan halaman pemijahan di kolam Pada menu ini akan ditampilkan tentang pemijahan di kolam ikan tawes Langkah – langkah membuat halaman pemijahan di kolam ikan tawes: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman tawes. Masih menggunakan layer untuk menampilkan gambar tawes dan layer tambahan untuk melakukan link ke halaman tawes yang lainnya. Atur Positioning untuk tampilan gambar tawes sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar tawes dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi tentang pemijahan di kolam ikan tawes buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 44 3.2.23. Halaman Lele Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Link Link Link Link text Gambar 3.24 Rancangan Tampilan Halaman Ikan Lele Pada menu ini akan ditampilkan menu pengenalan ikan lele, kebiasaan hidup di alam, kebiasaan makan, kebiasaan berkembang biak, memilih induk, pemijahan di kolam Langkah – langkah membuat halaman lele : 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman lele. Masih menggunakan layer untuk menampilkan gambar lele dan layer tambahan untuk melakukan link ke halaman lele yang lainnya. Atur Positioning untuk tampilan gambar lele sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar lele dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi link mengenai informasi tentang lele buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan link dengan memblok tulisan yang ingin dirubah menjadi link kemudian klik kanan pilih hyperlink. Pilih halaman tujuan dan klik Ok. 45 3.2.24. Halaman Pengenalan Lele Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.25 Rancangan halaman pengenalan lele Pada menu ini akan ditampilkan tentang pengenalan lele Langkah – langkah membuat halaman pengenalan lele: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman lele. Masih menggunakan layer untuk menampilkan gambar lele dan layer tambahan untuk melakukan link ke halaman lele yang lainnya. Atur Positioning untuk tampilan gambar lele sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar lele dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi pengenalan lele buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. disampaikan pada layer ini. Isikan berita yang ingin 46 3.2.25. Halaman Kebiasaan Hidup di Alam Gambar 3.26 Rancangan halaman kebiasaan hidup di alam Pada menu ini akan ditampilkan tentang kebiasaan hidup di alam ikan lele Langkah – langkah membuat halaman kebiasaan hidup di alam ikan lele: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman lele. Masih menggunakan layer untuk menampilkan gambar lele dan layer tambahan untuk melakukan link ke halaman lele yang lainnya. Atur Positioning untuk tampilan gambar lele sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar lele dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi kebiasaan hidup di alam ikan lele buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 47 3.2.26. Halaman Kebiasaan makan Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.27 Rancangan halaman kebiasaan makan Pada menu ini akan ditampilkan tentang kebiasaan makan ikan lele Langkah – langkah membuat halaman kebiasaan makan ikan lele: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman lele. Masih menggunakan layer untuk menampilkan gambar lele dan layer tambahan untuk melakukan link ke halaman lele yang lainnya. Atur Positioning untuk tampilan gambar lele sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar lele dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi kebiasaan makan ikan lele buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 48 3.2.27. Halaman Kebiasaan berkembang biak Gambar 3.28 Rancangan halaman kebiasaan berkembang biak Pada menu ini akan ditampilkan tentang kebiasaan berkembang biak ikan lele Langkah – langkah membuat halaman kebiasaan berkembang biak ikan lele: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman lele. Masih menggunakan layer untuk menampilkan gambar lele dan layer tambahan untuk melakukan link ke halaman lele yang lainnya. Atur Positioning untuk tampilan gambar lele sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar lele dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi kebiasaan berkembang biak ikan lele buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 49 3.2.28. Halaman Memilih induk Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Gambar ikan Text text Gambar 3.29 Rancangan halaman memilih induk Pada menu ini akan ditampilkan tentang memilih induk ikan lele Langkah – langkah membuat halaman memilih induk ikan lele: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman lele. Masih menggunakan layer untuk menampilkan gambar lele dan layer tambahan untuk melakukan link ke halaman lele yang lainnya. Atur Positioning untuk tampilan gambar lele sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar lele dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi informasi memilih induk ikan lele buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 50 3.2.29. Halaman pemijahan di kolam Gambar 3.30 Rancangan halaman pemijahan di kolam Pada menu ini akan ditampilkan tentang pemijahan di kolam ikan lele Langkah – langkah membuat halaman pemijahan di kolam ikan lele: 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang halaman lele. Masih menggunakan layer untuk menampilkan gambar lele dan layer tambahan untuk melakukan link ke halaman lele yang lainnya. Atur Positioning untuk tampilan gambar lele sebagai berikut Left 192px, width 605px, top 181px, height 465px. Kemudian sisipkan gambar lele dengan cara insert > picture > from file cari lokasi gambar dan tekan enter. 3. Untuk mengisi pemijahan di kolam ikan lele buatlah layer dengan left 306px, width 285px, top 181px, dan height 137px. Isikan berita yang ingin disampaikan pada layer ini. 51 3.2.30. Halaman kritik dan saran Gambar Banner Link ׀Link ׀Link ׀Link ׀Link ׀Link Text Link text Gambar 3.31 Rancangan halaman kritik dan saran Pada menu ini akan ditampilkan tentang kritik dan saran Langkah – langkah membuat halaman kritik dan saran 1. Lakukan langkah pertama sampai kelima dan ketujuh seperti yang dilakukan pada halaman index. 2. Pada row kedua berisikan informasi tentang kritik dan saran yang disertai dengan link menuju email dari website ifiat yaitu [email protected]. Untuk menulis halaman kritik dan saran menggunakan layer dengan posisi left 181px, width 677px, top 194px, dan height 214px. 3.2.31. Cara Membuat Banner Langkah – langkah membuat banner ifiat 1. Buka aplikasi photoshop CS2, kemudian pilih File > New. Pada kolom width ketik 800 pixels dan height 145 pixels klik ok. 2. Untuk membuat backgroundnya klik rectangular marquee tool pada toolbox tarik garis dari pojok kiri atas ke sebelah kanan kanvas selebar ¾ 52 halaman lalu klik paint bucket tool lalu pilih set foreground color rubah menjadi warna hitam. Letakkan cursor pada area yang di seleksi dan klik kiri sehingga berubah menjadi berwarna hitam, kemudian klik rectangular lalu klik kanan pada kanvas pilih select inverse. Area seleksi akan berubah menjadi kebalikannya, lalu klik paint bucket dan rubah warnanya menjadi merah dan klik area yang telah di inverse sehingga untuk backgroundnya berubah menjadi hitam dan merah. 3. Untuk membuat tulisan ifiat kliklah horizontal type tool lalu letakkan pada kanvas. Ubah fontnya menjadi forte dan ukurannya sebesar 72pt. demikian pula untuk membuat tulisan “Pusat informasi ikan air tawar” ubah fontnya menjadi franklin gothic medium cond dan ukurannya sebesar 18pt. 4. Untuk memasukkan gambar ikan pada banner pertama-tama tekan CTRL+O pada keyboard untuk membuka gambar baru. Pilih gambar yang ingin ditampilkan lalu klik open. Setelah terbuka tekan CTRL+A untuk menyeleksi seluruh area pada gambar yang diinginkan lalu tekan CTRL+C untuk mengcopy gambar. Tahap selanjutnya memindahkan gambar menuju halaman banner yang sedang dibuat dengan cara klik move tool dan drag gambar yang diinginkan. Jika gambar yang dihasilkan terlampau besar atau kecil dapat dirubah-rubah sesuai keinginan dengan menekan CRTL+T dan enter kalau sudah selesai mengeditnya. Langkah selanjutnya seleksi daerah yang ingin di edit dengan retangular klik kanan pilih option select inverse klik kanan lagi pilih option feather. Kotak feather selection akan muncul isi 30 pixels pada feather radius lalu klik ok. Begitu pula pada gambar ikan – ikan yang lainnya. 3.3. SPESIFIKASI SOFTWARE DAN HARDWARE Untuk pembuatan website ini ada beberapa hal yang perlu diperhatikan untuk mendapatkan hasil yang sempurna. Hal yang perlu diperhatikan tersebut 53 ialah mengenai spesifikasi system. Spesifikasi sistem yang dimaksud disini adalah perangkat keras (Hardware) dan perangkat lunak (Software) yang saling mendukung dan memiliki kemampuan untuk menjalankan website IFIAT ini. Software yang digunakan pada aplikasi ini adalah sebagai berikut: a. Windows XP Servive Pack 2. b. Microsoft Frontpage 2003. c. Adobe Photoshop CS 2. d. Web Browser Internet Explorer. Perangkat keras yang digunakan dengan spesifikasi : a. CPU dengan Processor AMD Sempron 2800 MHz. b. Monitor dengan resolusi 1024 x 768 pixels. c. Memory DDRAM 512 Mb. d. Hard Disk 20 Gb. e. VGA 128 Mbyte. 3.4. MENGUPLOAD WEB Setelah selesai melakukan pembuatan halaman web, langkah yang selanjutnya adalah upload file yang telah dibuat pada salah satu web server yang ada di internet. Untuk hal ini penulis melakukannya pada salah satu web server gratis geocities.com, dengan cara seperti di bawah ini : 1. Buka pada web browser http://geocities.yahoo.com/ 2. Pilih sign up for a free website, jika telah memiliki account di Yahoo dapat langsung masuk ke geocities dan jika belum, dapat membuatnya terlebih dahulu di menu sign up di Yahoo. Setelah itu akan dihadapkan pada tampilan pengisian YahooID dan password untuk memulai proses upload. 54 Gambar 3.32 Tampilan yahoo ID 3. Untuk selanjutnya akan dihadapkan menu Advanced Toolbox, pada menu ini pilih Easy Upload. Gambar 3.33 Tampilan menu advanced toolbox 4. Pada Easy Upload file-file yang telah dibuat dipilih melalui Browse dimana jumlah file yang akan diupload dapat ditentukan. Dan untuk halaman utama harus dinamakan index.html, karena pada saat web browser menjelajah sebuah website yang pertama kali dicarinya adalah file index.html untuk ditampilkan. 55 Gambar 3.34 Tampilan easy upload 5. Untuk mengakhiri proses upload tekan upload