Woensdag 12 Junie 2013

                                                             PEMROGRAMAN WEB


                                                                     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 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 

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
        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.