BAB VII Membangun Content Situs Web

Transkripsi

1 Membangun Web Bisnis Dengan Frontpage 2000 Eko Purwanto WEBMEDIA Training Center Medan Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan disebarkan secara bebas untuk tujuan bukan komersial (nonprofit), dengan syarat tidak menghapus atau merubah atribut penulis dan pernyataan copyright yang disertakan dalam setiap dokumen. Tidak diperbolehkan melakukan penulisan ulang, kecuali mendapatkan ijin terlebih dahulu dari IlmuKomputer.Com. BAB VII Membangun Content Situs Web 7.1 Hyperlink Hyperlink adalah elemen di dalam halaman web yang berguna sebagai penunjuk untuk menuju ke suatu objek di dalam intranet ataupun World Wide Web. Contoh penggunaan hyperlink: 1

2 Membuat Link text ke halaman lain di situs Web Anda. Membuat link bookmark di situs web Web, menuju ke objek di halaman yang sama. Membuat link grafik di halaman web untuk menuju ke Web site lainnya di World Wide Web. Membuat link grafik ke grafik lain Web site Anda. Membuat link teks untuk menuju ke alamat . Membuat link teks atau grafik untuk menuju ke alamat yang bukan World Wide Web, seperti File Transfer Protocol (FTP). Hyperlinks dapat berupa image ataupun teks yang dapat berhubungan dengan bookmarks,halaman lain di web site ataupun World Wide Web, atau juga alamat . Sebuah hyperlink teks dapat berupa teks, seperti sebuah kata ataupun kalimat yang ditugaskan dalam tujuan URL. Contohnya adalah About, yang membuat hyperlink ke halaman about. Hyperlink gambar adalah sebuah gambar yang ditugaskan ke tujuan URL dengan cara: Keseluruhan gambar akan ditandai untuk hyperlink. Pengunjung dapat mengklik di semua bagian dari gambar yang menuju ke satu halaman tujuan. Contohnya adalah button. Sebuah gambar yang memiliki satu atau beberapa hotspot. Sebuah gambar yang memiliki hotspot disebut image map. Contohnya sebuah image map dapat berupa sebuah gambar yang memiliki beberapa objek tujuan (memiliki beberapa hyperlink). Contoh adalah gambar berikut yang menampilkan satu image tetapi jika kursor mengarah ke satu bagian tertentu maka sebuah hyperlink ditampilkan. 7.2 Bookmarks Anda dapat membuat bookmark ke teks, grafik ataupun ruang kosong di situs web. Bookmark ini akan menjadi target hyperlink. Anda dapat memilih beberapa blok teks di FrontPage Editor dan menandai hyperlink text ke sebuah bookmark. 2

3 Untuk membuat bookmark Anda dapat melakukan hal di bawah ini: 1. Pilih Edit Bookmark dari Menu bar FrontPage. 2. Ketika kotak dialog Bookmark terbuka, ketikkan nama bookmark yang Anda inginkan 3. Setelah Anda mengetikkan nama bookmark, klik OK di kotak dialog Bookmark Checklist Dalam menempatkan bookmark diperlukan strategi yang baik, beberapa tempat yang bagus untuk ytempat bookmark adalah: Bagian atas dari halaman Web. Bagian bawah dari halaman Web. Pada heading utama dan sub headings. Pada grafik yang penting di halaman web. Pada daftar isi ataupun index dari halaman web Membuat Hyperlink untuk Bookmarks Untuk membuat hyperlink untuk bookmark, ikuti langkah berikut: 1. Pilih teks yang akan dijadikan hyperlink. 2. Klik Create atau tombol Edit Hyperlinks pada toolbar FrontPage Editor toolbar 3. Klik halaman web Anda dari daftar halaman di dialog box. 4. Pilih bookmark dari daftar bookmark drop-down. Bookmark ini akan menjadi tujuan dari hyperlink Anda. 5. Klik OK pada kotak dialog Create Hyperlink. 7.3 Forum Diskusi Diskusi group adalah aktifitas interaktif yang dilakukan pengunjung membahas topik artikel yang ada, kemudian membalasnya dan mengirimkan kembali di dalam forum tersebut. Pengunjung dapat juga mencari topik artikel yang disenanginya dengan cepat. Diskusi group memiliki beberapa komponen: Sebuah daftar isi yang berisi hyperlinks ke artikel-artikel pada topik diskusi Sebuah form pencarian untuk mencari kata atau kalimat di dalam topik diskusi Sebuah form entri untuk memasukkan bahasn diskusi Threaded replies, yang memberikan pilihan pengunjung untuk memilih apakah bahan diskusi yang dibuat dikirim untuk topik yang baru atau membalas topik yang sudah ada. Sebuah halaman konfirmasi, untuk memberitahukan bahwa artikel telah dikirim. Sebuah form pendaftaran jika pengunjung masuk ke situs web yang diproteksi. 3

