Langsung ke konten utama

Materi Ajar Kelas 6 Pertemuan Ke 6 Semester Ganjil

IDENTITAS


Nama Guru : Erni Sri Wahyuni

Hari / Tanggal : Jumat, 28 Agustus 2026 Fase / Kelas : C / 6 Al Jazari & Ibnu Sina

Mata Pelajaran : TIK

Materi : Elemen Heading HTML

Pertemuan Ke : ke-6 (2 JP)


Apersepsi :

Bismillahirrahmanirrahim, Assalamu’alaikum Wr. Wb.

Apa kabar anak sholih/ah? Bagaimana kabarnya hari ini? Semoga anak-anak semua dalam keadaan sehat, bahagia dan semangat selalu. Sudahkan anak-anak melaksanakan shalat subuh hari ini? Jangan lupa ya anak-anak. Dimana shalat adalah kewajiban kita sebagai seorang muslim. Dimana Allah sudah sangat baik dengan kita, dengan segala kebesaran-Nya. Allah Maha Khaliq, zat yang menciptakan kita, Allah juga Maha Malik, zat yang memelihara kita dengan sebaik-baiknya keadaan. Allah al Khalik, tidak hanya menciptakan kita sebagai manusia, tetapi juga Allah telah menciptakan sebuah teknologi yang sangat berguna di kehidupan kita.

CP :
Pada materi ini, murid diarahkan untuk mengenal dan menggunakan elemen heading HTML secara tepat untuk membuat judul dan subjudul pada halaman web sederhana.


TP :

  • Menjelaskan pengertian HTML dengan bahasa sederhana.
  • Menjelaskan fungsi elemen heading pada HTML.
  • Mengenali heading <h1> sampai <h6>.
  • Menjelaskan perbedaan ukuran dan tingkatan heading.
  • Menuliskan kode HTML menggunakan elemen heading dengan benar.
  • Membuat halaman HTML sederhana yang memiliki judul dan subjudul.
  • Menampilkan hasil kode HTML menggunakan web browser.
  • Menunjukkan sikap teliti, kreatif, mandiri, dan bertanggung jawab saat melakukan praktik.

ATP : 
Murid mampu mengenal fungsi elemen heading dalam HTML dan membedakan heading <h1> hingga <h6>.


Model / Metode : Deep Learning, model Project Based Learning (PjBL), dan metode yang bervariasi mendukung pembelajaran yang bermakna, aktif, kreatif, dan menyenangkan, sekaligus mengembangkan keterampilan digital dasar sesuai Kurikulum Merdeka.


Penjabaran Materi :

1. Apa Itu HTML?

HTML merupakan singkatan dari HyperText Markup Language.
HTML digunakan untuk menyusun dan membuat struktur halaman web.

Contohnya, ketika kita membuka sebuah website, kita dapat melihat:
Judul halaman
Judul artikel
Subjudul
Paragraf
Gambar
Tautan

Bagian-bagian tersebut dapat disusun menggunakan elemen HTML.
Contoh sederhana:
<h1>Belajar HTML</h1> 
<p>HTML digunakan untuk membuat struktur halaman web.</p>

Ketika dibuka melalui browser, kode tersebut akan menampilkan judul Belajar HTML dan sebuah paragraf.

2. Apa Itu Heading?

Heading adalah elemen HTML yang digunakan untuk membuat judul atau subjudul pada halaman web.
HTML memiliki enam tingkat heading, yaitu:<h1> <h2> <h3> <h4> <h5> <h6>.
Heading memiliki tingkatan dari yang paling utama sampai yang paling rendah.

Urutannya:
h1 → h2 → h3 → h4 → h5 → h6

3. Fungsi Heading

Heading digunakan untuk:
Membuat judul utama.
Membuat subjudul.
Membagi isi halaman menjadi beberapa bagian.
Membuat halaman lebih terstruktur.
Membantu pembaca memahami isi halaman.

Contohnya:<h1>Hewan</h1> <h2>Hewan Darat</h2> <h2>Hewan Air</h2> <h2>Hewan Udara</h2>

4. Mengenal Elemen Heading

<h1> Judul utama (Paling tinggi)

<h2> Subjudul utama (Tingkat 2)

<h3> Subjudul dari h2 (Tingkat 3)

<h4> Subjudul dari h3 (Tingkat 4)

