Pertemuan 1
Materi :
Web adalah teknologi internet yang menyediakan informasi dalam bentuk Teks, Grafik, Video dan Audio
Teknologi di Internet :
1. WEB
2. FTP (File Transfer Protocol)
Contoh : Upload dan Download
3. Search Engine
Contoh : Google.com dan Ask.com
4. el-mail
5. Chatting
6.Mosaic = Informasi
Jenis-jenis web browser :
Mozila Firefox, Opera,Google Chrome, Internet explorer, Netscape,
Bahasa standart dalam membuat web adalah HTML (Hyper Text Markup Leaguage)
a. Struktur HTML
<html>
<head>
<title></title>
</head>
<body>
</body>
<html>
b. Fornat Text
c. Format Gambar
d. Format Table
e. Format Form
f. Format Tag
g. Dinamisasi web
Bagian-bagian web :
1.
Web Statis
Web statis adalah web yang berisi/menampilkan informasi –informasi
yang sifatnya statis(tetap).disebut statis karena pengguna tidak dapat
berinteraksi dengan web tersebut.singkatnya,untuk mengetahui suatu web
bersifat statis atau dinamis dapat dilihat
Dari tampilannya.jika suatu web hanya berhubungan dengan halaman web
lain dan berisi informasi yang tetap maka web tersebut disebut dengan
web statis.pada web statis,pengguna hanya dapat melihat isi dokumen pada
halaman web dan apabila diklik akan berpindah ke halaman web yang
lain.interaksi pengguna hanya terbatas dapat melihat informasi yang
ditampilkan .tetapi tidak dapat mengolah informasi yang dihasilkan.web
statis biasanya merupakan HTML yang ditulis pada editor teks dan
disimpan dalam bentuk .
Html atau
.htm
2. Web Dinamis
Web dinamis adlah web yang menampilkan informasi serta dapat
berinteraksi dengan pengguna.web yang dinamis memungkinkan pengguna
untuk berinteraksi menggunakan form sehingga dapat mengolah informasi
yang ditampilkan.web dinamis bersifat interaktif,tidak kaku,dan terlihat
lebih indah.
Pertemuan 2
Materi :
1. Mendalami tag-tag dasar
2. Format Table
SGML
HTML
XML
Tag-tag dasar HTML :
<HTML>
Tag ini adalah yang paling utama dan dokumen HTML anda harus punyai.
<HTML> tag.
<HTML> harus muncul pada bagian paling awal dari kode halaman anda, dan </HTML> sebagai yang paling akhir.
<HEAD>
Tepat di bawah tag HTML adalah tag
<HEAD>. Tag HEAD ini mengandung obyek yang akan di load lebih
dahulu oleh browser pengunjung halaman anda sebelum menampilkan bagian
lain dalam halaman yang sama.
<TITLE>
Tag Title ini diletakkan di antara tag HEAD.
<TITLE>Selamat Datang di Rileks – The Leading B2C Portal</TITLE>
String yang berada di antara tag TITLE akan ditampilkan sebagai judul pada window browser.
<BODY>
Di bawah tag HEAD, namun masih di dalam (di antara) tag HTML.
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Tag BODY ini mengandung informasi yang berhubungan dengan property
dasar pada keseluruhan isi dokumen HTML. Text, Link, Link yang telah
dikunjungi, Link yang aktif dan warna latar belakang (background)
dokumen serta image yang akan menjadi background didefinisikan pada
bagian ini.
<BODY TEXT="white" LINK="red" VLINK="orange" ALINK="gray" BGCOLOR="black" BACKGROUND="white-tile.gif"></BODY>
Tag BODY ini mengandung informasi yang berhubungan dengan property
dasar pada keseluruhan isi dokumen HTML. Text, Link, Link yang telah
dikunjungi, Link yang aktif dan warna latar belakang (background)
dokumen serta image yang akan menjadi background didefinisikan pada
bagian ini.
<BODY TEXT="white" LINK="red" VLINK="orange" ALINK="gray" BGCOLOR="black" BACKGROUND="white-tile.gif"></BODY>
Contoh penerapan Tag-tag dasar HTML diatas
- Buka Notepad
- Ketik Kode berikut
<html>
<head>
<title>Ini Judul Web</title>
</head>
<body>
<h1>Ini tulisan dengan h1</h1>Halloo, gue lagi belajar HTML gan<br>
<strong>HTML ternyata gampang masbro</strong>
</body>
</html>
- Simpan dengan nama ("terserah anda.html")
- Buka file terserah anda.html tersebut (File-Open With) dengan browser (Firefox, IE,dll)
Pertemuan 3
Materi :
- Belajar Table
Contoh: rancanglah table berikut :
<table>
<tr>
<td rowspan=2></td>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
<table>
<tr>
<td colspan=2></td>
</tr>
<tr>
<td rowspan=2></td>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
Pertemuan 4
Materi :
1.
Antar muka web
2.
Merancang
Formulir
Pendahuluan
Web di akses banyak pengguna, dengan
demikian antar muka web, diusahakan dengan kebutuhan pengguna Tren antar muka
web (Web User Interface) Kearah Multimedia
Contoh antar
muka web :
Atau
Contoh :
Buatlah kode HTML untuk rancangan Tebel
berikut
<table>
<tr>
<td rowspan = 3></td>
<td colspan = 3></td>
</tr>
<tr>
<td rowspan = 2 ></td>
<td colspan = 2 ></td>
</tr>
</table>
Pertemuan 5
Meteri:
1. Frame
a.
Frame
Programnya :
<html>
<head>
<title> </title>
</head>
<frameset > cols = 25%,75%
<frame src = menu.html>
<frame src = content.html>
</frameset>
<body>
</body
</html>
Pertemuan 6
Materi :
1. Elemen-elemen Javascript :
1. Struktur
2. Variable
3. Operator
4. Pernyataan
bersyarat
5 . Pernyataan
berulang
6. Larik/ array
7. Fungsi
8. Objek
9. Grafik
1.
Struktur
<script>
<pernyataan>
</script>
Contoh:
Kode javascript mencetak string “Pemrograman WEB”
Objek <script>
Document.write(“Pemrograman
WEB”)
</script>
2.
Variable
- Pengenal (identifier) yang nilainya bias di ubah-ubah
selama eksekusi program
-
Deklarasi
variable menggunakan kata kunci (key words ) var
Contoh :
<script>
Var a ,
a = 5
a = “ WEB”
a = lot 5/7;
a = a + 7 ;
a = “ip”
</script>
Pertemuan 7
Materi :
- Memahami pernyataan For
- Memahami pernyataan While
-
Memahami
pernyataan do While
Contoh:
Membuat kode javascript untuk mencetak angka 1 s/d 100
di web browser
<script>
Var i,
For (i=1:
i<=100; i++)
{
Document.write(i);
}
</script>
Pertemuan 8
Materi :
1. Review Pernyataan Berulang
- For
- While
- DoWhile
PERNYATAAN
FOR
|
PERNYATAAN
WHILE
|
PERNYATAAN
DO WHILE
|
Banyaknya pernyataan yang di ulang sudah pasti
Ø Bisa
saja pernyataan tidak dikerjakan
|
Banyaknya pernyataan yang di ulang tergantung syarat / kondisi
Ø
Bisa saja pernytaan tidak dikerjakan
|
Banyaknya perulangan tergantung
pada kondisi
Ø
Minimal perulangan satu kali dikerjakan
|
Contoh For dalam For :
For (i=1, 1<=5 i++)
{
For ( i=1, j<=i, i++)
}
document.write (“belajar”)
}
}
i
|
j
|
output
|
1
|
1
|
Belajar
|
2
|
1
|
Belajar
|
2
|
2
|
Belajar
|
3
|
2
|
Belajar
|
3
|
1
|
Belajar
|
LARIK / ARRAY
Adalah variabel yang dapat mempunyai banyak nilai
Variabel Biasa Variabel Array
IP1=2,7 ; IP(1)=2,7 ;
IP2=3,2 ; IP(2)=3,2 ;
IP3=3,0 ; IP(3)=3,0 ;
- Tiap nilai array ditampung dalam index yang berbeda variabelnya.
Array IP(1) maksudnya variabel array ke-1. Data yang telah disimpan dalam array dapat diolah dengan lebih cepat, misalnya dalam : - Pengurutan,
- Pencarian,
- Penjumlahan, dsb.