Selasa, 22 November 2011

Membuat Halaman WEB

A.    Perangkat Lunak untuk Pembuatan Halaman Web
Situs Web adalah lokasi internet yang menyajikan kumpulan informasi dengan menampilkan profil pemiliknya, baik pribadi maupun institusi sehingga dapat dikunjungi dan dibaca oleh pengguna internet.
Perangkat lunak yang digunakan dalam pembuatan internet antara lain sebagai berikut :
·         Internet Explorer atau Netscape Communicator sebagai browser.
·         Microsoft FrontPage, CoffeeCup, Evrsoft First Page, Macromedia Dreamweaver sebagai HTML editor.
·         Macromedia Flash, Adobe Image Styler, Adobe Photoshop sebagai software animasi.
·         Program FTP (File Transfer Protocol), misalnya WS_FTP untuk proses upload.
  1. Membuat Halaman Web Kosong
Kamu dapat membuat halaman web yang kosong tanpa format dengan cara sebagai berikut :
1.    Buka Microsoft FrontPage
2.    Klik menu file, New, Page or Web.
3.    Untuk memulai halaman web baru, pilih salah satu cara berikut.
a.    Klik Blank Page pada task pane New Page or Web.
b.    Klik Page Templates. Pada kotak ini, kamu dapat memilih template untuk membuat halaman tertentu.
c.    Pilih One Page Web. Pilihan ini akan membuat web baru dengan satu halaman baru. Selain itu, kita dapat memilih Web site Templates pada task pane.
Agar struktur web site baru sesuai dengan skenario yang telah kamu buat, gunakan bantuan tampilan navigation untuk membuat struktur halaman web.
Cara menyusun web site dengan navigation adalah sebagai berikut.
1.    Buat web site baru dengan nama websiteku.com. klik menu File, New, Page or Web.
2.    Pada task pane New Page or Web, klik One Page Web. Kotak dialog Web site akan ditampilkan. Pilih One Page Web. Pada bagian Option, isi dengan lokasi yang digunakan untuk menyimpan data web site.
3.    Klik View, Navigation sehingga area kerja navigation akan ditampilkan.
4.    Tambahkan halaman Profile dengan cara klik kanan pada kotak index.htm. pilih New, Page, hasilnya akan ditampilkan.
5.    Ubahlah nama New Page 1 dengan Profile.
6.    Ulangi langkah penambahan halaman baru seperti cara di atas untuk halaman Layanan, Hubungi Kami, dan Klien.
7.    Halaman Layanan, diberi subhalaman, yaitu halaman Promosi Web, Desain Web, Domain, dan Hosting. Untuk menambahkan halaman ini, caranya sebagai berikut.
a.    Klik kanan pada halaman Layanan.
b.    Pilih New, Page, maka halaman baru akan ditampilkan di bawah halaman Layanan.
c.    Beri nama halaman tersebut dengan Promosi Web.
d.    Subhalaman Desain Web, Domain, dan Hosting dibuat dengan cara yang sama.

  1. Membuat Navigasi Web
Navigasi web adalah sistem yang menghubungkan halaman web ke halaman web lain melalui hyperlink membentuk struktur situs web. Hyperlink adalah teks atau gambar yang jika diklik akan mengantarkan pengunjung web site ke halaman web lainnya. Pengunjung web site dapat menelusuri isi web site dengan cara mengklik pada hyperlink yang disediakan.
Hyperlink dapat dibuat antara lain:
1.    Membuat hyperlink pada halaman web secara manual
2.    Membuat hyperlink halaman web secara otomatis :
a.    Hyperlink halaman home atau level pertama
b.    Hyperlink halaman level kedua
c.    Hyperlink halaman level ketiga
3.    Mengedit Navigasi Web
Pengeditan pada navigasi akan mengubah struktur halaman web secara keseluruhan terutama pada link-link terkait. Untuk menambah halaman, tampilkan area kerja navigation lalu klik kanan pada kotak halaman yang ditambahkan ke seluruh halaman web. Untuk menghapusnya, pilih kotak halaman dan tombol Delete. Urutan menu navigasi dapat diubah dengan cara drag kotak halaman.
Menu link pada halaman web dapat diubah tampilannya menggunakan Link Bar Properties dengan cara klik dua kali pada kotak halaman di area kerja navigasi.
Untuk memasukan halaman lain ke dalam web tetapi di luar struktur navigasi, bukalah area kerja Folders. Klik kanan pada area kosong dan pilih New Page. Link pada halaman web dapat dinonaktifkan dengan memilih Included in Navigation Bars.
  1. Format CSS