<h5> Subjudul dari h4 (Tingkat 5)

<h6> Subjudul paling rendah (Tingkat 6)


Secara umum, semakin besar angka heading, ukuran tampilannya semakin kecil.

Contoh:
<h1>Belajar Komputer</h1> 
<h2>Microsoft Word</h2> 
<h3>Mengenal Toolbar</h3> 
<h4>Mengenal Ikon</h4> 
<h5>Fungsi Ikon</h5> 
<h6>Latihan</h6>

Kode tersebut dapat digunakan untuk membuat struktur judul dan subjudul.

5. Cara Menulis Heading

Elemen heading memiliki tag pembuka dan tag penutup.

Contoh:
<h1>Belajar HTML</h1>
Penjelasan:<h1> = tag pembuka.
Belajar HTML = isi heading.
</h1> = tag penutup.

Perhatikan tanda / pada tag penutup.

6. Contoh Struktur HTML Sederhana

<html> 
<head> 
 <title>Belajar Heading</title> 
</head> 
 <body> 
 <h1>Belajar HTML</h1> 
 <h2>Pengenalan HTML</h2> 
 <h3>Pengertian HTML</h3> 
 <p>HTML digunakan untuk membuat struktur halaman web.</p> 
 <h2>Heading HTML</h2> 
 <h3>Heading h1 sampai h6</h3> 
 </body> 
</html>

Penjelasan:

<html>
Menandai awal dan akhir dokumen HTML.
<head>
Berisi informasi tentang halaman web.
<title>
Menentukan judul yang muncul pada tab browser.
<body>
Berisi isi halaman web yang ditampilkan kepada pengguna.
<h1> sampai <h6>
Digunakan untuk membuat judul dan subjudul.
<p>
Digunakan untuk membuat paragraf.

7. Perbedaan Heading dan Paragraf

Heading dan paragraf memiliki fungsi yang berbeda.
Heading<h1>Belajar Komputer</h1>
Digunakan sebagai judul atau subjudul.
Paragraf<p>Komputer dapat membantu kita dalam belajar.</p>
Digunakan untuk menuliskan isi atau penjelasan.

Berikut link video penjelasan tentang elemen heading:

LKPD Praktik

Lembar Kerja Peserta Didik

Nama: __________________________
Kelas: __________________________
Tanggal: ________________________

Judul

Membuat Halaman Web Menggunakan Heading HTML

Tugas

Buatlah halaman web dengan tema "Cita-citaku".

Gunakan struktur:

h1 = Cita-citaku

h2 = Cita-cita
h3 = Alasan Memilih Cita-cita

h2 = Persiapan
h3 = Hal yang Harus Dipelajari

h2 = Harapanku
h3 = Harapan di Masa Depan
Jika sudah simpan dengan nama Latihan Heading.html
Lalu jalankan dengan menggunakan web browser.

Soal Post Test:

1. Elemen yang digunakan untuk membuat judul utama adalah ....
A. <p>
B. <br>
C. <h1>
D. <title>

2. Heading HTML terdiri dari ....
A. h1 sampai h3
B. h1 sampai h4
C. h1 sampai h5
D. h1 sampai h6

3. Manakah penulisan heading yang benar?
A. <h1>Belajar HTML<h1>
B. <h1>Belajar HTML</h1>
C. <h1>Belajar HTML</h2>
D. <h>Belajar HTML</h>

4. Tag yang digunakan untuk membuat paragraf adalah ....
A. <h1>
B. <p>
C. <body>
D. <html>

5. Jika ingin membuat subjudul dari <h1>, kita dapat menggunakan ....
A. <h2>
B. <h5>
C. <p>
D. <br>


Kesimpulan :

1. Kesimpulan materi

Heading HTML adalah elemen yang digunakan untuk membuat judul dan subjudul pada sebuah halaman web. Heading terdiri dari <h1> sampai <h6>, dengan <h1> sebagai judul utama dan <h6> sebagai tingkatan judul yang paling rendah.

Penggunaan heading membantu membuat halaman web menjadi lebih terstruktur, rapi, dan mudah dipahami. Peserta didik juga belajar bahwa setiap tag HTML memiliki fungsi tertentu dan harus ditulis dengan benar, termasuk tag pembuka dan tag penutup.2. Refleksi pembelajaran

Reflesi

- Kendala

- Tindak lanjut

- Jumlah siswa yang paham/belum paham


