. .

WEB DESIGN - HTML Dasar - Heading Tags

Posted by CHRISTIANTO D,WIBOWO | D3MI-2016 STMIK BUMI GORA On Minggu, Desember 25, 2016 No comments

WEB DESIGN - Basic HTML - Heading Tags, Sebelum lanjutkan pembelajaran ini, perlu diketahui bacalah dulu artikel pembelajaran sebelumnya dan kuasai pengenalan pengetahuan dasar di :
WEB PROGRAMMING
Terimakasih pada sumber pembelajaran ini :

Kita dapat memiliki heading besar yang bagus pada halaman web kita dengan cukup mudah. Hal ini dilakukan dengan tag H. Ukuran terbesar heading yang dapat dimiliki adalah H1. Jika kita ingin judul berukuran lebih kecil maka kita harus merubah nomor setelah H, H1 - H6 ukuran yang berbeda. Semua judul berada diantara dua tag <BODY>.....</BODY>.
Contohnya : 
<!DOCTYPE html>
<html>
<body>

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>

</body>
</html>
kita bisa lihat hasinya H1 menghasilkan font yang lebih besar dari H2 dan seterusnya. Heading tag tidak sensitif, sehingga kita dapat menulisnya seperti ini:
<H1> This is heading </ h1> Atau bahkan seperti ini: <H1> This is heading</ H1>, tetapi menggunakan huruf kapital semua membuat kode kita lebih mudah dibaca.

Apakah Heading Penting
Mesin pencari menggunakan heading untuk mengindeks struktur dan isi dari halaman web kita. Pengguna akan mencari (surfing) ke halaman kita dengan headingnya. Hal ini penting untuk menggunakan heading untuk menunjukkan struktur dokumen. <H1> heading harus digunakan untuk heading utama, diikuti oleh heading <h2> , sebagai heading descripstion  diikuti heading <h3>, dan setersunya, bila diperlukan, tetapi kita hanya di ijinkan memiliki heading sampai dengan H6 saja.

Gunakan heading HTML untuk heading saja. Jangan gunakan headiing untuk membuat teks BESAR/BIG atau tebal/bold, maksudnya pada penulisan heading cukup seperti ini  <H>This Is heading</H> tidak perlu menambah parameter tambahan untuk Big dan Bold <H><span style="font-family: Verdana, sans-serif;"><b>This is heading</b></span></H>, ini terlihat keren tapi SALAH !!!. Sebab mesin pencari (search engine) akan kesulitan mengindeks heading kita dan itu merugikan.

Aturan Horizontal HTML
Tag <hr> mendefinisikan jeda tematik di halaman HTML, dan yang paling sering ditampilkan sebagai aturan horisontal. Elemen Tag <hr> digunakan untuk memisahkan konten (atau menentukan perubahan) dalam sebuah halaman HTML:
Contohnya :
<!DOCTYPE html>
<html>
<body>

<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>

<h2>This is heading 2</h2>
<p>This is some other text.</p>
<hr>

<h2>This is heading 3</h2>
<p>This is some other text.</p>

</body>
</html>

HTML <head> Elemen
HTML <head> elemen tidak ada hubungannya dengan judul HTML. <Head> elemen merupakan wadah untuk metadata. metadata HTML adalah data tentang dokumen HTML, dan metadata sendiri tidak ditampilkan dalam jendela browser. <Head> elemen ditempatkan di antara <html> tag dan <body> tag:
<!DOCTYPE html>
<html>
<head>
  <title>My First HTML</title>
  <meta charset="UTF-8">
</head>
<body>

<p>Elemen head HTML berisi meta data.</p>
<p>Meta Data adalah data tentang dokumen HTML.</p>

</body>
</html>
Metadata biasanya menentukan judul dokumen, set karakter, gaya, link, script, dan informasi meta lainnya.
Sabar, pasti ingin cepat cepat bisa punya template website/blog hasil karya sendiri bukan ?  detail itu penting, kita disini benar-benar diajarkan secara rinci, dan diasumsikan kita tidak mengerti sedikitpun tentang WEB DESIGN, agar mudah memahaminya, kosongkan pikiran jangan meloncat ke bagian lain sehingga kita akhirnya bingung sendiri. Dikesempatan berikutnya kita akan belajar tentang Paragraph dan Break tags.

0 komentar:

Posting Komentar