SEBELUMNYA kita mempelajari soal elemen HTML.
Saat ini kita lanjut ke atribut HTML.
Atribut memberikan informasi tambahan tentang elemen HTML.
Semua elemen HTML dapat memiliki atribut.
Atribut memberikan informasi tambahan tentang suatu elemen.
Atribut selalu ditentukan dalam tag awal.
Atribut biasanya berada dalam pasangan nama/nilai seperti: nama="nilai".
Atribut href
Tautan HTML didefinisikan dengan tag <a>.Alamat tautan ditentukan dalam atribut href:
Contoh:
<a href="https://shared-sharing.blogspot.com">Ini adalah tautan</a>
Kamu akan mempelajari lebih lanjut tentang tautan dan tag <a> nanti dalam tutorial ini.Atribut src
Gambar HTML didefinisikan dengan tag <img>.Nama berkas sumber gambar ditentukan dalam atribut src.
Contoh:
<img src="logo_shared-sharing.jpg">
Atribut Lebar dan Tinggi
Gambar dalam HTML memiliki seperangkat atribut ukuran, yang menentukan lebar dan tinggi gambar.Contoh:
<img src="logo_shared-sharing.jpg" width="209" height="103">
Ukuran gambar ditentukan dalam piksel: width = "209" berarti lebar 209 piksel.Kamu akan belajar lebih banyak tentang gambar di tahap Gambar HTML Shared-sharing.
Atribut alt
Atribut alt menentukan teks alternatif yang akan digunakan, ketika gambar tidak dapat ditampilkan.Nilai atribut dapat dibaca oleh pembaca layar.
Dengan cara ini, seseorang "mendengarkan" halaman web.
Misalnya, orang yang memiliki gangguan penglihatan, dapat "mendengar" elemen tersebut.
Contoh:
<img src="logo_shared-sharing.jpg" alt="Gambar logo blog Shared-sharing">
Atribut alt juga berguna jika gambar tidak ada.Atribut style
Atribut style digunakan untuk menentukan gaya suatu elemen, seperti warna, jenis font, ukuran, dan lain-lain.Contoh:
<p style="color: green">Ini adalah paragraf.</p>
Kamu akan mempelajari lebih lanjut tentang penataan gaya di tutorial ini, dan di Tutorial CSS kami.Atribut lang
Bahasa dokumen dapat dideklarasikan dalam tag <html>.Bahasa dideklarasikan dengan atribut lang.
Mendeklarasikan bahasa penting untuk aplikasi aksesibilitas (pembaca layar) dan mesin pencari:
Contoh:
<!DOCTYPE html>
<html lang="id">
<body>
...
</body>
</html>
Dua huruf dalam nilai atribut pada contoh di atas, menentukan bahasa Indonesia.<html lang="id">
<body>
...
</body>
</html>
Sebagian besar website menggunakan nilai en-US.
Dua huruf pertama (en) artinya bahasa Inggris.
Sedangkan dua huruf berikutnya (US) artinya dialek Amerika Serikat.
Judul title
Di sini, atribut title ditambahkan ke elemen <p>.Nilai dari atribut title akan ditampilkan sebagai tooltip (teks bantuan) ketika kamu mengarahkan mouse ke paragraf:
Contoh:
<p title="Aku adalah tooltip atau teks bantuan">Ini adalah paragraf.</p>
Gunakan Atribut Huruf Kecil
Standar HTML5 tidak mengharuskan nama atribut menggunakan huruf kecil.Atribut judul juga dapat ditulis dengan huruf besar atau kecil seperti title atau TITLE.
Namun, W3C merekomendasikan huruf kecil dalam HTML, dan menuntut huruf kecil untuk tipe dokumen yang lebih ketat seperti XHTML.
Di Shared-sharing kami selalu menggunakan nama atribut huruf kecil.
Kutip Nilai Atribut
Standar HTML5 tidak memerlukan tanda kutip di sekitar nilai atribut.Atribut href, dalam contoh-contoh di atas, dapat ditulis tanpa tanda kutip:
Contoh yang buruk:
<a href=https://shared-sharing.blogspot.com>Ini adalah tautan</a>
Contoh yang baik:
<a href="https://shared-sharing.blogspot.com">Ini adalah tautan</a>
W3C merekomendasikan kutipan dalam HTML, dan menuntut penawaran untuk tipe dokumen yang lebih ketat seperti XHTML.Terkadang perlu menggunakan kutipan.
Contoh ini tidak akan menampilkan atribut judul dengan benar, karena mengandung spasi:
<p title=tentang Shared-sharing>
Pada umumnya setiap website menggunakan kutipan.Sedangkan menghilangkan tanda kutip dapat menghasilkan kesalahan.
Di Shared-sharing kami selalu menggunakan tanda kutip di sekitar nilai atribut.
Kutipan Tunggal atau Ganda?
Kutipan ganda di sekitar nilai atribut adalah yang paling umum dalam HTML, tetapi tanda kutip tunggal juga dapat digunakan.Dalam beberapa situasi, ketika nilai atribut itu sendiri berisi tanda kutip ganda, perlu menggunakan tanda kutip tunggal.
Contoh:
<p title='Aegon "Jon Snow" Targaryen'>
Atau sebaliknya:
<p title="Aegon 'Jon Snow' Targaryen">
Ringkasan:- Semua elemen HTML dapat memiliki atribut
- Atribut title memberikan informasi "tooltip" tambahan
- Atribut href menyediakan informasi alamat untuk tautan
- Atribut width dan height memberikan informasi ukuran untuk gambar
- Atribut alt menyediakan teks untuk pembaca layar
- Di Shared-sharing kami selalu menggunakan nama atribut huruf kecil
- Di Shared-sharing kami selalu mengutip nilai atribut dengan tanda kutip ganda
Atribut HTML
Di bawah ini adalah daftar alfabet beberapa atribut yang sering digunakan dalam HTML, yang akan kamu pelajari lebih lanjut dalam tutorial ini:| Atribut | Deskripsi |
|---|---|
| alt | Menentukan teks alternatif untuk gambar, ketika gambar tidak dapat ditampilkan |
| disabled | Menentukan bahwa elemen input dinonaktifkan |
| href | Menentukan URL atau alamat web untuk tautan |
| id | Menentukan identitas unik untuk suatu elemen |
| src | Menentukan URL atau alamat web untuk suatu gambar |
| style | Menentukan gaya penampilan atau CSS Style sebaris untuk suatu elemen |
| title | Menentukan informasi tambahan atau teks bantuan seperti tooltip |
Sekian pelajaran tahap keempat kita.
Nantikan pelajaran tahap kelima hanya di Shared-sharing.
Jangan lupa untuk tinggalkan komentarnya!
<- Tahap KetigaTahap V ->
Posts
0 komentar:
Post a Comment