Materi 1
Mengenal FrontPage
Merupakan salah satu program editor html yang digunakan untuk membuat halaman web. Dalam Aplikasi ini, seseorang tidak perlu bersusah payah mengetikkan script html yang cukup sulit, namun cukup memasukkan teks dan langsung dapat ditampilkan dalam browser. Dengan kemudahan tersebut, maka FrontPage dapat dijadikan sebagai salah satu aplikasi yang banyak digunakan dalam pembuatan halaman Web dengan hasil yang cukup professional.

Menjalankan FrontPage
Cara yang digunakan adalah sebagai berikut:
1.	Klik tombol Start, kemudian arahkan pada All Programs dan Microsoft Office selanjutnya klik pilihan Microsoft Office FrontPage
2.	Pada layar/monitor terlihat tampilan FrontPage 

Membuat Web Site Baru
Cara yang digunakan adalah sebagai berikut:
1.	Aktifkan FrontPage seperti cara-cara diatas, kemudian Klik menu File atau Klik pilihan Create a new page or site pada task pane
2.	Pilihan New pada Task Pane akan telihat pada layar/monitor
3.	Pada bagian New Web Site, Klik pilihan One page Web Site dan di layar/monitor akan terlihat kotak dialog Web Site Templates
4.	Pada bagian Options, ketik folder dan alamat Web Site baru yang akan dibuat, atau dapat diakses denganh web server dengan http://localhost/latihan2
5.	Klik tombol OK dan di layar akan terlihat kotak dialog Create New Web Site
6.	Tunggu beberapa saat dan di layar/monitor akan terlihat beberapa folder dan file index.htm
7.	Lakukan hal yang sama untuk membuat web site baru lainnya. Disamping itu anda dapat membuat halaman web site baru yang masih kosong tanpa format dengan cara sebagai berikut:
•	Pada bagian Task Pane New, Klik pilihan Blank Page pada bagian New Page
•	Kemudian pada layar/monitor akan terlihat halaman web baru yang siap untuk dilengkapi teks, gambar dan komponen-komponen yang lainnya.

Selain cara yang diatas tersebut, membuat halaman web site babru dapat dilakukan dengan cara sebagai berikut:
1.	Klik pilihan More Page Templates, kemudian di layar/monitor akan terliahat kotak dialog Page Templates
2.	Pada kotak dialog tersebut di atas, klik pilihan Normal Page, kemudian Klik OK 
3.	Di layar/monitor akan terlihat halaman web yang  baru. Disamping itu anda dapat memilih halaman web tertentu seperti Halaman PhotoGallery, Feedback, Confirmation Form, Guest Book dan lain-lain.

Materi 2
Area Kerja (Editing) FrontPage

•	Area Kerja Web Site:

Area Kerja Folders  menampilkan folder dan file yang terdapat dalam sebuah web site, selain itu juga dapat menambahkan folder baru, file baru dan melakukan navigasi untuk mengetahui isi suatu folder, merubah nama file, merubah title halaman web secara langsung dan menambahkan komentar atau catatan untuk setiap halaman web.
Area Kerja Remote Web Site  untuk publish Web, yaitu mengirim data Web Site pada server web atau web hosting atau pada tempat tertentu pada komputer anda. Untuk mengaktifkannya cukup Klik tombol Remote Web Site di bawah pada area kerja web site. Untuk melakukan proses publish web terlebih dahulu anda klik tombol Remote Web Site Properties.
Area Kerja Report  mengontrol dan menganalisa web site, yang terdiri dari Site Summary (menampilkan jumlah file dan ukurannya, gambar, hyperlink dan keterangan), Files (menampilkan informasi tentang file, misalnya kapan tersebut dibuat), Share Content (menampilkan fasilitas yang digunakan bersama-sama dalam pengembangan web, misalnya theme, style, dynamic web template dan share border), Problems (menampilkan informasi yang menjadi masalah dalam web), Workflow (menampilkan status dan pengelolaan file dalam web site), Useg (menampilkan laporan tentang kunjungan web site).
Area Kerja Navigation  berfungsi untuk mengelola struktur web site, misalnya menambah halaman web, menghapus dan mengatur struktur navigasi serta memindahkan halaman web.
Area Kerja Hyperelink  berfungsi untuk menampilkan status hyperlink dari masing-masing web dalam web site, baik link internal maupun link eksternal.
Area Kerja Task  berfungsi untuk menampilkan informasi jadwal kerja yang akan dilakukan untuk pengembangan web site. Informasi ini bermanfaat apabila akan membuat web site dalam satu tim dan dikerjakan secara bersama-sama dalam jaringan intranet.

