Praktikum Pemrograman Web1 Modul 1 (HTML Dasar)

LAPORAN PRAKTIKUM

PEMROGRAMAN WEB 1

MODUL 1

"HTML Dasar"

Di Susun Oleh :

Nama : Deni Nurfazar

NIM : 20160920121

Kelas : SI-2016 C

LABORATORIUM FAKULTAS KOMPUTER
UNIVERSITAS KUNINGAN
TAHUN AKADEMIK
2017/2018

KATA PENGANTAR

Assalamualaikum Wr. Wb.

Puji dan syukur saya panjatkan kepada Allah SWT yang telah memberikan karunia dan nikmatnya. tak lupa shalawat serta salam semoga tetap tercurah limpahkan kepada junjungan kita nabi agung Muhammad SAW kepada keluarga, sahabat, dan tak lupa kita selaku umatnya yang taat pada perintah dan ajarannya.

pada kesempatan ini saya ingin menyampaikan Laporan Praktikum Pemrograman Web 1 dengan judul "HTML Dasar" sebagai syarat mengikuti praktikum selanjutnya dan bahan penilaian terhadap aktivitas perkuliahan khususnya Praktikum oleh Dosen Pengampu mata kuliah Praktikum Pemrograman Web1 Bapak Rio Andriyat Krisdiawan, M.Kom di Laboratorium Fakultas Komputer Universitas Kuningan.

Saya memohon maaf apabila dalam penyusunan laporan ini ada kekurangan dan kesalahan penyusunan, semoga dapat memberikan manfaat khususnya saya selaku penyusun laporan ini. Akhir kata saya ucapkan terima kasih.

Wassalamualaikum Wr. Wb.

Kuningan, 11 Maret 2018

PENYUSUN

DAFTAR ISI

Kata Pengantar

Daftar Isi

BAB I PENDAHULUAN

1.1 Landasan Teori
1.1.1 Pengertian HTML
1.1.2 Struktur Dasar HTML
1.1.3 Tag HTML
1.1.4 Element HTML
1.1.5 Atribut HTML

BAB II PEMBAHASAN

2.1 Praktikum
2.2 PostTest

2.3 Latihan & Tugas

BAB III PENUTUP

3.1 Kesimpulan

DAFTAR PUSTAKA

BAB I

PENDAHULUAN

1.1 Landasan Teori

HTML merupakan dasar dari semua halaman web yang kita lihat di Internet.

1.1.1 Pengertian HTML

HTML adalah singkatan dari Hypertext Markup Language. Disebut hypertext karena di dalam HTML sebuah text biasa dapat berfungsi lain, kita dapat membuatnya menjadi link yang dapat berpindah dari satu halaman ke halaman lainnya hanya dengan meng-klik text tersebut. Kemampuan text inilah yang dinamakan hypertext, walaupun pada implementasinya nanti tidak hanya text yang dapat dijadikan link.

Disebut Markup Language karena bahasa HTML menggunakan tanda (mark), untuk menandai bagian-bagian dari text. Misalnya, text yang berada di antara tanda tertentu akan menjadi tebal, dan jika berada di antara tanda lainnya akan tampak besar. Tanda ini di kenal sebagai HTML tag.

Kode HTML yang kita buat akan diterjemahkan oleh web browser agar tampil seperti yang dirancang. Pada dasarnya seluruh web browser dapat menampilkan kode HTML sama baiknya, namun jika sudah berbicara mengenai desain halaman, tiap-tiap browser memiliki beberapa perbedaan.

HTML dirancang dan diatur oleh sebuah badan standarisasi dunia yang khusus menangani web, yaitu W3C (World Wide Web Consortium). Hal ini dikarenakan tiap-tiap program web browser menerjemahkan kode-kode HTML secara berbeda-beda, sehingga di perlukan sebuah standar yang sama untuk seluruh browser.

1.1.2 Struktur Dasar HTML

Setiap halaman HTML setidaknya memiliki struktur dasar yang terdiri dari : Tag DTD atau DOCTYPE, tag html, tag head, dan tag body. Inilah yang merupakan struktur paling dasar dari HTML, walaupun HTML tidak hanya berisi struktur tersebut.

1.1.3 Tag HTML

Sebagai sebuah bahasa markup, HTML membutuhkan cara untuk memberitahu web browser untuk apa fungsi sebuah text. Apakah text itu ditulis sebagai sebuah paragraf, list, atau sebagai link. Dalam HTML, tanda ini dikenal dengan istilah tag.

