modul pemrograman dasar web dan internet

MATA KULIAH : DASAR PEMROGRAMAN WEB DAN INTERNET Pertemuan ke-1 Materi : Menggunakan HTML di Adobe Dreamweaver CS

Tujuan: 1. Siswa dapat memahami dan mengenal perintah-perintah dasar HTML 2. Siswa dapat membuat tabel dan pengaturannya

Indikator Keberhasilan: 1. Siswa dapat membuat beberapa halaman website sederhana 2. Siswa dapat membuat tabel dan pengaturannya 3. Siswa dapat membuat beberapa halaman website yang dilengkapi dengan hyperlink, image dan link-image

I.

Teori dasar

1.1. Hypertext Markup Language (HTML) Adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah Web Browser. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML, HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web dan HTML kini merupakan standar Internet yang saat ini dikendalikan oleh World Wide Web Consortium (W3C). HTML berupa kode-kode tag yang menginstruksikan web browser untuk menghasilkan tampilan sesuai dengan yang diinginkan. Sebuah file yang merupakan file HTML dapat dibuka dengan menggunakan browser web seperti Mozilla Firefox atau Microsoft Internet Explorer. HTML juga dapat dikenali oleh aplikasi pembuka email ataupun dari PDA dan program lain yang memiliki kemampuan browser.Praktikum Dasar Pemrograman web dan internet

Fahmi, TZ,ST

Bentuk umum: Letakkan judul situs di sini Ini halaman situs Anda. Letakkan perintah-perintah HTML di sini.

Secara garis besar, terdapat 4 jenis elemen dari HTML: 1. Structural Tanda yang menentukan level atau tingkatan dari sebuah teks (contoh, Golf akan memerintahkan browser untuk menampilkan "Golf" sebagai teks tebal besar yang menunjukkan sebagai Heading 1 2. Presentational. Tanda yang menentukan tampilan dari sebuah teks tidak peduli dengan level dari teks tersebut (contoh, boldface akan menampilkan bold. Tanda presentational saat ini sudah mulai digantikan oleh CSS dan tidak direkomendasikan untuk mengatur tampilan teks. 3. Hypertext tanda yang menunjukkan pranala ke bagian dari dokumen tersebut atau pranala ke dokumen lain (contoh, Wikipedia akan menampilkan Wikipedia sebagai sebuah hyperlink ke URL tertentu), 4. Elemen widget, yang membuat objek-objek lain seperti tombol (), list (), dan garis horizontal ().Praktikum Dasar Pemrograman web dan internet

Fahmi, TZ,ST

1.2. Membuat dokumen HTML di dreamweaver Langkah-langkah : 1. Buka Dreamweaver CS 5. Akan Muncul Tampilan seperti dibawah ini

Gambar 1.1. Tampilan Awal ketika membuka adobe dreamweaver CS 5

2. Pilih File => New,

Gambar 1.2. membuat file baru di dreamweaver CS 5

Praktikum Dasar Pemrograman web dan internet

Fahmi, TZ,ST

Gambar 1.3. Gambar 1 yang diperbesar

3. Pilih page Type HTML dengan Layout kemudian tekan create, maka akan muncul tampilan seperti di bawah ini :

Gambar 1.4. Editor HTML 4. Masukan koding HTML pada layar utama sesuai dengan desain yang kita inginkan


Fahmi, TZ,ST

5. Setelah selesai memasukan koding, kita simpan file dengan cara memilih File => Save As

Gambar 1.5. Save As

6. Berinama file dengan diakhiri dengan ekstensi .HTML

Gambar 1.5. Ekstensi file .HTML


Fahmi, TZ,ST

3. Tag-tag dasar HTML


Fahmi, TZ,ST

II. PRAKTIKUM LANGKAH-LANGKAH PRAKTIKUM Latihan 1 1. Buka HTML di dreamweaver CS 2. Masukan koding di bawah ini Latihan Pertamaku Paragraf ini akan rata kiri
Paragraf ini akan rata kiri
br digunakan untuk ganti baris

Kalimat ini akan dicetak Bold
Kalimat ini akan dicetak Italic
Kalimat ini akan dicetak Bold dan Italic
Perintah hr digunakan untuk membuat garis

3. Simpan dengan nama latihan1.html 4. Buka di browser anda.


Fahmi, TZ,ST

Latihan 2 Latihan Pertemuan 2 SITUSKU.COM

Terdepan Dalam Berita dan Gosip Home Selamat Datang di SITUSKU.COM
Situsku.Com akan selalu konsisten dengan berita-berita terbaru darisegala penjuru Indonesia.

Dapatkan berita-berita menarik tentang: politik, hukum, keamanan, gosip artis dan kuliner di Indonesia.


Fahmi, TZ,ST

modul pemrograman dasar web dan internet

Documents