BAB II Proyek Web/HTML Menggunakan Microsoft FrontPage Click to edit Master subtitle style

Nama Kelompok: Ulfa Pratiwi P. (021111133) Novi Wijayanti (021111157) Dosen: Dr.Wonny A.R,MM.,SE Fakultas Ekonomi Universitas Pakuan 1/18/13

merancang halaman Web dengan menggunakan FrontPage. - Mampu membuatstyle Click to edit Master subtitle sebuah halaman Web dasar. - Mengetahui bagaimana cara mengontrol format kata-kata dan gambar-gambar pada sebuah halaman web.

1/18/13

- Mengetahui bagaimana cara menciptakan tabel-tabel dan daftar-daftar pada sebuah halamn Click Web. to edit Master subtitle style - Mengetahui bagaimana cara menciptakan link ke halaman Web lain, e-mail, dan bagian-bagian halaman Web yang lain.

1/18/13

FrontPage merupakan suatu aplikasi peranti lunak yang mudah digunakan Click to edit Master subtitle style untuk membuat halaman Web yang sederhana. Penggunaan editor teks untuk membuat sebuah halaman Web memerlukan waktu yang lebih banyak dan sedikit lebih sulit, namun memberikan anda kontrol yanh lebih besar terhadap desain halaman Web tersebut. Suatu contoh tahap demi tahap 1/18/13 menggambarkan teknik-teknik dan

Click to edit Master subtitle style

Konsep yang akan dibutuhkan untuk proyek ini. Dengan mempelajari contoh ini.

1/18/13

MEMBUAT DOKUMEN FRONTPAGE

Instruksi-instruksi ini secara umum akan Click to edit Master subtitle style mengarahkan Anda kepada perintah dan subperintah yang akan mendapatkan efek yang diinginkan. Microsoft FontPage memiliki banyak ikon yang dapat melakukan operasi yang sama dengan satu klik mouse saja. Jika Anda memindahkan kursor ke atas suatu ikon dan menunggu sebentar,sebuah kotak penjelasan akan muncul dan memberitahu apa yang akan 1/18/13 terjadi jika suatu ikon di-klik.

Click to edit Master subtitle style

Mulailah dengan membuka program Microsoft FrontPage. Klik tombol Start di bagian sebelah kiri layar. Kemudian pilih All Programs

1/18/13

dan klik dua kali program Microsoft FrontPage. ini

1/18/13

Layar Awal Front Page

1/18/13

Gantilah judul proyek dengan memilih perintah File diikuti dengan subperintah Save As

1/18/13

bisa dilihat contoh ini menyimpan file untuk halaman Web pada desktop komputer dan menggunakan nama asli file index.htm

1/18/13

Ketik University Pizza pada halaman tersebut. Tekan tombol Enter pada papan ketik untuk membuat kalimat lain di halaman web. Tandailah kata-kata University Pizza dan kemudian pilihlah poin 18 untuk ukuran font dari menu drop-down.

1/18/13

1/18/13

Selanjutnya pilihlah perintah format diikuti dengan subperintah paragraph dan pilihlah pilihan center

1/18/13

1/18/13

Selanjutnya, buatlah daftar lokasi. Ketik kata Locations. Perlu dicatat bahwa jika Locations muncul di tengah-tengah halaman dengan huruf-huruf besar maka itu berarti Anda tidak memindahkan kursor ke bawah membuat garis baru setelah Anda mengetikkan University Pizza tadi. Ini mudah untuk diperbaiki, tandailah Locations dan kemudian pilihlah perintah Format diikuti dengan subperintahParagraph dan Alignment dari pilihan menu drop-down. Buatlah agar 1/18/13

1/18/13

ditampilkan Figur di bawah ini.

Click to edit Master subtitle style

1/18/13

Kemudian masukan tiga frase Commuter Parking Lot, Recreation Center, dan 101 North Main Street, dan tekan kunci Enter setelah Anda mengetik tiap frase. Anda akan melihat bahwa sebuah bulatan muncul setelah Anda masukkan 101 North Main Street. Hanya tekan kunci Enter lagi dan bulatan ini akan mengilang, dan Anda akan dapat mengetikkan kembali informasi untuk halaman Web tersebut.

1/18/13

1/18/13

