Pengertian, Penjelasan, dan Isi Head di HTML ~ Nyintak

Head atau biasa dikenal <head> adalah salah satu elemen penting yang dimiliki oleh sebuah file html selain body. Di head lah tempat para programmer biasanya memasukkan elemen script, link, style, title, meta, dll. Tidak seperti body, ketika anda memasukkan teks di body, maka ketika halaman dijalankan, teks yang anda masukkan di dalam body tadi akan ditampilkan di UI(User Interface). Head tidak menggunakan aturan seperti itu, jadi apapun yang anda masukkan ke dalam head tidak akan ditampilkan di UI(User Interface) kecuali anda memasukkan teks menggunakan proses javascript atau php. Dan berikut ini adalah daftar-daftar yang akan kita pelajari kali ini mengenai head :

Title
Style
Link
Meta
Script
Base

Akan dibahas satu per satu.

Title

Style

<!DOCTYPE html>
<html>
    <head>
        <style>
            .red{
                color:red;
            }
            .green{
                color:green;
            }
            .blue{
                color:blue;
            }
        </style>
    </head>
    <body>
        <p class="red">Red Text Paragraph</p>
        <p class="green">Green Text Paragraph</p>
        <p class="blue">Blue Text Paragraph</p>
    </body>
</html>

Link

<!DOCTYPE html>
<html>
    <head>
        <link href="https://googledrive.com/host/0B54KnGBYKdBAa3lRTWtSZDYwRkE" rel="stylesheet"></link>
    </head>
    <body>
        <p class="red">Red Text Paragraph</p>
        <p class="green">Green Text Paragraph</p>
        <p class="blue">Blue Text Paragraph</p>
    </body>
</html>

Meta

Meta Author, digunakan untuk mengenal penulis, biasanya diisi nama penulis, email penulis

Meta Content Language, digunakan untuk mengetahui bahasa yang digunakan oleh website. Robot mesin pencari menggunakan meta ini untuk mengkategorikan halaman web dengan bahasa yang digunakan.

Meta Description, ini adalah meta yang bisa dibilang paling penting, meta ini digunakan untuk memberikan deskripsi dari halaman web, jumlah karakter yang disarankan tidak lebih dari 150 karakter.

Meta Keywords, meta ini digunakan oleh mesin pencari. Oleh karena itu,memberikan meta ini ke halaman website dapat sangat menguntungkan.

Meta Title, meta ini berisi sama dengan tag <title> pada dokumen HTML.

Meta Robot, tujuan penggunaan meta ini adalah untuk menentukan halaman web yang mana saja boleh atau tidak boleh di-index oleh crawler. Meta ini sangat penting sekali terutama jika sesuatu website menggunakan frame sebagai navigasinya. Sudah tentu kita tidak ingin menampilkan menu-menu dalam frame untuk dibaca oleh search engine

Format dasar meta robot

Misal, jika ingin web crawler membaca halaman utama beserta semua tautan yang ada, maka tambahkan meta berikut

Misal, jika tidak ingin web crawler melakukan index maupun penelusuran tautan yang ada pada web, maka tambahkan meta berikut

Script

<!DOCTYPE html>
<html>
    <head>
 <script>
     function insertText(){
         document.getElementById('paragraph').innerHTML = "JavaScript Executed"
     }
 </script>
    </head>
    <body onload="insertText()">
     <p id="paragraph"></p>
    </body>
</html>

Base

<!DOCTYPE html>
<html>
    <head>
 <base href="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/" />
 <script src="jquery.min.js"></script>
 <script>
     $(document).ready(function(){
      $('#paragraph').text("Base url is https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/");
  });
 </script>
    </head>
    <body>
     <p id="paragraph"></p>
    </body>
</html>

<script href="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js>"

<script href="jquery.min.js">.

https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/

atribut href elemen <base>

Nyintak

Nyekrip dari tutorial lengkap dengan penjelasannya

Sunday, 5 June 2016

Pengertian, Penjelasan, dan Isi Head di HTML

Title

Style

Link

Meta

Script

Base

0 comments:

Post a Comment

Kunjungi Juga

Blog Archive

Labels