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)
- 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 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
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
Meteri:
1. Frame
a.
Frame
Menu
|
Content
|
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
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 ;
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.