•	Area Kerja Editing Web Site

Area Kerja Design  menampilkan halaman web site, dapat menyisipkan teks, gambar, table dan komponen lain secara langsung.
Area Kerja Split  berfungsi membagi tampilan menjadi dua bagian, yaitu bagian atas untuk menampilkan kode html dan bagian bawah untuk menampilkan desain halaman. 
Area Kerja Code  berfungsi untuk menampilkan kode-kode html secara keseluruhan, dilengkapi dengan nomor baris, tag html, sehingga tidak perlu lagi menulis kode-kode tersebut secara lengkap.
Area Kerja Preview  berfungsi untuk menampilkan hasil desain web seperti menampilkan pada halaman browser.

Materi 3
Menyimpan Web Site

Cara yang digunakan untuk menyimpan web site yang sudah dibuat adalah:
1.	Klik menubar File
2.	Klik pilihan Save atau Ctrl +S atau Klik Ikon Save  pada Toolbar Standard

Apabila akan menyimpan halaman Web dengan nama lain, maka gunakan cara berikut:
1.	Klik menubar File
2.	Klik pilihan Save As dan dilayar akan terlihat kotak dialog Save As
3.	Tentukan Drive dan Folder sesuai keinginan
4.	Ketik Nama File pada bagian File Name, misalnya ketik nama file Utama (nama file yang digunakan tidak boleh sama dengan nama file yang sudah ada)
5.	Klik tombol Save 

Membuka Web Site

Cara yang digunakan untuk membuka web site yang telah dibuat adalah:
1.	Aktifkan Program FronPage
2.	Klik Menubar File, kemudian pilih Open Site
3.	Tentukan nama file web site yang akan dibuka
4.	Klik tombol Open
5.	Kemudian beberapa saat akan ditampilkan folder dan file web site tersebut

Mengakhiri Aplikasi FrontPage
Mengakhiri dengan menggunakan cara sebagai berikut:
1.	Simpan halaman web site yang telah dibuat / diedit
2.	Pilih salah satu langkah berikut untuk mengakhiri / menutup penggunaan FrontPage:
•	Klik menubar  File, kemudian Klik pilihan Exit
•	Klik tombol Close (X)
•	Klik dua kali (double click) Icon Kontrol Menu yang berada pojok kiri atas
•	Tunggu beberapa saat dan selesai

Materi 4
Navigasi pada Web Site

Sebagai contoh rencana isi web site tersebut adalah sebagai berikut:
Halaman Home
Halaman Profile
Halaman GalleryPhoto

Cara yang digunakanuntuk membuat web site dengan navigation sebagai berikut:
1.	Buatlah web site baru dengan cara Klik Menu File, kemudian Klik pilihan New dan di layar akan terlihat Task Pane
2.	Pada bagian New Web Site, Klik pilihan One Page Web Site dan di layar akan terlihat kotak dialog Web Site Templates 
3.	Ketik lokasi dan nama file melalui http://localhost/latihan2
4.	Klik tombol OK dan di layar akan terlihat web site baru dengan satu halaman web index.htm
5.	Klik Menubar View dan pilih Navigation atau Klik Tab Navigation di bagian bawah halaman web sehingga area kerja Navigation akan terlihat di layar / monitor
6.	Kemudian pada layar akan terlihat halaman index.htm sebagai Halaman Home yang secara otomatis akan ditampilkan saat web site diakses.
7.	Klik kanan pada halaman home (index.htm), kemudian arahkan pada Pilihan New dan klik pilihan Page
8.	Maka di layar akan terlihat halaman baru dengan nama New Page 1

Index.htm

New Page 1

9.	
Index.htm

Rubah nama New Page 1 tersebut dengan nama Profile dan akhiri dengan enter

Profile 

10.	Lakukan hal yang sama untuk menambah halaman baru lainnya.

