FacebookTwitterYoutubeGoogle+
Diberdayakan oleh Blogger.

Jumat, 04 Juli 2014

Tagged under:

Penggunaan Head pada HTML

Tag head
Dalam Tag <head> ini kita memegang fungsi yang penting karena Tag <head> ini mencakup CSS yang nantinya akan ditampilkan di halaman website/blog kita.
Pada dasarnya Tag <head> hanya berisikan

<head>
...Isi kode ( HTML dan CSS ) ...
</head>

Namun untuk mendapatkan hal yang lebih Optimal dan tentunya untuk menambah SEO Blog atau Website kita. Berikut adalah Tambahan yang diperlukan untuk:

 Website :


<head>
<meta charset="utf-8" />
<meta description="Deskripsi blog" />
<meta keywords="Keywords blog" />
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
<meta name="geo.country" content="ID"/>
<meta name="robots" content="INDEX, FOLLOW"/>
<meta name="rating" content="general"/>
<link href="https://plus.google.com/116311034225885620660/posts" rel="publisher"/>
<link href="https://plus.google.com/116311034225885620660/about" rel="author"/>
<link href="https://www.facebook.com/profile.php?id=100002050774659" rel="copyright"/>
<title>JUDUL WEBSITE/BLOG</title>
<style type="text/css/"> 
...Kode CSS...
</style> 
</head>
Jika ingin menambah font dari Google sebagai Stylesheet/Font default Blog/Website anda bisa ditambahkan diatas tag <title> ( Ini optional, tapi untuk memudahkan taruh diatas tag <title> )

Contoh Link :
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,700%7CRopa+Sans%7COswald' rel='stylesheet' type='text/css'/>


Jadi kode-nya menjadi :

<head>
<meta charset="utf-8" />
<meta description="Deskripsi blog" />
<meta keywords="Keywords blog" />
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
<meta name="geo.country" content="ID"/>
<meta name="robots" content="INDEX, FOLLOW"/>
<meta name="rating" content="general"/>
<link href="https://plus.google.com/116311034225885620660/posts" rel="publisher"/>
<link href="https://plus.google.com/116311034225885620660/about" rel="author"/>
<link href="https://www.facebook.com/profile.php?id=100002050774659" rel="copyright"/>
<link 
href='http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,700%7CRopa+Sans%7COswald'
 rel='stylesheet' type='text/css'/> 
<title>JUDUL WEBSITE/BLOG</title>
<style type="text/css/">
...Kode CSS...
</style> 
</head>

Dengan Penjelasan :
meta description : Berisi deskripsi blog atau website anda
meta keywords : Berisi keywords blog atau website anda
rel="publisher", rel="author", rel="copyright" : Berisi link Socmed admin

 Blog :

 <head>
<meta charset='utf-8'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'/>
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic%7CArvo:400,700,400italic,700italic' rel='stylesheet' type='text/css'/>
<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
    <title><data:blog.pageTitle/></title>
<b:else/>
    <b:if cond='data:blog.pageType == &quot;error_page&quot;'>
        <title>404 Page Not Found - <data:blog.title/></title>
    <b:else/>
        <title><data:blog.pageName/> - <data:blog.title/></title>
    </b:if>
</b:if>
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='http://gplus.to/daffaditya11' rel='author'/>
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='blogger' name='generator'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:else/>
<meta expr:content='data:blog.pageName + &quot; - &quot; + data:blog.title' name='description'/>
</b:if>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='Deskripsi' name='description'/>
<meta content='keywords' name='keywords'/>
</b:if>
<!-- Facebook Open Graph -->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <meta content='100002050774659' property='fb:admins'/>
      <meta content='100002050774659' property='fb:profile_id'/>      
    <b:if cond='data:blog.url'>
      <meta expr:content='data:blog.url' property='og:url'/>
    </b:if>
      <meta expr:content='data:blog.title' property='og:site_name'/>
    <b:if cond='data:blog.pageName'>
      <meta expr:content='data:blog.pageName' property='og:title'/>
    </b:if>
      <meta content='website' property='og:type'/>
    <b:if cond='data:blog.postImageThumbnailUrl'>
      <meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
    <b:else/>
      <meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ-0HiJ1Y9ugsmCJpVkPVXCRZigSoZ8bdLHeVf27HlaT8MuOYDDqC1kOzi5VTPj01t2nIdsSuSEGZVf0CMcW733M54-eDX9GjUln07eAuKo4yCLUToTu3heaCPfBk2My3zSjhrueEDZZ8/s120-c/default.png' property='og:image'/>
    </b:if>
    </b:if>
</head>

Script diatas bisa diedit sesuka hati anda ^_^
Script diatas saya menggunakan Oswald sebagai Font Default-nya

Semoga bisa dipahami, Wassalamu'alaikum WR.WB.

- Jangan masukkan Link Aktif
- Jangan Spam ( I watching you ;) )
- Jangan ejek mengejek
- Jangan pulang sebelum berkomentar :'(

notifikasi
close