3.1 Penanganan Text
Teks merupakan komponen terpenting dalam menyampaikan informasi. Oleh karena itu, agar informasi yang disampaikan melalui web dapat dipahami dengan mudah oleh pengunjung web, maka perlu diketahui apa saja yang dapat dilakukan oleh HTML terhadap teks. Berikut ini beberapa tag yang berhubungan dengan hal tersebut.
- Tag <h>
Heading merupakan element atau tag HTML yang berfungsi untuk menunjukkan bagian penting pada halaman web. Element tag heading ini memiliki enam tingkatan yang berurutan yaitu <h1>,<h2>,<h3>,<h4>,<h5>,<h6> yang bisa digunakan untuk menambah ke struktur halaman web, perbedaan masing-masing heading yaitu besar hingga kecil teks. contohnya tag/element <h1> lebih besar dari element/tag <h2> dan seterusnya.
penggunaan masing-masing heading juga berbeda, berikut penggunaan masing-masing tag/element heading yang sering digunakan pada pengolahan halaman web :
-
- <h1> heading yang digunakan untuk penulisan judul utama dari dokument
- <h2> heading yang digunaakan sebagai sub <h1>
- <h3> heading yang digunakan sebagai sub <h2>
- untuk penggunaan <h4><h4><h5><h6> tergantung peogramer sendiri untuk memperindah halaman web.
Tag ini mempunyai satu atribut, yaitu align yang berfungsi untuk mengatur perataannya, dengan value/nilainya ada 3 yaitu left, center dan right. Contoh <h1 align=center>Selamat Datang</h1>
- Tag <b>, tag <i>, tag <u>
Ini merupakan tag yang umum, dimana tag <b> (bold) digunakan untuk membuat teks tercetak tebal, tag <i> (italic) untuk membuat teks tercetak miring dan tag <u> (underline) untuk membuat teks bergaris bawah. Ketiga tag ini tidak mempunyai atribut.
- Tag <small>, tag <big>
Tag <small> digunakan untuk membuat teks tercetak dengan ukuran kecil, sebaliknya tag <big> akan membuat teks tercetak dengan ukuran besar.
- Tag <sup>, tag <sub>
Tag <sup> digunakan untuk membuat teks naik setengah pt (point), sebaliknya tag <sub> digunakan untuk turun setengah pt. Biasanya tag ini digunakan dalam pembuatan rumus kimia atau perpangkatan.
- Tag <font>, Tag <basefont>
Tag <font> digunakan untuk menentukan jenis huruf, ukuran dan warna yang digunakan terhadap teks, sedangkan tag <basefont> digunakan untuk menetapkan default warna, ukuran, dan jenis huruf untuk semua teks yang ada dibawah elemen ini. Tag <basefont> ini hanya didukung oleh browser IE.
Tag <font> dan <basefont> mempunyai 3 atribut yaitu face untuk bentuk huruf, size untuk ukuran huruf dan color untuk warna huruf.
- Tag <P>
Tag <p> digunakan untuk membuat paragraf baru dan mengatur perataannya. Tag <p> mempunyai atribut align dengan nilainya left, center dan right.
- Tag <dl>,<dt>,<dd>
Tag ini digunakan untuk memformat teks dalam pendefinisian sebuah istilah.
- Tag <pre>
Digunakan untuk menampilkan teks apa adanya, seperti yang ditulis di editor.
- Tag <address>
Tag <address> digunakan untuk mendefinisikan kontak dari penulis/pemilik dokumen atau artikel.
Sesuai dengan namanya address yang berarti alamat, elemen ini akan meliputi berbagai informasi kontak penulis mulai dari alamat fisik, alamat email, nomor telepon, URL, sosial media, dan lain sebagainya.
Pada umumnya teks dalam elemen <address> dibuat miring dan browser akan menambahkan jeda baris pada sebelum dan sesudah elemen <address>.
- Tag <abbr>
Tag <abbr> berfungsi untuk mendefinisikan singkatan atau akronim. Kata abbr dalam tag <abbr> menunjukkan abbreviation yang berarti singkatan. Seperti contohnya “WWW”, “HTML”, “CSS”, “Mrs.”, “Drs.”, dan lain sebagainya yang dari itu semua menunjukkan singkatan dan memiliki kepanjangan.
Elemen <abbr> sering digunakan bersamaan dengan atribut global title, yang mana atribut ini nantinya akan berisi informasi singkat mengenai kepanjangan dari singkatan tersebut dan tidak boleh berisi informasi lain.
Nantinya, kepanjangan yang ditulis pada atribut title dapat ditampilkan ketika pointer/mouse menyentuh elemen <abbr> tersebut.
3.2 Penanganan Warna
Tata pewarnaan konten web sangat mempengaruhi kualitas website. Oleh karena itu diperlukan pengetahuan bagaimana cara mengatur pewarnaan tersebut. Dalam bahasa HTML, perintah-perintah untuk menampilkan warna dapat dilakukan dengan dua cara, yaitu :
- Menggunakan Istilah bahasa warna yang umum, seperti :
| Kode Bahasa Warna | Arti |
| Black | Warna hitam |
| Yellow | Warna kuning |
| Green | Warna hijau |
| Blue | Warna biru |
| dst | Dan seterusnya |
- Menggunakan kombinasi bilang Hexadecimal, yaitu bilangan yang terdiri dari 1,2,3,4,5,6,7,8,9,0,a,b,c,d,f. Dengan aturan : diawali oleh tanda # diikuti oleh tiga atau 6 bilangan tersebut. Contoh : #fff (warna putih), #ffd700 (warna kuning)
Berikut ini contoh dan fungsi pengaturan warna ini :
| Tag | Fungsi |
| <body bgcolor=”red” color=”yellow”> | bgcolor merupakan perintah untuk memberi warna latar belakang. Jika diletakkan pada tag body, maka akan berpengaruh pada seluruh halaman web |
| <font color=”green”> | Hanya berpengaruh pada teks yang diberi tag font hingga tag tersebut di tutup |
| <table bgcolor=”cyan”>
<tr bgcolor=”magenta”> <td bgcolor=purple> |
Memberikan efek warna latar belakang pada sebuah tabel, baris atau sel |
PRAKTIKUM MODUL 3
Dalam praktikum Modul 3 ini Peserta Didik akan belajar penggunaan tag-tag HTML yang berhubungan dengan penanganan teks dan warna. Buat folder Modul_3 di dalam folder Modul_HTML_CSS_Javascript, praktikan contoh di bawah ini, pahami lalu ambil kesimpulan.
Penanganan Text
- Tag <h>
Buat file dalam folder Modul_3 dengan nama modul3_h.html, tuliskan script seperti di bawah ini : 
- Tag <b>, tag <i>, tag <u>
Buat file dalam folder Modul_3 dengan nama modul3_biu.html, tuliskan script seperti di bawah ini : 
- Tag <small>, tag <big>
Buat file dalam folder Modul_3 dengan nama modul3_smallbig.html, tuliskan script seperti di bawah ini : 
- Tag <sup>, tag <sub>
Buat file dalam folder Modul_3 dengan nama modul3_subsup.html, tuliskan script seperti di bawah ini : 
- Tag <font>
Buat file dalam folder Modul_3 dengan nama modul3_font.html, tuliskan script seperti di bawah ini : 
- Tag <p>
Buat file dalam folder Modul_3 dengan nama modul3_p.html, tuliskan script seperti di bawah ini : 
- Tag <dl><dt><dd>
Buat file dalam folder Modul_3 dengan nama modul3_dldtdd.html, tuliskan script seperti di bawah ini : 
- Tag <pre>
Untuk praktikum buat file baru dengan file name modul3_pre.html di dalam folder Modul_3, ketikan script seperti di bawah ini : 
- Tag <address>
Untuk praktikum buat file baru dengan file name modul3_address.html di dalam folder Modul_3, ketikan script seperti di bawah ini : 
- Tag <abbr>
Untuk praktikum buat file baru dengan file name modul3_abbr.html di dalam folder Modul_3, ketikan script seperti di bawah ini : 
Daftar Pustaka :
- http://www.w3schools.com/tags/ref_colornames.asp
- http://www.w3schools.com/tags/tag_font.asp
- http://www.w3schools.com/tags/tag_basefont.asp