MODUL 1. PENGENALAN HTML
1.1. Tujuan
1. Mengenalkan kepada mahasiswa konsep umum HTML (HyperText Markup Language).
2. Mahasiswa dapat mengetahui dan memahami bahasa HTML sebagai dasar pemrograman untuk membuat web statis
3. Mahasiswa dapat memulai membuat web dengan bahasa HTML.
1.2. DASAR TEORI
1. Pengertian web
Web (World Wide Web) merupakan salah satu layanan yang didapat oleh pemakai komputer yang terhubung ke internet, yang dapat memudahkan pengguna komputer untuk berinteraksi dengan pengguna internet lainnya dan mencari informasi yang diperlukan.
2. Web browser
Browser web merupakan software yang digunakan untuk menampilkan informasi dari server web. Contoh dari web browser : Opera, Mozzila, Google Chrome, Internet Explorer, Netscape Navigator, Lynx, Konqueror.
3. Server Web
Server web adalah komputer yang digunakan untuk menyimpan dokumen-dokumen web, komputer ini akan melayani permintaan dokumen web dari kliennya.Contoh dari web server : IIS, PWS, Apache, Xitami.
4. HTML
HTML adalah salah satu yang memerintahkan bahasa pemrograman web desain juga biasa disebut script untuk menyusun dokumen-dokumen web.
Dalam pemrograman web, diperlukan suatu file teks yang bernama atau berekstensi HTML (Hypertext Markup Language). Ada dua cara untuk membuat sebuah web page : dengan menggunakan editor teks biasa (notepad, editplus), dengan HTML Editor.
Dokumen HTML disusun oleh elemen-elemen seperti : head, body, table, paragraf dan list. Untuk menandai berbgai elemen dalam suatu dokumen HTML, kita menggunakan tag.
Tag HTML terdiri atas sebuah kurung sudut kiri (<, lebih kecil), sebuah nama tag, dan sebuah kurung sudut kanan (>, tanda lebih besar). Tag umumnya berpasangan, misalkan tag awal <H1> berpasangan dengan tag akhir </H1>.
5. Struktur Dokumen HTML :
Elemen yang dibutuhkan untuk membuat suatu dokumen HTML dinyatakan dengan tag <html>, <head>, dan <body> berikut tag-tag pasangannya. Setiap dokumen terdiri atas tag head dan body. Elemen head berisi informasi tentang dokumen tersebut, dan elemen body berisi teks yang sebenarnya yang tersusun dari link, grafis, paragraf dan elemen lainnya.
Berikut ini adalah pola dasar sebuah dokumen HTML :
<html>
<head>
…. Informasi tentang dokumen HTML.
</head>
<body>
…. Informasi tentang yang akan ditampilkan dalam browser web.
</body>
</html>
•
Tag
Adalah teks khusus (markup) yang berupa suatu pasangan yang terdiri 2 bagian yang disebut dengan tag awal dan tag akhir.
Tag awal dinyatakan dalam bentuk <nama tag> dan tag akhir dinyatakan dalam bentuk </nama tag> sebagai penutup isi dokumen html.
•
Element
Adalah isi dari tag yang berada diantara tag pembuka dan tag penutup. Elemen tidak hanya berisi text, namun juga bisa tag lain.
•
Atribut
Atribut adalah informasi tambahan yang diberikan kepada tag. Informasi ini bisa berupa instruksi untuk warna dari text, besar huruf dari text.
Setiap atribut memiliki pasangan nama dan nilai (value), dan ditulis dengan name=”value”. Value diapit tanda kutip, boleh tanda kutip satu (‘) atau dua (“).
•
Komentar
Seperti dalam bahasa pemrograman yang lainnya, HTML juga memiliki komentar yang dapat digunakan untuk menjelaskan bagian-bagian dari isi web dokumen. Penulisan komentar dalam HTML sebagai berikut:
<!- –
Isi komentar
–>
1.3. PELAKSANAAN PRAKTIKUM
1.
Percobaan 1 (Dokumen HTML)
Buka aplikasi notepad.
Ketikkan script berikut di dalam notepad:
Simpan dengan nama dokumen.html
Buka file yang disimpan menggunakan browser.
2.
Percobaan 2 (Heading)
Buka aplikasi notepad.
Ketikkan script berikut di dalam notepad:
Simpan dengan nama heading.html
Buka file yang disimpan menggunakan browser.
1.4. Latihan
1. Latihan 1 (Paragraf and Align)
Buka aplikasi notepad.
Ketikkan script berikut di dalam notepad :
Simpan dengan nama paragraf.html
Buka file yang disimpan menggunakan browser.
1.5. Tugas
1. Buatlah file html dengan tampilan sebagai beriikut :