Komentar

Posting Komentar

Popular Posts

Kisi - Kisi US 2026

Hari / Tanggal : Kamis/ 7 Mei 2026 Mata Pelajaran : TIK / Komputer Kelas : 6 (SD Al - Azhar 1 Bandar Lampung) Tema :  Menggunakan Program Microsoft Office, Program Coreldraw, dan HTML Assalamualaikum wr.wb Bagaimana kabar anak sholeh dan sholehah ? Alhamdulillah semoga kita semua dalam keadaan sehat dan selalu dalam lindungan Allah SWT aamiin. Bagamana nih... Sudah siap untuk melaksanakan Ujian Sekolah??? Yukkk kita persiapkan dengan cara belajar dengan giat dan tekun:) Pada pertemuan kali ini, miss akan memberikan kisi-kisi untuk Ujian Sekolah. Sholeh-Sholehah bisa mempelajari dari kisi-kisi ini ya :). Berikut kisi-kisi nya: https://drive.google.com/file/d/11ctUjhTxkheDkHV_lTJPOmPPk8S2DM4o/view?usp=sharing Baiklah untuk pertemuan hari ini hanya itu saja yang dapat Miss sampaikan. Semoga apa yang Miss sampaikan berguna untuk sholeh-sholehah belajar ya:) Jangan lupa berdoa sebelum memulai ujian dan good luck kids:) Tetap semangat sekolahnya dan tetap istiqomah untuk melaksanakan sha...
2 komentar
Baca selengkapnya

Kisi - Kisi STS Kelas 5 Semester Genap

Hari / Tanggal : Rabu/ 12 Maret 2025 Mata Pelajaran : TIK / Komputer Kelas : 5 (SD Al - Azhar 1 Bandar Lampung) Tema :  Menggunakan Program Microsoft Excel Assalamualaikum wr.wb Bagaimana kabar anak sholeh dan sholehah ? Alhamdulillah semoga kita semua dalam keadaan sehat dan selalu dalam lindungan Allah SWT aamiin. Pada pertemuan kali ini, miss akan memberikan kisi-kisi untuk Penilaian Tengah Semester. Sholeh-Sholehah bisa mempelajari dari kisi-kisi ini ya :). Berikut kisi-kisi nya: Ms Excel adalah progam pengolah angka yang dilengkapi dengan fitur kalkulasi dan pembuatan grafik. Berikut ini adalah gambar Tampilan Microsoft Office Excel : Berikut adalah keterangan-keterangan dari tampilan diatas: 1. Office Button, terdiri atas perintah New document, open dokument, save, save as, print, prepare, send, publish, close. 2. Quick Access terdiri dari beberapa tombol yang bisa mempercepat pekerjaan kita. isi tombol tersebut sebagian ada pada menu office button, kecuali undo dan redo. 3. ...
Posting Komentar
Baca selengkapnya

Materi Ajar Kelas 6 Pertemuan Ke 8 Semester Genap

Hari / Tanggal : Selasa/ 3 Maret 2026 Mata Pelajaran : TIK / Komputer Kelas : 6 Ibnu Sina (SD Al - Azhar 1 Bandar Lampung) Tema :  Menggunakan Program Microsoft Office, Program Coreldraw, dan HTML Assalamualaikum wr.wb Bagaimana kabar anak sholeh dan sholehah ? Alhamdulillah semoga kita semua dalam keadaan sehat dan selalu dalam lindungan Allah SWT aamiin. Pada pertemuan kali ini, miss akan memberikan kisi-kisi untuk Latihan Ujian Sekolah. Sholeh-Sholehah bisa mempelajari dari kisi-kisi ini ya :). Berikut kisi-kisi nya: https://docs.google.com/document/d/1m11lr9UpyYCgIii0N9HV0b5rvx87POU7/edit?usp=sharing&ouid=111766177864914153420&rtpof=true&sd=true Baiklah untuk pertemuan hari ini hanya itu saja yang dapat Miss sampaikan. Semoga apa yang Miss sampaikan berguna untuk sholeh-sholehah belajar ya:) Jangan lupa berdoa sebelum memulai ujian dan good luck kids:) Tetap semangat sekolahnya dan tetap istiqomah untuk melaksanakan shalat 5 waktu berjamaah dan tepat waktu. Sampai b...
Posting Komentar
Baca selengkapnya