Pemrograman Web Dasar

Website Media Penyajian Materi Perkuliahan

Pertemuan 1 – Pengenalan Web

Tujuan Pembelajaran

  • Memahami pengertian website
  • Mengetahui komponen dasar web
  • Memahami konsep client dan server

Website merupakan kumpulan halaman web yang saling terhubung dan dapat diakses melalui internet menggunakan browser. Halaman web dapat berisi teks, gambar, audio, video, serta tautan yang menghubungkan antar halaman.

Pada pertemuan ini dibahas perbedaan web statis dan web dinamis serta cara kerja web melalui konsep client sebagai pengguna dan server sebagai penyedia layanan.

Ringkasan

Mahasiswa memahami konsep dasar website dan mekanisme kerja web sebagai fondasi pembelajaran pemrograman web.

Download Materi PDF

Pertemuan 2 – Basic Tag HTML

Tujuan Pembelajaran

  • Mengenal struktur dasar HTML
  • Mengetahui fungsi tag utama HTML

HTML (HyperText Markup Language) adalah bahasa markup yang digunakan untuk menyusun struktur halaman web. Dokumen HTML terdiri dari berbagai tag yang memiliki fungsi tertentu. Pada pertemuan ini dibahas struktur dasar HTML yang meliputi tag <html>, <head>, <title>, dan <body>.

Tag <head> digunakan untuk informasi halaman seperti judul dan metadata, sedangkan <body> berisi konten utama yang ditampilkan di browser. Struktur HTML yang benar sangat penting agar halaman web dapat ditampilkan dengan baik dan sesuai standar.

Ringkasan

Mahasiswa memahami struktur dasar HTML dan mampu membuat kerangka sederhana halaman web menggunakan tag HTML utama.

Download Materi PDF

Pertemuan 3 – Format Teks dan Karakter Khusus

Tujuan Pembelajaran

  • Memformat teks HTML
  • Menggunakan karakter khusus

HTML menyediakan berbagai tag untuk memformat teks agar tampil lebih jelas dan terstruktur. Materi ini membahas penggunaan tag seperti <b> untuk teks tebal, <i> untuk teks miring, <u> untuk garis bawah, <p> untuk paragraf, serta <br> untuk baris baru.

Selain itu, terdapat karakter khusus HTML yang digunakan untuk menampilkan simbol tertentu yang tidak tersedia pada keyboard.

Ringkasan

Mahasiswa mampu memformat teks dan menampilkan karakter khusus sehingga tampilan halaman web menjadi lebih rapi dan informatif.

Download Materi PDF

Pertemuan 4 – Gambar, Suara, dan Video

Tujuan Pembelajaran

  • Menampilkan gambar
  • Menggunakan media audio dan video

Pada pertemuan ini dibahas cara menampilkan gambar menggunakan tag <img>, serta menampilkan audio dan video menggunakan tag <audio> dan <video>. Setiap tag memiliki atribut yang berfungsi untuk mengatur sumber file, ukuran, dan kontrol pemutaran.

Penggunaan multimedia dapat meningkatkan daya tarik dan efektivitas penyampaian informasi.

Ringkasan

Mahasiswa mampu menampilkan gambar, suara, dan video sebagai bagian dari konten multimedia website.

Download Materi PDF

Pertemuan 5 – Hyperlink

Tujuan Pembelajaran

  • Membuat tautan antar halaman
  • Memahami fungsi hyperlink

Hyperlink merupakan elemen penting dalam website yang berfungsi untuk menghubungkan satu halaman dengan halaman lain. Hyperlink dibuat menggunakan tag <a> dengan atribut href yang berisi alamat tujuan.

Materi ini membahas penggunaan hyperlink untuk navigasi internal maupun eksternal sehingga pengguna dapat berpindah halaman dengan mudah.

Ringkasan

Mahasiswa mampu membuat navigasi halaman menggunakan hyperlink.

Download Materi PDF

Pertemuan 6 – Bullet dan Numbering

Tujuan Pembelajaran

  • Membuat list HTML
  • Menyusun informasi terstruktur

HTML menyediakan tag <ul> untuk daftar tidak berurutan dan <ol> untuk daftar berurutan. Setiap item dalam daftar dituliskan menggunakan tag <li>.

List digunakan untuk menampilkan informasi dalam bentuk daftar terurut dan tidak terurut agar mudah dibaca.

Ringkasan

Mahasiswa mampu menyajikan informasi dalam bentuk daftar menggunakan bullet dan numbering.

Download Materi PDF

Pertemuan 7 – Tabel

Tujuan Pembelajaran

  • Membuat tabel HTML
  • Menyusun data baris dan kolom

Tabel digunakan untuk menampilkan data secara terorganisir. Tabel dibuat menggunakan tag <table>, <tr> untuk baris, <td> untuk kolom, dan <th> untuk judul kolom.

Penggunaan tabel memudahkan pengguna dalam membaca dan memahami data yang disajikan.

Ringkasan

Mahasiswa mampu menyusun dan menampilkan data dalam bentuk tabel HTML.

Download Materi PDF

Pertemuan 8 – Form

Tujuan Pembelajaran

  • Membuat form input
  • Mengenal elemen form

Form digunakan untuk menerima input dari pengguna. Materi ini membahas penggunaan tag <form> dan elemen input seperti <input>, <textarea>, dan <select>.

Form merupakan dasar dari interaksi pengguna pada website, meskipun pada web statis belum dilakukan pengolahan data lanjutan.

Ringkasan

Mahasiswa mampu membuat form sederhana untuk menerima input pengguna.

Download Materi PDF

Pertemuan 9 – Frame

Tujuan Pembelajaran

  • Memahami konsep frame
  • Membagi tampilan halaman

Frame digunakan untuk membagi tampilan browser menjadi beberapa bagian dengan menampilkan halaman web yang berbeda dalam satu layar. Materi ini membahas penggunaan tag <frame> dan <frameset>.

Frame memungkinkan beberapa halaman web ditampilkan dalam satu layar menggunakan pembagian area tampilan.

Ringkasan

Mahasiswa memahami konsep frame dalam penyusunan tampilan web.

Download Materi PDF

Pertemuan 10 – Iframe

Tujuan Pembelajaran

  • Menggunakan iframe
  • Menyematkan konten eksternal

Iframe digunakan untuk menyematkan halaman web lain atau konten eksternal ke dalam halaman web menggunakan tag <iframe>. Iframe sering digunakan untuk menampilkan video, peta, atau halaman tertentu.

Ringkasan

Mahasiswa mampu menampilkan konten eksternal di dalam halaman web menggunakan iframe.

Download Materi PDF