Hampir semua tag di dalam HTML ditulis secara berpasangan, yakni tag pembuka dan tag penutup, dimana objek yang dikenai perintah tag berada di antara tag pembuka dan tag penutup. Objek disini dapat berupa text, gambar, maupun video. Penulisan tag berada di antara dua kurung siku: “<” dan “>”.

Berikut adalah format dasar penulisan tag HTML:

<tag_pembuka>objek yang dikenai perintah tag</tag_penutup>

Sebagai contoh, perhatikan kode HTML berikut :

<p> Ini adalah sebuah paragraf </p>

<p> adalah tag pembuka, dalam contoh ini p adalah tag untuk paragraf.
</p> adalah tag penutup paragraf. Perbedaannya dengan tag pembuka terletak dari tanda forward slash (/)

1.1.4 Element HTML

Element adalah isi dari tag yang berada diantara tag pembuka dan tag penutup, termasuk tag itu sendiri dan atribut yang dimilikinya (jika ada). Sebagai contoh perhatikan kode HTML berikut:

<p> Ini adalah sebuah paragraf </p>

Pada contoh diatas, “<p>Ini adalah sebuah paragraf</p>” merupakan element p.

1.1.5 Atribut HTML

Atribut adalah informasi tambahan yang diberikan kepada tag. Informasi ini bisa berupa instruksi untuk warna dari text, besar huruf dari text, dll. Setiap atribut memiliki pasangan nama dan nilai(value) yang ditulis dengan name=”value”. Value diapit tanda kutip, boleh menggunakan tanda kutip satu (‘) atau dua (“).

Contoh kode HTML:

<a href="https://www.duniailkom.com">ini adalah sebuah link</a>

Pada kode HTML diatas, href=”https://www.duniailkom.com” adalah atribut. href merupakan nama dari atribut, dan https://www.duniailkom.com adalah value atau nilai dari atribut tersebut.

BAB II

PEMBAHASAN

2.1 Praktikumm

Modul1_1.html

Ketikkan script HTML yang ada pada modul pada editor text notepad/notepad++ dengan nama

file modul1_1.html dan lakukanlah running/open with web browser.

Contoh script dasar HTML

Hasil Running pada web browser

2.Modul1_2.html

Ketikkan script HTML yang ada pada modul pada editor text notepad/notepad++ dengan

nama file modul1_2.html dan lakukanlah running/open with web browser.

Script Modul1_2.html

Hasil Running pada web browser

3.Modul1_3.html

Ketikkan script HTML yang ada pada modul pada editor text notepad/notepad++ dengan

nama file modul1_3.html dan lakukanlah running/open with web browser.

Script Modul1_3.html

Hasil Running pada web browser

4.Modul1_4.html

Ketikkan script HTML yang ada pada modul pada editor text notepad/notepad++ dengan

nama file modul1_4.html dan lakukanlah running/open with web browser.

Script HTML Modul1_4.html

Hasil Running pada web browser

5.Modul1_5.html

Ketikkan script HTML yang ada pada modul pada editor text notepad/notepad++ dengan

nama file modul1_5.html dan lakukanlah running/open with web browser.

Script HTML Modul1_5.html

Hasil Running pada web browser

2.2 PostTest

Buatlah sebuah halaman web dengan tampilan seperti pada modul dengan isi menampilkan

daftar riwayat hidup masing-masing.

Untuk script html nya saya buatkan seperti berikut ini penyajiannya mengambil dari file latihan sebelumnya.

Script HTML untuk PostTest

Hasil Running pada web browser

2.3 Pertanyaan dan Tugas

Buatlah halaman website untuk menampilkan informasi riwayat hidup anda seperti pada latihan lalu tambahkan footer dan buat tampilan yang menarik

Berikut ini saya tampilkan script html untuk membuat halaman website untuk tugas.

Script HTML Tugas

Hasil Running pada web Browser

BAB III

PENUTUP

3.1 Kesimpulan

HTML merupakan dasar dari semua halaman web yang kita lihat di Internet.

1.2 Pengertian HTML

HTML memiliki Struktur Dasar beberapa bagian yang terpenting diantaranya : Tag HTML, Element HTML, dan Atribut HTML.

DAFTAR PUSTAKA

https://www.duniailkom.com/tutorial-belajar-html-dasar-untuk-pemula/

https://www.duniailkom.com/belajar-html-mengenal-struktur-dasar-html/

https://www.duniailkom.com/belajar-html-pengertian-tag-elemen-dan-atribut-pada-html/

Cari Blog Ini

Blog Praktikum