Tuesday, September 1, 2015

Atribut HTML

kelasruguru

Didalam penulisan Tag pada HTML, biasanya disertai dengan informasi tambahan pada elemen HTMLnya. Untuk melakukan itu, tag ditambahkan seuah atribut.


Atribut HTML


  • Elemen HTML dapat memiliki atribut
  • Atribut memberikan informasi tambahan tentang elemen
  • Atribut selalu ditulis pada tag pembuka
  • Atribut ditulis dalam nama/nilai selalu berpasangan contoh: nama-atribut="nilai-atribut"

Atribut Lang

Bahasa dokumen bisa dideklaarasikan dalam tag <html>

bahasa tersebut di deklarasikan dalam tag lang.

Mendeklarasikan bahasa sangat penting untuk aplikasi aksesibilitas (pembaca layar) dan mesin pencari:

<!DOCTYPE html>
<html lang="en-US">
<body>

<h1>Heading Pertamaku</h1>
<p>Paragraph pertamaku.</p>

</body>
</html>

Dua huruf pertama menentukan bahasa (en). Jika ada dialek, menggunakan dua huruf lebih (AS).




Atribut title (Judul)

Paragraf HTML didefinisikan dengan tag <p>.
Dalam contoh ini, elemen <p> memiliki atribut title. Nilai atributnya adalah "Tentang W3Schools":

Contoh:

<p title="Tentang kelasruguru">
kelasrugu adalah web belajar komputer online.
web ini menyediakan befbagai tutorial komputer dan semua referensinya,
termasuk referensi dari tutorial HTML, CSS, JavaScript, XML, SQL, PHP, ASP, dll.
</p>

Bila Anda memindahkan mouse di atas elemen, title akan ditampilkan sebagai tooltip.




Atribut href

Link HTML didefinisikan dengan tag <a>. Alamat link ditentukan dalam atribut href:

Contoh:

<a href="http://kelasruguru.blogspot.com">Ini adalah sebuah link</a>




Atribut Size (Ukuran)

Gambar HTML didefinisikan dengan tag <img>.



Nama file dari sumber (src), ukuran gambar (lebar dan tinggi) semua hal tersebut adalah sebagai atribut:

Contoh:


<img src="kelasruguru.jpg" width="104" height="142">


Ukuran gambar ditentukan dalam satuan pixel: width = "104" berarti lebar layarnya adalah 104 pixel.




Atribut ALT

Atribut alt digunakan untuk menentukan sebuah teks alternatif yang akan ditunjukkan, ketika sebuah elemen HTML tidak dapat ditampilkan.


Nilai atribut dapat dibaca oleh "pembaca layar". Dengan cara ini, seseorang "mendengarkan" untuk halaman web, yaitu orang buta, bisa "mendengar" suara pada Atribut alt menentukan sebuah teks alternatif yang akan digunakan, ketika sebuah elemen HTML tidak dapat ditampilkan.


Nilai atribut dapat dibaca oleh "pembaca layar". Dengan cara ini, seseorang "mendengarkan" untuk halaman web, yaitu orang yang buta, bisa "mendengar" elemen suara bacaan sebagai ganti elemen objek tersebut.


Contoh:


<img src="kelasruguru.jpg" alt="kelasruguru.blogspot.com" width="104" height="142">




Saran Kami: Selalu Gunakan Atribut huruf kecil

HTML5 standard tidak membutuhkan atribut penamaan dengan metode lower case.
Title attribute bisa ditulis dengan metode upper atau lower case like Title and/or TITLE.
W3C Merekomendasikan metode lowercase pada HTML4, dan wajib menggunakan lowercase untuk standart yang lebih ketat seperti dokumen XHTML.

Huruf kecil adalah yang paling banyak digunakan. Huruf kecil lebih mudah dalam mengetik. Pada W3Schools kita selalu menggunakan huruf kecil untuk nama atribut.

Saran Kami: Selalu Gunakan Quote (tanda kutip) pada Nilai Atribut 

HTML5 standar tidak memerlukan tanda kutip di nilai atribut.

Atribut href, yang dimaksud di atas, dapat ditulis sebagai berikut:

Contoh:

<a href=http://kelasruguru.blogspot.com>

W3C merekomendasikan kutipan di HTML4, dan wajib menggunakan kutipan untuk jenis dokumen ketat seperti XHTML.

Kadang-kadang sangat perlu untuk menggunakan tanda kutip. Hal ini dapat menyebabkan atribut tidak akan ditampilkan dengan benar, karena mengandung spasi:

Contoh:

<p title=Tentang Kelasruguru>

Menggunakan tanda kutip adalah yang paling umum. Menghilangkan tanda kutip dapat menyebabkan kesalahan. Pada W3Schools kita selalu menggunakan tanda kutip pada nilai sebuah atribut.

Single atau Double Quotes?

Gaya kutipan ganda adalah yang paling umum pada HTML, tapi gaya tunggal juga dapat digunakan.

Dalam beberapa situasi, ketika nilai atribut itu sendiri berisi tanda kutip ganda, maka perlu menggunakan tanda kutip tunggal:

<p title='John "ShotGun" Nelson'>

Atau sebaliknya:

<p title="John 'ShotGun' Nelson">

Share this

0 Comment to "Atribut HTML"

Post a Comment