Menerapkan format teks pada
halaman web
Pemrograman Web dan Perangkat Bergerak
Kurnia Rahman Agus, S.S.T , Gr
Let’s Pray!
Berdoalah sebelum memulai pembelajaran
01 Menjelaskan tata cara 03 Menjelaskan tag-tag dalam
penulisan script html html.
dengan berbagai editor.
04 Menerapkan format teks
02 Menjelaskan parameter dalam script html.
parameter dalam html.
TUJUAN
PEMBELAJARAN
Materi Pembelajaran
Konsep Website Format Teks Table Multimedia
Memahami konsep Menerapkan format teks Menerapkan format table Menerapkan tampilan
teknologi aplikasi web pada halaman web pada halaman web format multimedia pada
halaman web
1 234
Jquery Ajax CSS Form Link
Memahami client side Menerapkan style pada Menerapkan format formulir Menerapkan format kaitan
scripting dalam halaman web pada halaman web pada halaman web
pemrograman web
8765
Materi
HTML
HTML merupakan bahasa dasar yang digunakan untuk
pemrograman WEB. Bahasa HTML dijalankan di sisi Client (Client
Side). Artinya ketika pengguna mengakses halaman suatu halaman di
alamat tertentu, maka pengguna akan mendapat respon berupa
halaman HTML.
Halaman HTML terdiri dari dua bagian, Head dan Body.
Kedua bagian tersebut dibungkus di dalam tag html (<html>). Bagian
head merupakan bagian teratas dari struktur html, dan bagian body
merupakan bagian konten sebuah web. Informasi yang didapatkan
oleh pengguna selalu berada di bagian Body.
Kurnia Rahman Agus www.dailykurnia.com
Halaman Web
Laptop
Desktop PC
Smartphone
HTML BASIC
Heading dan Paragraf
<!DOCTYPE html>
<html>
<head>
<title>Pertemuan 1 | Sintak Dasar HTML</title>
</head>
<body>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<p>Ini adalah bagian paragraph SMK Hebat!</p>
</body>
</html>
HTML BASIC
Link dan Image
<!DOCTYPE html>
<head>
<title>Pertemuan 1 | Sintak Dasar HTML</title>
</head>
<body>
<h3>Link Website Populer</h3>
<a href="http://facebook.com">Facebook saya</a>
-
<a href="http://www.dailykurnia.com">Blog
saya</a>
<h3>Menampilkan Gambar</h3>
<img src=“ukk.jpg">
</body>
</html>
Teks Pada HTML
Latihan Teks <li>Badu Atai</li>
</ol>
<!DOCTYPE html> <p>Daftar Nama Pemain Bola (Unorder
<head> List)</p>
<title>Pertemuan 2 | Sintak Dasar <ul>
HTML</title> <li>Ronaldo</li>
</head> <li>Zinadine Zidane</li>
<body> <li>Evan Dimas</li>
<!--ini adalah petunjuk (comment)<br> <li>Badu Atai</li>
digunakan </ul>
untuk pindah baris baru--> <h3>Blockquote dan Code</h3>
<h3>Manipulasi Teks</h3> <blockquote>Ini adalah tulisan yang
<i>Tulisan Miring</i><br> dibuat dengan
<b>Tulisan Tebal</b><br> blockquote!</blockquote>
<u>Tulisan Bergaris Bawah</u><br> <p>kalimat di atas ditulis dengan
<strong>Tulisan Tebal</strong><br> menggunakan
<em>Tulisan Miring</em> perintah
<hr><!-- <hr> digunakan untuk membuat <code><blockquote></blockquote></code>
garis--> </p>
<h3>Daftar Order dan Unorder</h3> </body>
<p>Daftar Nama Pemain Bola (Order </html>
List)</p>
<ol>
<li>Ronaldo</li>
<li>Zinadine Zidane</li>
<li>Evan Dimas</li>
OUTPUT
TUGAS
Kumpulkaan pada Tugas 2 di Google Classroom!
Modifikasilah Halaman Web Sederhana yang menampilkan
informasi sederhana tentang diri anda yang dikerjakan pada
pertemuan sebelumnya! Gunakan semua elemen pada latihan ini.
Simpan dengan nama file: Tugas_2_DataDiri2.html