Edisi UNIVERSITAS NEGERI SEMARANG. Badan Pengembangan Teknologi Informasi dan Komunikasi. Modul Pelatihan H T M L

1 Edisi

UNIVERSITAS NEGERI SEMARANG

Badan Pengembangan Teknologi Informasi dan Komunikasi

ModulPelatihan HTML

UNIVERSITAS NEGERI SEMARANG

Modul Pelatihan HTML

Akhmad Munawar http://about.me/akhmad.munawar

M O D U L

P E L A T I H A N

1 Bagian

H T M L

Berkenalan dengan HTML

H

ypertext Markup Language (HTML) adalah bahasa yang digunakan untuk menulis halaman web. Ciri utama dokumen HTML adalah adanya tag dan elemen. Elemen dalam dokumen HTML dikategorikan menjadi dua yaitu elemen yang berfungsi memberikan informasi tentang dokumen tersebut dan elemen yang menentukan bagaimana isi suatu dokumen ditampilkan oleh browser, seperti paragraf, list(daftar), tabel dan lain-lain. Sedangkan tag dinyatakan dengan tanda lebih kecil “ < “ ( tag awal ) dan tanda lebih besar “ > “ (tag akhir). Dalam penggunaannya sebagian besar kode HTML tersebut harus terletak di antara tag kontainer. Yaitu diawali dengan dan diakhiri dengan (terdapat tanda "/"). Dokumen HTML mempunyai tiga buah tag utama yang membentuk struktur dari dokumen HTML yaitu HTML,HEAD dan BODY Tag HTML berfungsi untuk menyatakan suatu dokumen HTML, tag HEAD berfungsi untuk memberikan informasi tentang dokumen HTML dan tag BODY berfungsi untuk menyimpan informasi atau data yang akan ditampilkan dalam dokumen HTML. Contoh penulisan tag HTML sederhana : Ini halaman situs Anda. Letakkan perintah-perintah Ini halaman situs Anda. Letakkan perintah-perintah Ini halaman situs Anda. Letakkan perintah-perintah Ini halaman situs Anda. Letakkan perintah-perintah

1

HTML HTML HTML HTML

di di di di

sini. sini. sini. sini.

LISTS Terdapat lima tipe list yang dapat digunakan, yaitu : Unordered Lists

: Membuat daftar item dengan tanda bullet. List entries didefinisikan dengan tag
• . Contoh :
  • item nomer 1
  • item nomer 2
  • item nomer 3
  
  
  Hasil dari kode di atas adalah: Item nomer 1 Item nomer 2 Item nomer 3 Ordered Lists
  : Juga digunakan untuk membuat daftar item, dengan tiap item dapat menggunakan angka arab atau romawi. List entries juga didefinisikan dengan
  1. tag. Contoh :
     1. item nomer 1
     2. item nomer 2
     3. item nomer 3
     
     
     Hasil dari kode di atas adalah : 1. Item nomer 1 2. Item nomer 2 3. Item nomer 3 Definition Lists

     : Contoh :

     
     
     item pertama. penjelasan tentang item pertama. item kedua. penjelasan tentang item kedua
     
     

     
     
     Hasil dari kode di atas adalah : Item pertama. Penjelasan tentang item pertama. Item kedua. Penjelasan tentang item kedua
     
     2
     
     IMAGES Digunakan untuk menampilkan image atau animasi gif pada halaman web Anda. Atribut : alt, align=(center, left, right), hspave, vspace, border, width & height Contoh :
     
     TABLE Dalam pembuatan homepage, tabel memiliki fungsi yang tidak kalah penting dengan tag-tag HTML lainnya. Pertama tabel berfungsi untuk menampilkan informasi secara terstruktur, ringkas dan mudah dibaca, kedua berfungsi untuk mengatur tampilan homepage agar lebih menarik. Tag utama untuk tabel yaitu dan untuk membuat judul tabel tag-nya table header lalu untuk membuat data tabel atau isi tabel menggunakan tag table Data dan untuk membuat baris adalah memakai tag Table Rows . Contoh :

     baris	baris
     baris	baris

     
     
     ="1" width= "500" align="center"> 1 kolom 1 1 kolom 2
     
     2 kolom 1 2 kolom 2
     
     Beberapa perintah penting untuk membuat tabel: 1. .... merupakan perintah utama d alam pembuatan tabel, tabel dengan ketebalan 1px 2. ... tag untuk membuat baris 3. ... tag untuk membuat kolom/cell 4. colspan tag untuk merge/melebarkan kolom/cell 5. rowspan tag untuk merge/melebarkan baris perintah HTML untuk membuat tabel seperti berikut ini: Satu Dua Tiga Empat
     
     3
     
     

     Satu

     Dua

     Tiga

     Empat

     
     
     Perintah HTML untuk membuat tabel seperti berikut ini: Satu Dua
     
     Tiga
     
     

     Satu
     Dua	Tiga

     
     
     4