TABEL
Mengetahui bagaimana cara membuat tabel pada halaman Web merupakan sebuh keahlian yang penting. Tabel memungkinkan Anda untuk mengontrol format halaman di sisi lebarnya. Biasanya, teks hanya akan terketik begitu saja di halaman Web. Tabel merupakan sesuatu yang sederhana untuk dimasukkan, dan memungkinakan Anda untuk mengontrol tampilan halaman Web tersebut.
1/18/13

Jaga agar kursor Anda terletak di bawah daftar lokasi. Pilihlah perintah Table, subperintah Insert, dan kemudian pilihlah pilihan Table, seperti yang ditunjukkan gambar berikut. Pada layar yang tampil, pilihlah tabel dengan empat kolom dan empat baris. Anda dapat melihat selsel tabel. Nanti Anda akan mempelajari bagaimana cara menyembunyikan garis-garis sel.

1/18/13

1/18/13

atau seluruh barisan. Lalu pilihlah perintah Format diikuti dengan subperintah Font. Dari jendela yang muncul pada pilihan Font Style, to edit Master subtitle style pilihlah Italic. Click

1/18/13

Sekarang pilihlah ulang semua sel di dalan tabel dan pindahkan nilai-nilai di dalam sel ke tengah. Ini dapat dilakukan (dengan meng-highlight semua sel) dengan cara memilih perintah Format diikuti dengan subperintah Paragraph dan kemudian memilih pilihan alignment Center.

1/18/13

1/18/13

1/18/13

MENAMBAHKAN GAMBAR Gambar dapat menjadi sebuah bentuk komunikasi yang memiliki kekuatan pada suatu halaman Web. Geserlah kursor dua baris di bawah tabel, lalu klik perintah Insert diikuti dengan subperintah Picture. Akhirnya pilihlah Clip Art, seperti yang ditunjukkan gambar berikut.
Click to edit Master subtitle style

1/18/13

1/18/13

Ketika layar selanjutnya, ketiklah kata pizza dan pilihlah sebuah gambar untuk digunakan. Gambar-gambar ini memiliki menu drop-down yang memberi Anda kesempatan untuk memasukkan gambar ke dalam halaman Web. Setelah Anda memasukkan gambar tersebut, tekanlah kunci Enter dua kali untuk membuat halaman Web bergerak turun. Tergantung pada setting FrontPage yang sudah ada, Anda dapat menemukan kursor terletak di tengah setelah Anda memasukkan gambar ke dalam halaman Web. Untuk memindahkan kursos ke sebelah kiri, klik Format diikutidengan subperintah :Paragraph. Pada Alignment, pilihlah Left. 1/18/13

1/18/13

Sekarang setelah Anda memasukkan gambar ke dalam halman Web, waktunya untuk menyimpan file Anda..

Click to edit Master subtitle style

1/18/13

Gambar yang Anda ambil dari clip art Microsoft berbentuk Windows Media Format (WMF), tapi Anda harus menyimpannya dalam bentuk yang lebih dikenal oleh halaman Web. Ketika Anda mengklik tombol Picture Opitions,

1/18/13

pilihlah format file GIF. Kemudian klik OK untuk menyimpan file tersebut dengan nama file yang baru. Simpanlah file FrontPage Anda secara berkala. Kebanyakan siswa menyimpan file mereka setiap 10 menit. Ini di sebabkan karena jika suatu masalah komputer terjadi, misalnya listrik mati, hanya hasil kerja selama sepuluh menit yang akan hilang

1/18/13

1/18/13

1/18/13

DAFTAR BERNOMOR Sekarang harus menambahkan sebuah daftar bernomor ke dalam halaman Web. Tiga alasan telah diberikan untuk memesan pizza dari University Pizza. Pertama-tama harus memasukan kalimat Why order from us? pada halaman web tersebut. Kemudian tekan kunci Enter untuk mendapatkan baris baru.
1/18/13

1/18/13

Pilihlah ikon bernomor dan masukkan tiga alasan. Ingatlah bahwa setelah memasukkan alasan yang ketiga dan menekan kunci Enter, angka 4 akan muncul pada daftar. Tekanlah kunci Enter sekali lagi dan ini akan mengakhiri isian untuk daftar bernomor.

1/18/13

1/18/13

LINK HALAMAN WEB

bagian akhir dari ini adalah untuk menciptakan tiga jenis link : sebuah link untuk alamat e-mail, sebuah link untuk halaman Web yang lain, dan sebuah link untuk bagian lain halaman Web tersebut. Perangkat ini khususnya berguna unuk memberikan suatu cara bagi orang yang membaca halaman Web tersebut untuk mengirimkan e-mail kepada orang yang menciptakannya. 1/18/13

