Modul 4.2 - Kod Arahan HTML PDF
Modul 4.2 - Kod Arahan HTML PDF
A. Objektif
Pada akhir sesi ini, guru dapat:
1. Melakar papan cerita untuk membina laman sesawang yang menggunakan kod arahan
HTML.
2. Menggunakan tags dalam atur cara HTML.
3. Menggunakan paragraph heading dalam atur cara HTML yang dibina.
4. Menggunakan atur cara HTML untuk menghasilkan Banner, Frame dan Menu,
5. Membina pautan teks dan imej dalam atur cara HTML.
6. Menulis atur cara untuk memasukkan imej dalam atur cara HTML.
7. Menghasilkan pull down menu memalui atur cara HTML.
8. Menghasilkan ruang komen melalui atur cara HTML.
9. Mengesan sebarang ralat yang berlaku dalam atur cara HTML yang dibina.
10. Membina lama sesawang interaktif yang memaparkan Banner, Menu, Ruangan Komen,
Frame dan Pull down menu.
B. Kandungan Pengajaran
4.2.1 Papan Cerita Laman Sesawang Menggunakan Kod Arahan
4.2.2 Penggunaan Tags Dalam Atur Cara HTML
4.2.3 Penggunaan Paragraph Heading Dalam Atur Cara HTML
4.2.4 Penghasilan Banner, Frame Dan Menu Dalam Atur Cara HTML
4.2.5 Pembinaan Pautan Teks Dan Imej dalam Atur Cara HTML
4.2.6 Penulisan Atur Cara Untuk Memasukkan Imej Dalam Atur Cara HTML
4.2.7 Penghasilan Pull Down Menu Melalui Atur Cara HTML
4.2.8 Penghasilan Ruangan Komen Dalam Atur Cara HTML
4.2.9 Pengesanan Ralat Dalam Atur Cara HTML
4.2.10 Pembinaan Laman Sesawang Menggunakan Atur Cara HTML
ASAS SAINS KOMPUTER TINGKATAN 1 2016
KOD ARAHAN
Pada tahun 1986, konsep ini disetujui oleh ISO (International Standard Organization)
sebagai standar untuk pembuatan dokumen. Bahasa ini dinamai oleh ISO sebagai Standard
Generalized Markup Language (SGML) HTML sendiri, adalah bahagian dari SGML. Tim
Berners-Lee dari CERN mengemukakan sebuah idea tentang pembuatan skrip bahasa
pemprograman dan dokumen yang dapat diakes oleh semua komputer tanpa melihat jenis
platformnya. Sejak saat itu HTML menjadi lebih popular di bandingkan SGML.
HTML adalah singkatan dari Hyper Text Markup Language. Apabila kita menjelajah
internet, membuka laman web kita akan bertemu dengan HTML. Ini adalah kerana
semua laman sesawang (web) dibina menggunakan bahasa pengaturcaraan HTML.
HyperText adalah metod di mana kita “berpindah” di sekeliling web, dengan mengklik
sebuah teks yang bernama hyperlink. Hyperlink adalah sebuah teks khusus di internet,
di mana saat teks tersebut diklik, akan membawa kita ke halaman sesawang
selanjutnya/halaman web lain yang telah ditentukan.
Markup adalah hal yang dilakukan oleh tag HTML kepada teks yang ada di dalamnya.
HTML menandai teks yang berada di dalamnya sebagai tip teks tertentu. Misalnya jika
kita menandai sebuah teks dengan tag html <i> maka teks tersebut akan berubah
menjadi italic (huruf miring). Sedangkan jika kita menandainya dengan <b> maka teks
tersebut akan berubah menjadi bold (huruf tebal).
Bahasa HTML ini masih terus dikembangkan dari masa ke semasa kerana bahasa ini
boleh dipertingkatkan untuk memenuhi keperluan penciptaan laman web mengikut
kehendak pengguna.
Sebagai bahasa markup internet, HTML memiliki banyak fungsi dan kegunaan. Berberapa
manfaat dari HTML di antaranya
Untuk membina halaman web. Bahasa HTML digunakan untuk membuat laman web.
Semua halaman web pasti dibuat dengan menggunakan HTML.
Sebagai asas sebuah laman web. HTML adalah asas sebelum kita dapat
mengimplementasikan bahasa lainnya seperti CSS (bahasa untuk merekabentuk laman
web), Javascript (bahasa untuk menambah kepelbagaian perilaku laman web) dan PHP
(bahasa programming server laman web).
Untuk menandai teks pada Halaman web. Misalnya, kita dapat menandai sebuah teks
menjadi bergaris bawah dengan menggunakan tag html <u>.
Untuk menambahkan objek seperti banner, menu, frame, pull down menu, imej, audio,
video dan lain-lain ke dalam laman sesawang.
Contoh: Anda dikehendaki melakar papan cerita yang logik untuk laman
sesawang yang hendak dibina.
i. Merancang berapa laman sesawang yang dicadangkan
ii. Merancang pada setiap laman sesawang apakah kandungan yang ingin
dipaparkan
iii. Merancang apakah audio, video dan imej yang ingin disisipkan
<head>
<title>
<body> dan
<paragraph>
4.2.4 Penghasilan Banner, Frame Dan Menu Dalam Atur Cara HTML
4.2.5 Pembinaan Pautan Teks Dan Imej dalam Atur Cara HTML
4.2.6 Penulisan Atur Cara Untuk Memasukkan Imej Dalam Atur Cara HTML
<a href="http://www.duniailkom.com">
<img src=”gambar1.gif” width="200" height="80" </img src>
<a/>
</head>
</HTML>
<table border=1>
<a href="http://www.duniailkom.com">
<img src=”gambar1.gif” width="200" height="80" </img src>
<a/>
</head>
</body>
</html>
<html>
<head>
<style>
.error {color: #FF0000;}
</style>
</head>
<body>
<!-- tag form -->
<form action="finish.html" method="get">
Hobi:
<input type="checkbox" name="hobi_baca" /> Membaca Buku
<input type="checkbox" name="hobi_nulis" checked /> Menulis
<input type="checkbox" name="hobi_mancing" /> Memancing
<br />
<p>
Tempat Lahir:
<select name="Selangor_Selangor" >
<option value="Selangor"> Negeri Sembilan</option>
<option>Melaka</option>
<option value="Johor" checked>Johor</option>
</select>
10 MODUL KOD ARAHAN HTML
ASAS SAINS KOMPUTER TINGKATAN 1 2016
<br />
<P>
Komen Anda:
<textarea name="komentar" rows="5" cols="20">
Sila komen diruangan ini</textarea>
<br />
</P>
<input type="submit" value="Mulai Proses!" >
</body>
</html>
Aktiviti: Dengan menggunakan kod HTML sila bina satu laman sesawang Pengajaran anda
yang mengandungi;
Apabila siap, anda dikehendaki membuat ujian dan mengesan sebarang ralat yang berlaku
dalam aturcara HTML tersebut.
11 MODUL KOD ARAHAN HTML
ASAS SAINS KOMPUTER TINGKATAN 1 2016