Dirangkum oleh : Dhea Rizki Nurjanah
Fadila
Nurhayati
Yusa Albiansyah
Kelas : XI IPA 1
A.Perangkat unak Untuk Pembuatan Halaman Web
Situs web adalah lokasi di internet yang menyajikan kumpulan informasi dengan menampilkan profil pemiliknya, baik pribadi maupun institusi sehingga dapat di kunjungi dan di baca oleh pengguna internet.
Prangkat lunak yang sering digunakan dalam pembuata web page , antara lain sebagai berikut.
- Internet exploler atau netscape comunicator sebagai browser.
- Microskop FrontPage, CoffeCup, Evrsoft First Page, Macromedia Dreamweaver sebagai HTML editor
- Macromedia flash, Adobe Images Styler, Adobe Photoshop, sebagai software animasi
- Program FTP (File Transfer Protocol) misalnya WS_FTP untuk proses upload
Untuk menbuat Homepage sederhana seperti dalam pembahasan buku ini, kita menggunakan Microsft FrontPage sebagai HTML editor.
B.Membuat Halaman Web Kosong
Cara pembuatan halaman web sederhana dan strukturnya menggunakan program aplikasi FrontPage.cara membuat halaman web yang kosong tanpa format dengan cara sebagai berikut.
- Buka Microsoft FrontPage
- Klik menu File,New,Page or web.task pane New Page or Web akan ditampilka.
- Membuat halaman web baru pilih salah satu cara berikut :
a. klikBlank Page pada task Pane New Page or Web
b. klik page Templates untuk membuat halaman kosong tanpa format khusus,pilih Normal Page,klik Ok.
c. Pilih One Page Web,klik One Page Web,klik Ok.
Cara menyusun web site dengan navigation sebagai berikut :
1) Klik menu File, New Page or Web
2) Pada task pane New Page or Web klik One Page or Web
3) Klik View
4) Pilih New,Page,hasilnya akan ditampilkan
5) Ubah nama new page 1 dengan profile.caranya klik new page 1 ketik profile,tekan enter.
6) Ulangi langkah penambahan baru.
7) Halaman layanan,diberi sub halaman yaitu promosi web,desain web,domain,dan hosting.
C.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 lainya.
1.Membuat hiperlink pada halaman web secara manual
Hyperliunk dapat dibuat dengan mudah.berikut ini akan di jelaskan cara menghubungkan halaman web ke halaman web lainnya dengan hyperlink
a. Buka halaman index.htm.
b. Tambahkan teks pada halaman web dengan cara diketikan seperti layaknnya kamu bekerja dengan MS
c. Sorot atau blok teks home kemudian klik tombol insert hyperlink pada toolbar atau klik menu Insert Hyperlink.kotak dialog insert hyperlink akan di tampilkan.
d. Pilih File index.htm pada kolom addres akan tampil halaman index.htm
e. Lanjutkan dengan cara yang sama, untuk teks profile, sorot teks profile, klik tombol Insert tombol Hyperlink.
f. Klik profile,klik Ok.
g. Ulangi langkah-langkah tersebut.
h. Simpan halaman dsengan klik Menu File, Save.
i. Ulangi langkah 1-7 untuk menambahkan hyprlink pada halaman selain index yaitu profile.htm,layanan.htm, hubungikami.htm,dan klien.htm.
2.membuat hyprlink halaman web secara otomatis
a.hyperlink halaman home atau level pertama
cara untuk membuat hyperlink pada level pertama adalah :
1) Kosongkan hyperlink pada masing-masing halaman web(index.htm,profile.htm,layanan.htm, dan seterusnya.)
2) Pembuayan hyperlink otomatis dimulai dari halaman index.buka halaman indrx.htm
3) Tambahkan hyperlink pada bagian kiri halaman index dengan cara:
a. Klik menu Insert,Navigation.kotak dialog Insert Web Component akan ditampilkan.pada Component type, pilih Link bars.
b. Pilih Bar Based on navigationb structure dibagian chosse a bar type, kemudian klik tombol next.
c. Klik Next.
d. Pilih halaman dengan link tersusun vertikal pada choose an orientation,kemudian klik Finish.
e. Pada tab general,pilih chiled level dan pilih home page untuk bagian aditional pages .
f. Jika klik Find Componen on the web akan terhubung ke web browser yang menampilkan halaman Microsoft Officer Update di internet.
g. Klik Ok.
b.Hypelink Halaman Level kedua
cara menambahkan navigasi untuk halaman Profil, Layanan, Hubungi kami, dan Klien yang berada level kedua adalah sebagai berikut:
1) Buka halaman profil.htm dengan klik dua kali pada file tersebut.
Halaman profil.htm akan terbuka.
2) Klik menu insert, Navigation.
3) Pilih Bar based on navigation structure,klik Next. Pilihan Choose akan a bar style akan di tampilkan. Pilih use pages theme.klik next
4) Pilih vertikal, lalu klik Finish kotak dialog Link Bar Propeties ditampilkan.
5) Untuk memudahkan membuat menu navigasi,cukup dengan menggunakan copy menu navigasi pada halaman Profile. Kemudian klik paste.
c.Hyperlink Halaman Ketiga
Halaman layanan mempunyai 4 subhalaman,yaitiPromosi Web, Desain Web, Domain, dan Hosting.
Untuk menambah menu navigasi
1) Buka halaman promosi Web dengan klik 2kali pada file promosi web.htm.
2) pilih Parent Level dan Home Page.
3) Klik tombol OK
4) Klik finish sehingga kotak dialog akan Link Bar Propetias ditampilkan. Pilih Same level.
5) Klik OK
6) Untuk halaman lain yang satu level dengan halaman Promosi Web,copy menu navigasi vertikal maupun horizontal dan paste ke masing-masing halaman
7) Pada halaman Layanan ,tambahkan menu navigasi horizontal.
3.Mengedit Navigasi Web
Untuk menambah halaman, tampilkan area kerja Navigation lalu klik kanan pada kotak halaman yang berada pada level di atasnya. Pilih New, Page or Web. Untuk menghapusnya, pilih kotak dhalaman dan klik tombol Delet.
Menu link pada halaman web dapat di ubah tampilannya menggunakan Link Bar Propeties.link pada halaman web dapat dinonaktifkan dengan memilih Included in Navigation Bars.
D .Format CSS
CSS(Cascanding Style Sheet) merupakan bahasa scrifting yang digunakan untuk mengatur format dokumen.
1.Pengenalan Style Sheep
Style sheep merupakan fitur yang sangat penting dalam membuat Dynamic HTML.style sheet digunakan untuk mengontrol style-style efek yang ada. Disebut juga sebagai Template . kamu dapat menggunakan style sheep yang mendefinisikan style untuk <h1> (heading1) dengan huruf tebal dan berwarna biru atau pada tag <p> (paragraf) yang ditampilkan sebagai jarak antar teks yang lebih lebar dibanding sebelumnya.
2.Menggunakan CSS pada halaman web
Style-style yang akan digunakan untuk format teks dapat dimasukan dalam script CSS. SINTAKS ialah penulisan printah pada program tag dibuat dengan menuliskan printah diantara dua tanda kurung sudut “<” dan “>” .tag penutup ditambahkan tanda garis miring”/” misal <b> huruf tebal </b> akan dibaca oleh web sebagai huruf tebal. Halaman web dapat ditampilkan melalui tiga cara yaitu normal (untuk mengedit halaman), HTML (untuk melihat html code), dan Preview dibagian bawah jendela FrontPage.
3.CSS Pada File terpisah
Penerapan CSS yang diletakkan pada bagian Head setiap halaman web tampaknya kurang praktis.hal ini sangat terasa ketika style-style yang digunakan cukup banyak.Apabila trejadi perubahan style-style tersebut,kamu harus mengganti style-style pada setiap halaman web.
E.Membuat table untuk web
Kendala yang umum ditemukan saat mendesain web adalah penempatan objek-objek secara bebas pada halaman web.Pada prinsipnya,lay out menggunakan table bertujuan untuk membatasi halaman web. Tabel tersebut akan dibagi-bagi kedalam sel. Posisi dan ukuran akan disesuaikan dengan kebutuhan.
F. Grafis atau Gambar Untuk Web
Jenis file gambar yang sering digunakan untuk web adalah GIF,JPEG,dan PNG.Masing-masing jenis memiliki kelebihan dan kelemahan.
· GIF (Graphics Interchange Format) merupakan format file yang biasa digunakan untuk menampilkan gambar dengan model warna index-color
· JPEG (Joint Photografic Experts Group) merupakan format file yang biasa digunakan un tuk menampilkan gambar foto di dokumen HTML.
· PNG (Portable Network Graphics) merupakan format file yang tepat diggunakan utuk menampilkan gambar pada halaman web.
G. Membuat NAma Domain dan Hosting
Domain dan web hosting adalah dua yhal yang tidak dapat dipisah jika bekerja dengan web site.
Nama domain atau Domain Name System (DNS) adalah sebuah nama di internet. Setiap computer yang terhubung ke internet memiliki sebuah alamat yang unik, artinya alamat computer yang satu dengan yang lainnya tidak sama. Alamat ini dikenal dengan istilah IP (Internet Protocol) address atau alamat IP. Alamat IP adalah serangkaian nomor unik. Alamat IP adalah sesuatu ang sulit di ingat. Oleh karena itu system DNS diciptakan.
Jika di analogikan, DNS adalah nama alias dari sebuah alamat IP.
H. Mendaftarkan Alamat Domain ke Provider Web Hosting
1.Kriteria yang Dipertimbangkan dalam Memilih Web Hosting
Ketika akan memublikasikan web site, harus diketahui terlebih dahulu tentang web hosting. Harus mempertimbangkan kapasitas penyimpanan data yang disediakan,bahasa pemrograman yang didukung, juga biaya untuk menyewa web tersebut.
2.Mendaftarkan Domain Web Hosting
Setelah memiliki dokumen yang siap untu dipublikasikan, haruslah memiliki web server. Web server adalah lokasi untuk menempatkan halaman web dan data yang berhubungan dengan web site yang dibuat sehingga data dapat diakses dan dilihat oranglain.
I.Melakukan Upload
Apabila web site yang telah dirancang sudah selesai dan juga telah memiliki domain dan web hosting yang akan digunakan untuk menyimpan file-file, proses terakhir yang harus ditempuh agar web site dapat on line dan dapat dilihat orang lain adalah memindahkan file-file we site yang ada di komputer ke web hosting.
Proses transfer data dari computer ke web server (web hosting/komputer remote) dikenal dengan istilah upload. Untuk melakukan proses tersebut kita menggunakan software FTP (File Transfer Protocol). Pada saat melakukan proses transfer data, kamu harus berkomunikasi dengan komputer remote terlebih dahulu. Komputer remote akan mengecek keberadaan user name dan password yang kamu masukkan.