Laporan Praktikum Pemrograman Web 1 Modul 2

NAMA : Muhammad Fahmi

NIM : 20160910131

KELAS : SI 2015 C

1. TUGAS

1. Jelaskan fungsi tag-tag HTML pada Praktikum5

Sintaks untuk praktikum5 adalah:

<p> Pukul 15. <sup>30</sup><br>
20 <sup>0</sup> <sub> Celcius </sub></p>
<p>   </p><br>
<pre> Don’t Join To NATO
No Action
Talk Only </pre>

<strike> Jangan Jadi Orang
yang Hanya Banyak Bicara
Tanpa Aksi/Bukti Nyata</strike><br>
<ol type=”1″><b>FKOM</b>
   <li>Teknik Informatika S1</li>
   <li>Sistem Informasi S1</li>
   <li>Teknik Informatika D3</li>
   <li>Manajemen Informatika D3</li>
</ol>
<ul type=”circle”><b>Matakuliah</b>
   <li>PTI</li>
   <li>Algoritma</li>
   <li>Kalkulus</li>
</ul>
<dl>
   <dt><i>Definisi 1</i></dt>
       <dd>Penjelasan Definisi 1</dd>
   <dt><i>Definisi Ke-n</i></dt>
       <dd>Penjelasan Definisi Ke-n</dd>
</dl>

Penjelasan untuk tag-tag yang terdapat diatasa yaitu:
a. <p> : digunakan untuk membuat sebuah paragraf
b. <sup> : digunakan untuk memberikan efek superscript pada teks
c. <br> : digunakan untuk membuat baris baru
d. <sub> : digunakan untuk memberikan efek subscript pada teks
e. <pre> :digunakan untuk menampilkan hasil yang sama dengan apa yang diketikkan di layar
f. <strike> : digunakan untuk memberikan garis tengah/mencoret teks
g. <ol> : digunakan untuk membuat daftar dengan format penomoran
h. <li> : digunakan untuk membuat daftar dengan format simbol
i. <ul> : digunakan untuk membuat daftar dengan format simbol
j. <dl> : digunakan untuk mendefinisikan sebuah daftar definisi
k. <dt> : digunakan untuk mendefinisikan istilah (item) dalam daftar definisi
l. <i> : digunakan untuk memiringkan teks (italic)
m. <dd> : digunakan untuk mendefinisikan deskripsi dari item dalam daftar definisi

2. Buat design web Frame deng skema sebagi berikut

Untuk membuat design wed seperti diatas menggunakan Frameset, yang pertama harus kita punya adalah 6 file html dan 1 file foto. File-file tersebut ialah:

– frameset.html : digunakan untuk mengatur frameset
– header.html : digunakan untuk membuat haeder
– menukiri.html : digunakan untuk membuat menu kiri
– main.html : digunakan untuk menampilkan informasi
– menukanan.html : digunakan untuk membuat menu kanan
– footer.html : digunakan untuk membuat footer
– file foto dengan nama fahmi.png : digunakan sebagai file foto pada header

3. Setelah semua file ada, kini saatnya untuk mengetikan script pada file-file tersebut
a. Script untuk frameset.html

<title> m fahmi's</title>
<frameset rows=”31%,61%,8%” color=”black” border=”1″>
       <frame name=”header” src=”header.html”/>
       <frameset cols=”20%,60%,20%”>
           <frame name=”menu” src=”menukiri.html”/>
           <frame name=”main” src=”main.html” />
           <frame name=”menu” src=”menukanan.html”/>
       </frameset>
       <frame name=”footer” src=”footer.html”/>
</frameset>

b. Script untuk menukiri.html

<html>
<head>
<title> M Fahmi's </title>
</head>
<body bgcolor=”#d0d3d4″>
<ol type=”1″><h2>
<li><a href=”main.html” target=”home”> Home </li>
<li><a href=”me.html” target=”blank”> About Me </li>
</h2>
</ol>
</body>
</html>

c. Script untuk main.html

<html>
<head>
<title> M Fahmi's</title>
</head>
<body bgcolor=”#d0d3d4″>
<center><h1>
Hi! Welcome to My Blog! ^^
</h1>
</body>
</html>

d. Script untuk menukanan.html

<html>
<head>
<title> M Fahmi's </title>
</head>
<body bgcolor=”#d0d3d4″>
<ol type=”1″><h2>
   Kategori
       <ul type=”disc”>
           <li><a href=”Photos.html” target=”blank”>Photos</li>
           <li><a href=”Videos.html” target=”blank”>Videos</li>
           <li><a href=”stories.html” target=”blank”>Stories</li>
       </ul></h2>
</ol>
</body>
</html>

e. Script untuk footer.html

<html>
<head>
<title> M Fahmi's</title>
</head>
<body bgcolor=”#d0d3d4″>
<p align=”center” bgcolor=”#d0d3d4″> ©M Fahmi</p>
</body>
</html>

2 . POSTTEST

Buatlah design web input sebagai berikut:
tugas 4

Dengan ketentuan:
– Input Text untuk NIM, NIM sudah ada, tetapi tidak bisa dihapus
– Textarea nilainya tidak bisa dihapus
– Input Text Untuk NIM dibatasi sampai 10 Character
Jawaban:
1. Untuk membuat design web dengan ketentuannya, maka kita hanya memerlukan 1 file html.
2. Script HTML untuk membuat design seperti diatas yaitu

<form id=”form1″ name=”form1″ method=”post” action=””>
<p><strong>Property Readonly </strong></p>
<p> NIM : <input type=”text” name=”nim” id=”nim” readonly value=”2015091021″></p>
<p><strong>Readonly dan Title di Text Area</strong></p>
<p>Komentar : <textarea cols=”40″ rows=”10″ readonly title=”Ini Komentarnya”>
Komentar di Text Area Tidak Bisa Dihapus</textarea></p>
<p><strong> Checked </strong></p>
<p>Jenis Kelamin : <input type=”radio” name=”jk” value=”L”> L
<input type=”radio” name=”jk” value=”P” checked=”checked”> P
</p>
<p><strong>Maximal Character</strong></p>
<p> NIM : <input type=”text” maxlength=”10″ size=”20″> Maximal 10 karakter </p>
</form>

Laporan Praktikum M FAHMI

Cari Blog Ini