<head>

  1. › 
  2. <head>

Tag head

Tag head adalah tag atau elemen pertama didalam dokumen HTML.

<!DOCTYPE html>
<html>
<head>
<body>
</html>

Tag head beserta seluruh elemen didalamnya TIDAK ditampilkan pada halaman web.
Karena didalam tag head terdapat informasi penting sebuah dokumen yaitu metadata.

Metadata merupakan informasi yang hanya ditujukan untuk mesin pencarian maupun layanan web seperti media sosial.

Elemen dalam tag head

<title> <meta> <link> <style> <script> <base>
1. Tag title
<title>teks title<title>

Tag title : Merupakan judul utama sebuah halaman web.
Tag title hanya berisi teks.

Teks atau judul yang dimuat dalam tag title berfungsi untuk:

1. Menjadi nama bookmark pada saat alamat URL halaman disimpan.

2. Menjadi nama tab pada saat halaman dibuka di browser.

3. Nama halaman pada saat muncul di hasil pencarian.

2. Tag meta
<meta content='value' name='value' property='value'/>

Tag meta : berfungsi untuk mendefinisikan data-data penting dari dalam dokumen untuk dijadikan informasi petunjuk untuk browser, mesin pencarian, search console dan juga layanan web seperti tag title.
Bedanya, tag meta lebih spesifik (detail) karena mencakup inti dokumen dan dalam sebuah dokumen bisa terdepat beberapa tag meta.

tag meta yang umum digunakan adalah sebagai berikut :

  1. Menentukan jenis karakter yang digunakan pada dokumen

    2. <meta charset="UTF-8">

  2. Menentukan kata kunci yang sesuai dengan isi dokumen untuk keperluan pencarian.

    3. <meta name="keywords" content="HTML, CSS, JavaScript">

  3. Menentukan deskripsi atau penjelasan singkat tentang dokumen.

    <meta name="description" content="kata kunci">

  4. Menentukan nama penyusun atau penulis (admin)

  5. <meta name="author" content="Nama">

  6. Menetapkan pengaturan area pandang untuk tampilan diberbagai ukuran layar perangkat saat halaman diakses.

    7. <meta name="viewport" content="width=device-width, initial-scale=1.0">
3. Tag link
<link as='value' href='value' rel='value'/>

Tag link : ini kebalikan dari tag meta. Karena tag link ini berisi alamat tautan yang berfungsi menautkan dokumen dari halaman lain diluar untuk mendukung konten didalam halaman.

Tag link yang seringkali digunakan antara lain :
  1. 1. Menautkan style sheet (CSS)
    2. <link rel="stylesheet" href="https://url.sumber.css">
  2. 2. Menautkan style font.
    3. <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&display=swap" rel="stylesheet">
4. Tag style
<style>/*--CSS--*/</style>

Tag style : adalah elemen yang khusus untuk menyimpan pengaturan gaya / style halaman atau biasa disebut sebagai CSS (Susunan lembar gaya / Cascading Style Sheet).

5. Tag script
<script src='value'/>
<script><![CDATA[ ... ]]></script>

Tag script : berperan sebagai pemuat kode javascript yang gunanya adalah untuk menghidupkan fungsi-fungsi elemen yang ada di halaman

Berdasarkan sumbernya terdapat 2 macam script dimana keduanya menggunakan tag yang sama.

  1. Script external :
    Adalah kode script yang bersumber dari halaman lain atau berasal dari luar halaman.
    Tag script eksternal ini adalah tag kosong (tidak berisi konten) melainkan menggunakan atribut src yang berisi URL / alamat tautan sumber kode script.
    2. <script sync src='http://url.halaman.script'/>
  2. Script internal atau script lokal : merupakan tag script yang memuat kode javascript yang memang ditempatkan didalam dokumen. Beberapa tag script juga dapat ditempatkan dalam tag body.
    3. <script>
function myFunction() {
   var element = document.body;
   element.classList.toggle();
}</script>
6. Tag base
<base href='value' target='value'/>

Tag base : ini jarang sekali digunakan.

Komentar

Posting Komentar