LAPORAN
PRAKTIKUM
PEMROGRAMAN WEB
MODUL 2
Disusun Oleh :
Nama : NUGROHO ARI SAPUTRO
NIM : L200120105
Kelas : E
JURUSAN TEKNIK
INFORMATIKA
FAKULTAS
KOMUNIKASI DAN INFORMATIKA
UNIVERSITAS
MUHAMMADIYAH SURAKARTA
A. Tujuan
Mengetahui
dan memahami tag-tag HTML sebagai bahasa
pemrograman untuk membuat halaman web statis.
B. Landasan Teori
Dalam
mengakses infromasi dari dunia internet, pengguna akan menuju ke sebuah alamat
unik internet yang disebut dengan nama domain dan akan menemukan informasi
berbentuk teks, gambar, animasi bergerak ataupun suara dalam media yang disebut
situs/website. Wibsite ini dibuka melalui sebuah program penjelajah yang berada
di sebuah komputer. Program penjelajar bisa berupa : Mozila, Googlechrome,
Internet Explore, dll.
C. Alat dan bahan
1.
PC (Personal Computer)
2.
Sistem Operasi Windows XP/7/8/Linux
3.
Browser Mozila/chrome
4.
Notepad++
5.
File gambar
6.
Modul praktikum
D.
Langkah
Kerja
1. Membuat
Hyperlink
-
Cari gambar, misal gambar google
ekstensi terserah anda, disini nama file gambar saya google.png. contoh gambar :
-
Buka aplikasi Notepad++
-
Save dulu filenya pada save as file type
diganti dengan HyperText Markup Language
File untuk file namenya terserah mau diisi apa, disini saya buat file
namenya halaman1.html
-
Kemudian tulis script :
-
Lalu buat halaman html lagi untuk laman
yang dituju oleh link tersebut. Disini saya membari nama halaman2.html sebagai
halaman link yang dituju.
-
Ketikkan script dibawah :
-
Setelah itu simpan, dan cari folder
dimana file halaman1.html disimpan, lalu double click dan lihat hasilnya. Dan
klik teks yang berbeda maka halaman akan berpindah.
- Hasilnya :
- Hasilnya :
2. Membuat
form dan tag dasarnya
-
Buka notepad++
-
Save dulu filenya pada save as file type
diganti dengan HyperText Markup Language
File untuk file namenya terserah mau diisi apa, disini saya buat file
namenya form.html
-
Setelah itu simpan, dan cari folder
dimana file form.html disimpan, lalu double click dan lihat hasilnya.
-
Hasilnya :
3. Membuat
animasi
-
Buka notepad++
-
Save dulu filenya pada save as file type
diganti dengan HyperText Markup Language
File untuk file namenya terserah mau diisi apa, disini saya buat file
namenya aminasi.html
-
Kemudian tulis script :
-
Setelah itu simpan, dan cari folder
dimana file animasi.html disimpan, lalu double click dan lihat hasilnya.
-
Hasilnya :
E.
Tugas
1. Tuliskan
script HTML untuk membuat gambar berjalan yang mana gambar tersebut adalah
hyperlink menuju alamat www.yahoo.com.
(ukuran gamabr 100 x 50 pixel, yang target jendela adalah sama.)
- Cari gambar yahoo dulu. ini contohnya
- Cari gambar yahoo dulu. ini contohnya
-
Buka notepad++
-
Save dulu filenya pada save as file type
diganti dengan HyperText Markup Language
File untuk file namenya terserah mau diisi apa, disini saya buat file
namenya tugas.html
-
Kemudian tulis script :
-
Setelah itu simpan, dan cari folder
dimana file tugas.html disimpan, lalu double click dan lihat hasilnya.
-
Hasilnya :
2.
Jelaskan fungsi tag atau atribut berikut
:
No
|
Tag/atribut
|
Fungsi
|
1
|
<a
href=’halaman2.html’>
|
Menuju ke
halaman link yang dituju yaitu halaman2.html
|
2
|
<a
href=’http://www.google.com’>
|
Menuju ke
link halaman website google.com
|
3
|
<a
href=’#referensi’>
|
Menuju ke
link referensi yang berada dalam 1 halaman html
|
4
|
Target=’_blank’
|
Link
dokumen ke jendela baru (new tab)
|
5
|
<input
type=’checkbox’>
|
Membuat inputan
berupa kotak-kotak cek
|
6
|
Name=’cekSing’
|
Memberi nama
|
7
|
<input
type=’text>
|
Membuat
inputan berupa text
|
8
|
Id=’txtkota’
|
Memanggil
id textkota
|
9
|
Maxlenght=’20’
|
Lebar maksimal
20
|
10
|
<textarea>
</textarea>
|
Membuat inputan
berupa textarea/area text.
|
11
|
Cols=’20’
|
Membuat colom
berukuran 20
|
12
|
|
Membuat spasi/karakter
kosong
|
13
|
<marquee>
.. </marquee>
|
Membuat karakter
berjalan
|
14
|
<blink>
.. </blink>
|
Silahkan download source codenya DISINI YA GAES
Tidak ada komentar:
Posting Komentar