Download to read offline
Uploaded bySahrul Sindriana
DASAR HTML
Dokumen ini menjelaskan tentang HTML (Hyper Text Markup Language), sebuah bahasa markup untuk membuat halaman web. Terdapat berbagai elemen dan tag yang digunakan dalam HTML untuk menentukan struktur dan tampilan dokumen, seperti <head>, <body>, serta cara menambahkan latar belakang, mengganti warna teks, dan membuat hyperlink. Contoh kode HTML juga disediakan untuk ilustrasi cara penggunaan elemen dan tag tersebut.
DASAR HTML
- 1. 1 Bab I HYPER TEXT MARKUP LANGUAGE Pengertian HTML (HYPER TEXT MARKUP LANGUAGE) HTML (HYPER TEXT MARKUP LANGUAGE) adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser internet. Pada bab ini kita akan mempelajari bahasa markup atau markup language kegunaan bahasa ini ialah untuk memanipulasi browser sehingga dapat menampilkan informasi yang dapat dibaca oleh computer. Html Berupa kode-kode tag yang mengntruksikan browser untuk menghasilkan tampilan yang di inginkan. Sebuah file Html dapat dibuka menggunakan browser web seperti Microsoft Internet Exploler , Mozila Firefox, Google chrome, Opera, Safari, Dan lain-lain. a. Dasar-Dasar HTML Fungsi utama HTML memberikan perintah kepada browser tampilan melalui Tag-tag yang di tulis dalam HTML. Dengan demikian browser menghasilkan tampilan yang sesuai dengan perintah-perintah yang sudah dibuat atau di perintahkan terlebih dahulu. Untuk menuliskan suatu dokumen HTML Dapat digunakan perangkat sederhana yang khusus diantaranya : Notepad Dreamweaver Ultraedit Setelah selesai menuliskan dokumen tersebut lakukan save dengan format Nama_file.html dan pada bagian perintah SAVE TYPES pilih ALL FILES. b. Struktur HTML Dokumen Html dapat terdiri dari teks, Gambar, Suara ataupun video. Satu hal yang membedakan HTML dengan dokumen lainya adalah adanya elemen-elemen HTML beserta tag-tagnya. Elemen dan tag ini berfungsi untuk memformat atau menandai suatu bagian tertentu dari dokumen HTML dan juga menentukan struktur bagian tersebut dalam dokumen HTML. c. Elemen HTML Pada dasarnya elemen HTML terdiri dari 2 kategori : 1. Elemen <HEAD> berfungsi untuk memberikan informasi atau mendeklarasikan dokumen tersebut. 2. Elemen <BODY> berfungsi untuk menentukan bagaimana isi suatu dokumen ditampilkan pada browser
- 2. 2 d. Tag Pada dokumen HTML sebuah teks bias memuat intruksi yang ditandai dengan kode atau lebih dikenal dengan TAG. Tag ini dinyatakan dengan sebuah tanda lebih kecil dan lebih besar “ < > “. Tag biasanya berpasangan awal tag dinyatakan dalam bentuk <Nama_tag> dan akhir Tag dinyatakan dalam bentuk </Nama_tag>. Contoh diawali dengan <HTML> dan diakhiri dengan </HTML>
- 3. 3 BAB II DASAR-DASAR HTML 1. Membuat dokumen HTML Dokumen HTML dimulai dengan perintah Awal <HTML>, Kemudian <HEAD> dan <TITLE>. Antara perintah <TITLE> dengan </TITLE> adalah bagian judul dokumen yang akan dibuat. Misalkan diberi nama “Web pertama aku” , Kemudian ditutup dengan perintah </HEAD> Ini merupakan bagian pertama dari bagian Dokumen HTML. Bagian kedua atau isi dimulai dengan perintah <BODY> dan </BODY>. Antara kedua perintah tersebut berisi bagian dari isi HTML. Pada bagian akhir di tutup dengan </HTML>. Contoh Program : <html> <head> <title> Belajar html </title> </head> <body> Ini web pertama aku ! </body> </html> Hasil tampilan : Gambar 1
- 4. 4 2. Menambahkanbackground pada Halaman Web Halaman HTML dapat ditambahkan background baik berupa warna ataupun gambar. Tag dilakukan pada perintah <BODY>. Untuk menambahkan background warna perintahnya adalah : <BODY BGCOLOR=”Warna”> Sedangkan untuk menambahkan Background gambar perintahnya adalah : <BODY BACKGROUND=”Nama_gambar.JPG”> Format gambar tidak hanya .JPG bias juga format gambar .PNG, .Gif, Dll. Contoh program : Background Warna <html> <head> <title> Belajar html </title> </head> <body Bgcolor="Blue"> Ini web pertama aku ! </body> </html> Hasil tampilan : Gambar 2
- 5. 5 Background Foto <html> <head> <title> Belajar html </title> </head> <body Background="Fotoku.Jpg"> Ini web pertama aku ! </body> </html> Hasil tampilan Gambar 3 3. Mengganti warna text Untuk mengganti warna text di tambahkan perintah <FONT COLOR=”WARNA”> Pada text yang akan di ganti warnanya dan di akhiri dengan </FONT COLOR> Contoh Program : <html> <head> <title> Belajar html </title> </head>
- 6. 6 <body Bgcolor="yellow"> <font color="RED"> ini warna merah !</font color> <br> <font color="green">Ini warna hijau</font color> <br> <font color="Pink">Ini warna Merah jambu</font color> <br> </body> </html> Hasil Tampilan Gambar 4 4. Mengenter dan menambahkan garis pada halman HTML Tag untukmeng enter adalah <BR> sedangkan Tag untuk menambahkan garis adalah <HR> . Contoh Program : <html> <head> <title> Belajar html </title> </head> <body Bgcolor="yellow"> <font color="RED"> ini warna merah !</font color> <br> <hr> <font color="green">Ini warna hijau</font color> <br> <hr> <font color="Pink">Ini warna Merah jambu</font color> <br> <hr> </body>
- 7. 7 </html> Hasiltampilan Gambar 5 5. Hyperlink Untuk membuat hyperlink sederhana pada web gunakan perintah <A HREF=”NAMA_HTML_YANG_DI_TUJU.HTML”> Keterangan Link </A> Contoh Program : <html> <head> <title> Belajar html </title> </head> <body> Halaman Pertama , Untuk melanutkan silahkan klik <br> <A HREF="LINK2.HTML"> Masuk ke halaman selanjurnya </A> </body> </html> Simpan dengan nama Link1.HTML <html> <head> <title> Belajar html </title> </head> <body> halaman kedua , Untuk kembali silahkan klik <br> <A HREF="LINK1.HTML"> kembali ke halaman sebelumnya ! </A> </body> </html> Simpan dengan nama Link2.HTML
- 8.