Tutorial Blog, Tips Blogging, SEO, Belajar Syntax HTML, PHP, CSS, dan Aktifitas Coding Lainnya

Struktur Dasar Elemen HTML Head

Struktur Dasar Elemen HTML Head - Tag <head> alias bagian kepala halaman web, berisi beberapa elemen html. Mencakup elemen title / judul, script, style, meta information, dan masih banyak lagi. Tapi yang paling penting dari semua itu dan wajib dicantumkan pada elemen html <head> adalah beberapa elemen html berikut.

1. Elemen HTML title



Elemen <Title> berfungsi untuk mendefinisikan judul dokumen. Elemen <Title> ini mutlak diperlukan dalam semua dokumen HTML / XHTML. Elemen <Title> akan menampilkan judul halaman web di toolbar browser, memberikan judul untuk halaman ketika ditambahkan ke favorit, dan juga menampilkan judul untuk halaman dalam hasil mesin pencari.

Misal :


<title>Sinahu Coding</title>

2. Elemen HTML Style



Elemen <Style> pada <head> digunakan untuk menetapkan style seperti apa yang akan tampil pada browser dari suatu dokumen html.

Misal :


<style>
body {background-color:yellow;}
h1 {color:red;}
p {color:blue;}
</style>

3. Elemen HTML Link



Elemen <Link> menentukan hubungan suatu page dengan link eksternal. Elemen <Link> yang paling sering digunakan adalah untuk menghubungkan ke style sheet, digunakan untuk mengatur gaya web
page melalui style css yang tersimpan di external link tempat style css itu berada.

Misal :


<link rel="stylesheet" href="styleku.css">

4. Elemen HTML Meta



Elemen <meta> digunakan untuk menentukan deskripsi halaman web, kata kunci, penulis atau author, dan metadata lainnya. Ada beberapa meta data yang wajib dipasang pada halaman web, yaitu; meta description (Deskripsi halaman web), keywords (Kata kunci untuk mesin pencari), author (Pemilik web), dan charset (Character set yang digunakan).

Misal :


<meta name="description" content="Personal blog tentang belajar coding dan tutorial blog">
<meta name="keywords" content="tutorial, blog, web, html, css">
<meta name="author" content="Mr.F">
<meta charset="UTF-8">

Kalau semuanya itu ditempatkan secara sempurna maka akan tersusun seperti ini. Untuk mengetahui hasilnya silahkan copy paste kode di bawah ini ke dalam notepad. Kemudian beri nama berekstensi .html dan buka melalui web browser.


<!DOCTYPE html>
<html>

<title>Sinahu Coding</title>

<style>
body {background-color:black;}
h1 {color:red;}
p {color:blue;}
</style>

<link rel="stylesheet" href="styleku.css">

<meta name="description" content="Personal blog tentang belajar 

coding dan tutorial blog">
<meta name="keywords" content="tutorial, blog, web, html, css">
<meta name="author" content="Mr.F">
<meta charset="UTF-8">

<body>
<h1>Elemen-elemen HTML pada Head</h1>
<p>Ini contoh sederhana dokumen html beserta penempatan elemen-elemen html pada tag head. Semuanya itu harus diletakkan sebelum tag body.</p>
</body>

</html>


Demikian pembahasan tentang komponen elemen-elemen html head yang terdapat pada tag <head>. Semoga bermanfaat, khususnya untuk memahami struktur dasar template pada <head>.



1 Komentar untuk "Struktur Dasar Elemen HTML Head"

Kalau tidak ingin repot2 membuat files berekstensi .html tinggal ketik ajah kodenya di sini htmledit.squarefree.com :)

Back To Top