CSS (Cascading Style Sheet) merupakan bahasa scripting yang digunakan untuk mengatur format dokumen. Cara menggunakan scripting CSS ini ada dua macam, yaitu script CSS yang diletakkan di dalam dokumen halaman web dan script CSS yang dibuat pada file terpisah. Dengan CSS, lay out web site lebih mudah diubah dan di-update.
1.    Pengenalan Style Sheet
Style Sheet merupakan fitur yang sangat penting dalam membuat Dynamic HTML. Style sheet digunakan untuk mengontrol dan mengatur style-style yang ada. Kamu juga dapat membuat efek-efek spesial di web dengan menggunakan style sheet.
Secara teoritis, kamu dapat menggunakan berbagai jenis style sheet technology dengan HTML. Akan tetapi, pada prakteknya hanya Cascading Style Sheet (CSS) technology yang dapat digunakan oleh hampir semua web browser karena CSS telah distandarkan oleh World Wide Web Consortium (W3C).
2.    Menggunakan CSS pada Halaman Web
Style-style yang akan digunakan untuk format teks dapat dimasukkan di dalam script CSS. Untuk dapat memasukkan script ini, kamu sebaiknya memahami terlebih dahulu sintaks dasar HTML. Sintaks ialah penulisan perintah pada program.
Pada program aplikasi FrontPage, halaman web dapat ditampilkan melalui tiga cara, yaitu Normal (untuk mengedit halaman), HTML (untuk melihat HTML code), dan Preview (untuk melihat tampilan sebelum menggunakan web browser). Struktur HTML terdiri atas dua bagian utama, yaitu bagian head (<head>) dan bagian body (tag <body>) sebsgsi berikut.
<html>
<head>
Isi head berupa meta tag, title dan script.
</head>
<body>
Penulisan CSS terdiri atas dua bagian yang dipisahkan oleh tanda kurung kurawal “{“ dan “}”. Bagian pertama di luar kurung kurawal digunakan untuk memilih jenis tag HTML (selector). Bagian kedua di dalam kurung kurawal disebut declaration yang mendefinisikan jenis style yang diformat (property) dan nilai pengubahan formatnya (value). Antara property dan value dipisahkan tanda titik dua “:”, sedangakn tanda titik koma “;”     digunakan untuk memisahkan qdeclaration satu dan lainnya. Script CSS yang berisi format teks dapat kamu tulis seperti berikut.
<style>
a:link         { text-declaration:none;color: #0000FF}
a:visited    { text-declaration:none;color: #0000FF}
a:hover     { text-declaration:underline;color: #FF0000}
h1             { font-family: Arial; color: #0000FF }
garis          { border-bottom: 2px dotted #FF0000}
          Script a:link untuk memberikan format teks yang mengandung hyperlink, a:visited untuk memberi format teks hyperlink yang link-nya telah dikunjungi, dan a:hover untuk memberikan teks hyperlink saat mouse di atas teks hyperlink. H1 untuk mendefinisikan style hadeing 1 dan garis untuk style garis.
3.    CSS pada file terpisah
Untuk memudahkan penyeragaman format CSS pada setiap halaman web, buatlah satu halaman web yang telah diformat menggunakan CSS lalu klik File, Save As. Pada pilihan Save as type, pilih HyperText Style sheet (*.css). buka dokumen halaman web lain yang ingin diberi format CSS sama seperti dokumen pertama. Lalu, klik Format, Style sheet Links dan klik Add.
  1. Membuat Tabel untuk Web
Pada prinsipnya, lay out menggunakan tabel bertujuan untuk membatasi halaman web. Sebelum melacak tampilan desain web, kamu harus merancang dulu informasi utama yang harus ditampilkan. Dengan demikian, kamu akan dengan mudah membuat lay out web dengan fasilitas lay out table sesuai kebutuhan.
  1. Grafis atau Gambar untuk Web
Jenis file gambar yang dapat digunakan untuk web adalah GIF, JPEG, dan PNG.
·         GIF (Graphics Interchange Format) merupakan format file yang biasa digunakan untuk menampilkan gambar dengan model warna index-color.
·         JPEG (Joint Photographic Experts Group) merupakan format file yang biasa digunakan untuk menampilkan gambar foto di dokumen HTML.
·         PNG (Portable Network Graphics) merupakan format file yang tepat digunakan untuk menampilkan gambar pada halaman web.


  1. Membuat Nama Domain dan Hosting
Nama domain atau Domain Name System (DNS) adalah sebuah alamat di internet. Alamat antara komputer yang satu dengan yang lainnya tidak sama. Alamat ini dikenal dengan istilah IP (Internet Protocol) adress atau alamat IP.
Jika kamu mendaftarkan sebuah nama domain, nama domain yang kamu daftarkan akan masuk ke dalam daftar domain yang ada di seluruh dunia. Banyak perusahaan yang menawarkan jasa untuk mengurus pembelian nama domain. Perusahaan yang menyediakan jasa pengurusan nama domain dikenal dengan sebutan Registars. Pengecekan pendaftaran nama domain dapat dilakukan menggunakan fasilitas Whols.
  1. Mendaftarkan Alamat Domain ke Provider Web Hosting
1.    Kriteria yang dipertimbangkan dalam memilih web hosting
Dalam memilih web hosting, kita harus mempertimbangkan kapasitas penyimpanan data yang disediakan, bahasa pemrograman yang didukung, juga biaya untuk menyewa web tersebut.
2.    Mendaftarkan Domain Web Hosting
Langkah-langkah :
a.    Pastikan komputer kamu terkoneksi ke internet. Buka browser internet yang ada pada komputermu, kemudian masuk ke web site.
b.    Untuk memulai proses pendaftaran, klik link Sign up yang ada pada halaman itu.
c.    Pilihlah FREE BUILDER untuk membuat domain web, lalu klik SETUP NOW.
d.    Kamu dapat memasukan nama yang kamu inginkan pada kotak isian sebelah tulisan http://
e.    Jika nama domain yang dipilih belum ada yang memakai, kamu akan mendapatkan nama domain tersebut.
  1. Melakukan Upload
Proses transfer data dari komputer kita ke web server dikenal dengan istilah upload. Untuk melakukan proses tersebut, kita menggunakan software FTP (File Transfer Protocol). Software FTP yang akan digunakan adalah WS_FTP. Software ini dapat kamu download secara gratis untuk 30 hari pertama melalui web site  www.ipswitch.com. Software FTP lain yang gratis sepenuhnya ialah Core FTP. Software ini dapat di download dari www.coreftp.com. Setelah di download, install program ini di komputer.

Kelompok XI IPA 2
Ketua : Resty Affiani
Anggota:
Riqqie Subagja
Veni Atsari
Cucu Lisnawati