Ayam Koding

Belajar Algoritme & Pemrograman

Cara Menulis Kutipan dan Sitasi HTML

Updated on 2017-01-09

Pada tutorial kali ini kita akan membahas mengenai cara menulis kutipan dan sitasi HTML. Penggunaan kutipan biasa digunakan untuk mengutip tulisan milik orang lain untuk dicantumkan.

Sitasi untuk HTML ada beberapa macam dan bisa khusus untuk bagian tertentu saja. Ada sitasi untuk singkatan, informasi kontak, kutipan dari sumber, dll. Selain itu, kita akan membahas mengenai berbagai macam tag seperti untuk membalikan huruf dari kanan ke kiri.


1. Menggunakan tag <blockquote> untuk Kutipan HTML

Anda bisa menggunakan kutipan dari sumber lain dengan tag <blockquote> pada HTML.

Contoh:

<!DOCTYPE html>
<html>
  <body>

  <p>Menggunakan element blockquote untuk sitasi.</p>

   <blockquote cite="http://kbbi.web.id/cabai-atau-cabe">
   Menurut KBBI, cabai adalah tanaman perdu yang buahnya berbentuk bulat panjang dengan ujung meruncing, apabila sudah tua berwarna merah kecokelat-cokelatan atau hijau tua, berisi banyak biji yang pedas rasanya.
   </blockquote>

  </body>
</html>

Output :

fungsi dari tag blockquote HTML


2. Menggunakan tag <q> untuk kutipan singkat pada HTML

Anda bisa menggunakan tag <q> untuk mendefinisikan kutipan singkat. Biasanya menggunakan tanda untuk memasukan kutipan. Sehingga mempermudah cara menulis kutipan dan sitasi pada HTML.

Contoh :

<!DOCTYPE html>
<html>
  <body>

  <p>Untuk memasukan kutipan singkat dapat menggunakan elemen q.</p>

  <p>Soekarno berkata : <q>Beri aku 1.000 orang tua, niscaya akan kucabut semeru dari akarnya. Beri aku 10 pemuda niscaya akan kuguncangkan dunia</q></p>

  </body>
</html>

Output :

cara menggunakan kutipan singkat HTML


3. Menggunakan tag <abbr> Untuk Singkatan
Anda bisa menggunakan elemen tag <abbr> untuk menulis singkatan atau sebuah akronim. Membuat akronim dapat memberikan informasi pada user, sistem penerjemah, dan mesin pencari.

Contoh :

<!DOCTYPE html>
<html>
  <body>

  <p><abbr title="Chief Executive Officer">CEO</abbr> adalah pemimpin sebuah perusahaan.</p>

  <p>Membuat tanda tag abbr bisa untuk memperjelas singkatan</p>

  </body>
</html>

Output :

cara menampikan singkatan HTML

Ketika cursor diarahkan ke mouse akan menampilkan akronim.


4. Menggunakan tag <address> untuk Informasi Kontak

Anda bisa menggunakan tag <address> untuk mendefinisikan kontak informasi (autor/pemilik) dari sebuah dokumen atau sebuah artikel. Elemen ini akan menampilkam tulisan dalam bentuk italic (miring). Kebanyakan browser akan memberikan garis break sebelum dan sesudah ada elemen.

Contoh :

<!DOCTYPE html>
<html>
  <body>

  <p>Elemen tag address pada HTML akan memberikan informasi kontak dari penulis dokumen.</p>

  <address>
  Ditulis oleh AnonymousBro.<br>
  Visit us at:<br>
  ayamkoding.com<br>
  Indonesia<br>
  </address>

 </body>
</html>

Output :

cara membuat sitasi pada HTML


5. Menggunakan tag <bdo> untuk Bi-Directional Override

Anda bisa menggunakan tag <bdo> untuk mengubah arah teks pada HTML. Teks biasanya ditulis dari kiri ke kanan. Fungsi tag ini digunakan untuk membalikan teks dari kanan ke kiri pada HTML. Nilai atribut tag ini ada 2 (dua) yaitu ltr dan rtl. Atribut ltr (left to right) membuat teks dari kiri ke kanan, sedangkan atribut rtl(right to left) akan membuat teks dari kanan ke kiri.

Contoh :

<!DOCTYPE html>
<html>
  <body>

  <p>Ini teks arahnya dari kiri ke kanan</p>

  <bdo dir="rtl">Ini teks arahnya dari kanan ke KIRI</bdo>

  </body>
</html>

Output :

cara membalikan huruf pada HTML


6. Menggunakan tag <cite> untuk Judul Karya

Anda bisa menggunakan sitasi pada HTML menggunakan elemen tag <cite> untuk mendefinisikan kutipan. Selain itu bisa untuk menampilkan judul dari pekerjaan. Tag ini akan membuat menjadi tulisan italic pada browser.

Contoh :

<!DOCTYPE html>
<html>
  <body>

  <p><cite>PHP Language</cite> by Rasmus Lerdorf. Created in 1994.</p>

  </body>
</html>

Output :

cara menulis kutipan dan sitasi

Demikian tutorial pemrograman PHP mengenai cara menulis kutipan dan sitasi pada HTML. Selanjutnya kita akan membahas mengenai penulisan kode komputer pada HTML. Semoga tutorial ini bermanfaat dan terima kasih.