Pengaturcaraan Visual dan Web

1
Pengaturcaraan Visual dan Web

• MOHAMED NAZUL HJ ISMAIL
• Tutorial 4

2
HTML
3
Beza WWW Internet

• WWW - Koleksi dok. hiperteks
• Internet - Jaringan komputer
• Web Server - spt IIS, Win NT/2000, Apache
• Web Browser - IE, Netscape Navigator, Opera

4
Asas HTML

• Tags
• Format teks
• Garisan Grafik
• ext file (html, htm)

5
Tags

• ltHTMLgt
• ltHEADgt ltTITLEgtFIRST HOMEPAGElt/TITLEgt
• lt/HEADgt
• ltBODYgt
• ltH1gtMAIN HEADER SIZE 1lt/H1gt
• ltH2gtSUB HEADER SIZE 2lt/H2gt
• ltH3gtNORMAL SIZE 3lt/H3gt
• ltH4gtNORMAL SIZE 4lt/H4gt
• ltH5gtSMALL SIZE 5lt/H5gt
• ltH6gtVERY SMALL SIZE 6 lt/H6gt
• lt/BODYgt
• lt/HTMLgt Paparan

6
Format teks

• ltHxgt lt/Hxgt ? Header
• ltBgt...lt/Bgt ? Bold
• ltIgt...lt/Igt ? Italic

• ltHRgt ? Garisan
• ltIMG SRC "..."gt ? imej
• Edit Plus

7
2. Hub Hiperteks
8
Struktur Laman Web
Linear
Hierarki
Grid
9
Pautan

• Pautan kpd objek dalam laman sama
• anchor ltAgt
• ltA Name "N.anchor"gt objek lt/Agt
• ltA HREF N.anchorgt Objeklt/Agt
• Pautan kpd fail
• ltA HREF "Dok. HTMLgt tekslt/Agt
• Pautan Ke Objek Web lain
• ltA HREF mailto y_at_yahoo.comgt tekslt/Agt
• ltA HREF http//www.oum.edu.mygt tekslt/Agt

10
3. Rekabentuk Laman Web
11
Warna, Font, Imej

• RGB Triplet
• Contoh
• lt BODY BGCOLOR FFFF00 TEXT Black
  LINKBlue VLINK FF0000gt
• Font
• ltFont Color warnagt Tekslt/Fontgt
• ltFont Face jenis_fontgt Teks lt/Fontgt
• ltFont Size saizgt teks lt/Fontgt

12
4. Penggunaan Table
13
Cipta Table

• ltPREgt... lt/PREgt ? teks
• ltTable Bordergt, ltTRgt, ltTDgt ? grafik
• Border, CellSpacing, Align

14
5. Form
15
(No Transcript)
16
Unsur2 Form

• Input Box lt Input Type "TEXT"...gt
• Selection List ltSELECT Name ...gt
• Radio Button ltInput Type "Radio...gt
• Check box ltInput Type "Checkbox"...gt

• Text Area ltTextArea Name ..."gt
• Hidden Field lt Input Type "HIDDEN"...gt
• Submit Reset lt Input Type "Submit"...gt

17
Penghantaran Form

• lt Form Action url " Method " Post" atau
  "Get"gt
• Action lokasi CGI script yang memproses form

18
Penutup

• Tutorial
• Kuiz