Thursday, 13 March 2014

Membuat Blog Valid CSS3

Unknown

Thursday, 13 March 2014

Beberapa hari ini saya di sibukan dengan pertanyaan membuat blog Valid CSS3 setelah saya memposting template saya Flow Anarchyta yang sudah saya validasi dengan tujuan agar Blog lebih SEO dan artikel lebih mudah di baca oleh mesin pencari.

Tahap Pertama

Backup terlebih dahulu template blog Anda.
Hapus CSS reset bawaan Blogger dengan cara :
Cari kode <b:skin><![CDATA[ kemudian Anda CUT semua CSS di bawahnya sampai kode ]]></b:skin> dan Anda Paste ke Notepad.. sehinggan kode menjadi

<b:skin><![CDATA[ ]]></b:skin>

Ganti kode tersebut dengan kode berikut ini :

&lt;style type=&quot;text/css&quot;&gt;
&lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>

selanjutnya tepat dibawah nya pasang kode ini :

<style type='text/css'>
..... Masukan Kode CSS yang tadi Anda Cut di Notepad ....
</style>

Lakukan preview terlebih dahulu jika ternyata tidak ada Error

Pada tahap pertama ini sudah banyak kode Error yang teratasi yaitu pada CSS Reset Stylesheet Blogger.

Tahap Kedua

Hapus beberapa property pada CSS yang diterapkan pada berbagai browser karena dengan adanya CSS3 ini kode tersebut sudah tidak di perlukan lagi. Sebagai contoh

-moz-border-radius:5px; 
-khtml-border-radius:5px; 
-o-border-radius:5px; 
-webkit-border-radius:5px; 
-ms-border-radius:5px;
border-radius:5px;

Karena adanya CSS3 ini maka hapus semua kode CSS yang berawalan dengan kode di bawah ini

-moz-border-radius:5px; 
-khtml- 
-o-
-webkit- 
-ms-

Hapus juga kode dengan awalan

DXImageTransform

Tahap Ketiga

Perhatikan beberapa perintah Validator seperti ini

Family names containing whitespace should be quoted. If quoting is omitted, any whitespace characters before and after the name are ignored and any sequence of whitespace characters inside the name is converted to a single space.

itu artinya apabila ada huruf yang mempunyai spaci tambahkann tanda kutip (' ').
Sebagai contoh

font-family: 'Oswald', Tahoma, Arial, sans-serif

Sebagai Backup apabila font pertama tidak tereksekusi yaitu Oswald yang di ganti menjadi Tahoma..

Tahap Terakhir

Setelah semua di praktekan ke Blog Anda jangan lupa untuk mengecek apakah Blog Anda sudah Valid CSS3 atau belum di http://jigsaw.w3.org/css-validator/ untuk beberapa kasus sebenarnya masih banyak perintah lain, silahkan Anda tanyakan apabila belum paham 100%, untuk para master Blogspot yang udah 100% paham silahkan kasih masukan jika dalam postingan saya masih ada yang kurang atau salah eja...
Terima kasih...