Materi 5
Membuat Hyperlink secara Manual
Cara yang digunakan adalah:
1.	Buka halaman web index.htm dengan double click pada file index.htm
2.	Ketik judul Selamat Datang dan teks menu Home, Profile, Biodata, Gallery Photo, yang akan dibuat hyperlink.
3.	Sorot teks Home, kemudian klik menubar Insert dan pilih Hyperlink atau klik ikon Insert Hyperlink pada toolbar standard. Pada layar monitor akan terlihat kotak dialog Insert Hyperlink.
4.	Klik file index.htm pada kotak dialog tersebut, sehingga pada Address akan tampil halaman index.htm.
5.	Klik tombol OK, maka pada teks Home akan terlihat garis bawah dan warna yang berbeda.
6.	Lakukan hal yang sama untuk menambah hyperlink pada menu atau submenu sesuai keinginan.
7.	Ulangi langkah-langkah proses pemberian hyperlink pada menu yang lain.
8.	Save dan tampilkan dalam priview in browser

Membuat Hyperlink secara Otomatis
Buatlah terlebih dahulu navigasi sehingga terlihat sebagai berikut:

Index.htm

Profile

facebook

Gallery Photo

Biodata

Cara pembuatan hyperlink untuk setiap level berbeda-beda. Pada contoh tersebut di atas terdiri dari dua level, yaitu level pertama atau tertinggi (halaman Home atau File Index.htm), halaman level kedua yaitu Profile, Biodata, Gallery Photo, dan lain-lain.

Hyperlink Halaman Home atau Level Pertama
Cara yang digunakan untuk membuat hyperlink pada level pertama atau pada file Index.htm adalah sebagai berikut:
1.	Buat halaman web baru
2.	Ketik teks bagaian atas
3.	Pastikan kursor berada pada posisi rata kiri halaman web, kemudian klik menu Insert dan klik pilihan Navigation. Pada layar akan terlihat kotak dialog Insert Web Component dengan Pilihan default Link Bars.
4.	Kilik pilihan Bar based on navigation structure di bagian Choose a bar type, kemudian klik pilihan Next dan pada layar monitor akan terlihat kotak dialog Choose a bar type.
5.	Tentukan model navigasi sesuai dengan keinginan masing-masing.
6.	Klik tombol next 
7.	Klik pilihan orientasi sesuai keinginan, misalnya klik pilihan vertical sehingga menu navigasi akan diletakkan sebelah kiri.
8.	Klik tombol Finish dan dilayar akan terlihat kotak dialog Link Bar Properties.
9.	Klik tab General, kemudian klik pilihan Child level dan klik pilihan Home page pada bagian Additional pages.
10.	Klik tombol OK dan pada halaman index.htm akan terlihat manu navigasinya.

Hyperlink Halaman Home atau Level Pertama
Cara yang digunakan untuk membuat hyperlink pada level kedua Profile, Biodata, Gallery Photo, facebook adalah sebagai berikut:
1.	Buat halaman Profile.htm dengan cara klik tab Web Site kemudian klik dua kali pada file tersebut, sehingga halaman web Profile.htm akan terbuka.
2.	Halaman web Profile.htm tersebut masih kosong dan masukkan teks judul pada halaman tersebut
3.	Pastikan kursor berada pada posisi rata kiri halaman web, kemudian klik menu Insert dan klik pilihan Navigation. Pada layar akan terlihat kotak dialog Insert Web Component dengan Pilihan default Link Bars.
4.	Kilik pilihan Bar based on navigation structure di bagian Choose a bar type, kemudian klik pilihan Next dan pada layar monitor akan terlihat kotak dialog Choose a bar type.
5.	Tentukan model navigasi sesuai dengan keinginan masing-masing.
6.	Klik tombol next 
7.	Klik pilihan orientasi sesuai keinginan, misalnya klik pilihan vertical sehingga menu navigasi akan diletakkan sebelah kiri.
8.	Klik tombol Finish dan dilayar akan terlihat kotak dialog Link Bar Properties.
9.	Klik tab General, kemudian klik pilihan Same Level dan klik pilihan Home page pada bagian Additional pages.
10.	Klik tombol OK dan pada halaman index.htm akan terlihat manu navigasinya.