Klik perintah Insert diikuti dengan subperintah Hyperlink.

1/18/13

Amat sangat penting untuk memilih E-mail Address sebagai jenis hyperlink. Pada bagian Text To Display, masukkan kalimat Contact Us pada bagian E-mail Address, masukkan alamat e-mail Anda. Ketika mengetik, Frontpage secara otomatis memasukkan malto: ke awal alamat e-mail Anda. Bagian terakhir yang harus di isi adalah subject. Masukkan frase Pizza Delevery

1/18/13

1/18/13

Selanjutnya akan membuat sebuah link untuk halaman Web sekolah Anda. Sekali lagi, klik perintah insert diikuti dengan subperintah Hyperlink. Kali ini pastikan memilih kotak Existing File or Web Page di bawah kolom Link to. Pada bagian Text to Display, ketikan Link to My School. Pada bagian Address, ketikan http://WWW.PIZZAHUT.COM

1/18/13

1/18/13

1/18/13

Sekarang tempatkan kursor di bagian atas halaman, klik mouse sekali untuk menempatkan kursor sebelum U di University Pizza. Sekarang pilihlah perintah insert diikuti dengan subperintah Bookmark. Sebuah jendela akan muncul menanyakan nama bagi pembatas buku (Bookmark). Masukkan Beginning sebagai namanya. Sebuah ikon bendera kecil akan tampil di depan University Pizza
1/18/13

1/18/13

1/18/13

Hasilnya akan seperti ini

1/18/13

Pindahkan kursor ke bagian bawah halaman Web. Pilihlah perintah Insert diikuti dengan subperintah Hyperlink. Ketika sebuah jendela muncul, pastikan memilih Place in this Document dari kolom Link to. Masukkan Go to Top of Page pada bagian yang berlabel Text to display. Pastikan mengklik Beginning sebagai pembatas buku untuk link tersebut. Setelah memilih tombol Ok, link anda ke atas halaman akan selesai
1/18/13

1/18/13

Hasilnya akan seperti ini

1/18/13

MELIHAT HALAMAN WEB YANG TELAH DIKERJAKAN

Di bagian bawah layar FrontPage terdapat tiga pilihan: Normal, HTML, dan Priview. Klik Priview dan Anda akan mellihat bagaimana halaman Web akan ditampilkan pada browser.

1/18/13

1/18/13

Klik link Contact Us, sebuah jendela yang berinteraksi dengan program e-mail anda akan terbuka. Pada bagian To, Anda dapat melihat alamat e-mail Anda. Pada bagian subject, Anda akan melihat Pizza Delivery, jika tulisan-tulisan ini tidak muncul, maka kemungkinan komputer anda tidak mengizinkan untuk mengirimkan e-mail atau Anda belum membuat link dengan benar.

1/18/13

1/18/13

KELEBIHAN dan KEKURANGAN FRONTPAGE

Apa yang ditampakkan oleh halaman Web bukanlah apa yang digunakan oleh Browser Web tersebut untuk membuat halaman tersebut. Jika anda mengklik tab HTML atau Split di bagian bawah jendela FrontPage, akan tampil kode komputer yang diproses oleh browser Internet Anda. Periksalah kode yang dihasilkan untuk menghasilkan halaman Web tersebu dan cobalah untuk menemukan gambar dan link yang Anda tempatkan 1/18/13 dihalaman Web tersebut.

menggunakan FrontPage untuk membuat halaman Web. Tetapi, harus membuat berbagai asumsi dan default untuk membuat sebuah halaman Web. Ini akan menghasilkan file komputer yang panjang sekadar untuk melakukan tugas yang sederhana. Keuntungan menggunakan FrontPage untuk membuat halaman Web adalah kemudahan penggunaannya. Kelemahannya adalah kode HTML (kode yang diproses oleh browser Internet) yang dihasilkan tidak efisien. Komputer dan peranti lunak semakin murah, sementara biaya gaji dan upah semakin tinggi. Oleh karena itu, kebanyakan organisasi mengandalkan peranti lunak 1/18/13

DAFTAR PUSTAKA Raymond McLeod, Jr dan George P. Schell. Sistem Informasi Manajemen, edisi 10. Jakarta : Salemba Empat., 2008.
Click to edit Master subtitle style

1/18/13

1/18/13