4 7.3.1 Mengatur Forum Diskusi Web Anda dapat mengatur komponen-komponen untuk sebuah forum diskusi: Judul forum diskusinya Direktori web diskusi untuk menyimpan artikel. Mengatur format daftar isi. Mengatur penggunaan warna dan background yang digunkan di dalam halaman forum diskusi. Mengatur header dan footer di artikel. Mengatur tambahan informasi seperti waktu dan tanggal Managemen Artikel Forum Diskusi Anda dapat mengatur dan mengkontrol artikel-artikel yang masuk di forum diskusi, caranya: 1. Pada menu Tools, klik Web Settings, dan klik tab Advanced. 2. Pilih Show documents in hidden directories. 3. Klik OK. 4. Klik Yes untuk me-refresh web. 5. Klik Folders view. 6. Atur direktori untuk artikel forum diskusi tersebut. Misalkan nama file artkel adalah 0001.htm, 0002.htm, dan seterusnya. 7. Buka beberapa artikel yang dibutuhkan pada Page View dengan mendouble-click nama file Membuat forum diskusi Cara yang paling mudah adalah menggunakan Discussion Web Wizard. Wizard akan menanyakan komponen apa saja yang akan digunakan, membuatkan sebuah web dan menyediakan halaman-halaman pelengkapnya. Setelah web selesai, buka halamannya dan kemudian Anda dapat mengeditnya. 1. Pada menu File, klik New, lalu pilih Web. 2. Pada tab Web Site, klik Discussion Web Wizard. 3. Pada Choose a title for your web, ketikkan nama web baru Anda, dan klik OK. 4. Discussion Web Wizard akan terbuka. Ikuti petunjuk di layar untuk membuat forum diskusi. Setelah wizard membuat halaman web, Anda dapat mengubah sesuai kebutuhan. 4

5 LATIHAN BAB VII Membangun Content Situs Web 1. Buka file index.html di disket Anda kemudian lengkapi isinya seperti dibawah ini. A Web Development Homepage And Information Site anan Kami About Us Service Web Design Guestgbook Selamat datang di CyberXpro Homepage. Kami menawarkan jasa hosting web dan web desain. Jika anda merencanakan bisnis di World Wide Web, anda sudah berada di site yang tepat. Newsletter What's New? bmaster Directory Web Links p/interactive FAQs Forum CyberXpro memanfaatkan kemampuan server kami untuk e-commerce, on-line auction, chat forum, virtual postcard, polling dan survey, live audio dan video, secure conferencing, market research, banner advertisement, shopping cart, (virtual post office), classified ads, database, search engine, on-line store dan masih banyak lagi. ormation Contact Home About Us Web Design Guestbook Artikel Direktori Web Links FAQs Forum Contact Copyright 2003 The CyberXproTeam. All rights reserved. Keterangan: a. Untuk image CyberXpro di atas Anda dapat mengambilnya di disket Anda (a:/latihan/images/logocyber.jpg) dan image bullet di (a:/latihan/images/titik2bawah.gif) b. Copykan kedua image di atas ke dalam folder images di folder c:/inetpub/wwwroot/images. 5

6 2. About.htm A Web Development Homepage And Information Site anan Kami About Us Service Web Design Guestgbook About US Alamat kami: Jl. Gatot Subroto Km. 4,7 no. 126 bd Phone Facs Newsletter What's New? bmaster Directory Web Links p/interactive FAQs Forum ormation Contact Home About Us Web Design Guestbook Artikel Direktori Web Links FAQs Forum Contact Copyright 2003 The CyberXproTeam. All rights reserved. 6

7 3. Hosting.htm Web Development Homepage And Information Site anan Kami About Us Service Web Design Guestgbook bmaster Directory Web Links p/interactive FAQs Forum ormation Contact Fasilitas Standar yang terdapat pada masing-masing paket: Domain name sendiri Trafik Data Tak Terbatas Server Side Includes (SSI) PHP3 Counter Graphic Form Mail 24 jam akses FTP Alias UNLIMITED Directory CGI-BIN TANPA BIAYA PENDAFTARAN dan BIAYA LAIN-LAIN!! Dan Script yang dapat kami berikan, antara lain: Whois Tell A Friend Form Link/Search Engine Polls/Voting Simple Database Site Search Quote Display WebMail Biaya : Rp /tahun Newsletter What's New? Home About Us Web Design Guestbook Artikel Direktori Web Links FAQs Forum Contact Copyright 2003 The CyberXproTeam. All rights reserved. 7

8 4. Desain.htm Web Development Homepage And Information Site anan Kami About Us Service Web Design Guestgbook bmaster Directory Web Links p/interactive FAQs Forum EB DESIGN Desain Halaman Images Alamat URL Fasilitas Tambahan : 5 Halaman Rp ,- /tahun Newsletter What's New? ormation Contact : 10 Images : - Gratis 2(dua) POP - Gratis Maintenance selama 1 tahun - Gratis Counter Graphics - Gratis Feedback Form - Gratis Autoresponder - Gratis Promosi ke Search Engine. Home About Us Web Design Guestbook Artikel Direktori Web Links FAQs Forum Contact Copyright 2003 The CyberXproTeam. All rights reserved. 5. Untuk file Guestbook.htm dapat Anda ciptakan dari File New Page lalu pilih tab General dan pilih file Feedback Form. Ikuti instruksi wizard dan hasil dari feedback ini dapat Anda copykan ke template yang telah ada. 8

9 6. Untuk Direktori.htm yang merupakan file berisi link ke subdirektori Web Design, Computers dan Music dapat Anda peroleh di disket Anda. Keterangan: - Copykan file yang diperlukan ke web folder Anda seperti dirweb.htm, dircomputer.htm dan dirmusic.htm. 7. Untuk file links.htm, faqs.htm dan contact.htm dapat Anda peroleh dari disket Anda dan Anda harus mendesain agar tampilan sesuai dengan content yang dibuat sebelumnya. 8. Untuk file forum.htm Anda dapat ciptakan dari menu File New Web lalu dari jendela new web site klik file Discussion Web Wizards. 9