Meta tag merupakan makanan wajib bagi pakar-pakar SEO. Namun sebenarnya banyak sisi lain dari meta tag yang bisa kita gunakan untuk animasi. Apakah itu? Sabar, kita akan oprek-oprek kegunaannya untuk membuat animasi untuk web kita.
Bisakah? Tentu saja bisa. Kita mulai yuk…
Sediakan dua buah file html yang bernama, 1.html dan 2.html
Ketikkan kode berikut ini pada file 1.html
<html>
<head>
<meta http-equiv=”Page-Enter” content=”blendTrans(Duration=1.0)”>
<title>Sample</title>
</head>
<body bgcolor=red><A HREF=”2.html”><B>go to 2</B></A></body>
</html>
Lihat pada kode diatas, pada tag meta kita menggunakan property http-equiv yang berisi value Page-Enter yang berarti aksi ketika halaman web kita dibuka. Pada property Content kita lihat ada value yang berisi revealTrans(Duration=2.0,Transition=0) dimana nilai ini akan membuat animasi web kita akan muncul dengan efek blend yaitu web muncul perlahan-lahan dari transparansi 0% sampai transparansi 100%.
Ketikkan kode berikut pada file 2.html
<html>
<head>
<meta http-equiv=”Page-Enter” content=”revealTrans(Duration=2.0,Transition=0)”>
<title>Sample</title>
</head>
<body bgcolor=blue><A HREF=”1.html”><B>go to 1</B></A></body>
</html>
Dari kode diatas, halaman web 2.html akan muncul dari sebuah kotak besar yang mengecil sampai menghilang. Kurang jelas yah? Lebih baik dipraktekkan langsung biar mudeng..
Sebagai referensi, value dari property http-equiv yang bisa kita gunakan:
http-equiv=”Site-Enter”
http-equiv=”Site-Exit”
http-equiv=”Page-Exit”
http-equiv=”Page-Enter”
Value dari property Transition yang bisa kita gunakan antara lain:
0 = Box in.
1 = Box out.
2 = Circle in.
3 = Circle out.
4 = Wipe up.
5 = Wipe down.
6 = Wipe right.
7 = Wipe left.
8 = Vertical blinds.
9 = Horizontal blinds.
10 = Checkerboard across.
11 = Checkerboard down.
12 = Random dissolve.
13 = Split vertical in.
14 = Split vertical out.
15 = Split horizontal in.
16 = Split horizontal out.
17 = Strips left down.
18 = Strips left up.
19 = Strips right down.
20 = Strips right up.
21 = Random bars horizontal.
22 = Random bars vertical.
23 = Random.
Sedangkan value dari property dari Duration adalah durasi berapa lama animasi tersebut akan muncul.
Kita akan membahas SEO-SEOan yang lebih serius lain kali. So, keep in watch!! Oh ya, skript ini hanya berjalan di IE, saya sudah mencobanya di Firefox dan Opera. Namun di Firefox, dan Opera, skrip ini tidak jalan. Mengapa? Karena beberapa browser mengabaikan property http-equiv ini. Mungkin Firefox dan Opera termasuk didalamnya. Jadi keep in touch lah dengan IE. hehehe…















pertamax…
ntar aja bacanya…
postingan yang berat lagi kan deq??
soal IE Bang… setau saya beberapa themes WP malah lebih optimal fi firefox…
???
tapi bener kan Bang?
ada gak yang cocok sama firefox.
soalnya kalau saya ngajakin temen yang saya kenal untuk maen ke blog pasti saya rekomendasiin firefox biar lebih optimal tampilan themesnya
hehe… apa sih aku ini ?
dah aku bales tuh commennya di http://oktasihotang.com/2008/08/20/gado-gadocup-cup-ajinotoyo
wah, asik nie ada tutorial ttg meta tag lagi, setelah kemarin baca2 postingannnya om cosa.
weiss.. Nice!
Gands, saya mo belajar juga ah nyobain
*baca-baca lagi dari atas*
waah..
blog ku terlihat kacau sama ie
@My:
enggak kok mbak.. gak terlalu susah kok..
@BLogicThink [dot] com:
karena firefox lebih banyak mensupport elemen css. Dan biasanya layout themes wordpress dibangun oleh css..
@okta sihotang:
*ngacir ke tkp*
@Enggar:
ntar kita bahas yang lebih dalam lagi bro..
@yu2n:
makasih mbak..
@masarif:
itu karena IEnya yang kurang support elemen CSS. Buat aja rekomendasi penampilan webnya dihalaman depan mas. Contohnya “Best viewed in firefox : 1024 x 768″
ga ngerti SEO
mantap gannddsssss
wah, detail juga jelasinnya ya
waduh..karena udh nempel banget ama Firefox, sekarang saatnya panjenengan posting yg asyik2 utk firefox aja mas.. heheheh.. ntar langsung aku praktekin dech… swear.. hmmmmm…
ooooo gitu yahhh??
Saya pake FireFox…
IE…maksudnya Explore, ya ?
hhhmmmm…..
i see… jadi sebenernya kalo di themes kita tidak banyak elemen CSS akan optimal di IE. dan tips meta tag ini pun jadi lebih berguna…
Ok, selangkah demi selangkah but sure…
hehe…. jangan bosen memberikan pelajaran pada saya yang awam ya Bang
keep trying nih, hehe…
blajar terus…., ayo2 pada belajar meta tag dan seo…
harus bersambung nih tulisannya
aku hrs mbaca dulu berulang2 nih pak guru sebelum berani kasih tanggapan
@chic:
hehehe.. saya juga gak ngerti neh ttg seo-seokan mbak… Woiii… siapa yang mosting seo di blogku? *dilempar sendal sama mbak chic*
@bocahiseng:
iyaaaaaa bro!!!!!!
@Bayu Aditya:
padahal aku bingung cara ngejelasinnya tadi. wkwkwkw.. jadi gak nyambung komenku yang ini dengan komenku sama mbak chic..
@retno damar:
emang tidak ada standardisasi di browser.. *ngomong keselek*
@bonar:
gimana dengan linux kita itu jom?
@BLogicThink [dot] com:
bukan seperti itu bang. ada beberapa elemen css yang tidak disupport oleh sebuah browser. nah, kebanyakan sih (saat ini IE 6) tidak mensupport beberapa elemen css sehingga tampilannya buruk. Jadi ngak ada hubungannya ke meta tag mas…
@Elys Welt:
gapapa kok mbak.. saya hatur nuwun.. eh hatur nuwun apa artinya yah? hehehehe…
@syelviapoe3:
yup. Ie = Internet Explorer…
sip lah script nya
wekekek….
biar sekalinya jago… kaya ayam jago…
…
kalo dalam bahasa pemrograman ak belum tahu Bang , ckikiks….
hos…hos….hos…(*kecapean…*)
@elys : ak mah kasih tanggapan aja dulu biar banyak salahnya
@Bang TheGands : hatur nuwun saya juga gak tau,
taunya hatur nuhun atau matur nuwun artinya terima kasih…
sama seperti arigatogozaimasita dan danke dalam bahasa jepang dan jerman…. wew, sotau ak
duh SEO lagi SEO lagi…
gak mudeng akuuuuuuuu…!!
aarggggghhh…
*jambak2 rambut frustasi
wah…hrus pk IE yak ?!?!?
nggak asyik neh…..
kan skrng dh firefox 3…. yg lbh dinamis
@mastal:
makasih mas..
@blogict:
gyahahahaha… maaf deh.. soalnya saya bukan oprang jawa. hehehehe…
@tcpmi:
kita ngebahasnya ceplas-ceplos aja mbak. hehehe..
@afwan auliyar:
FF3? Gak gue banget!! Yang gue banget itu Opera!!!!!!
wew saya nyaris gak pernah sentuh ie lagi.. piye ya.. hehe
hwaduhhh ga ada cara yg lebih gampang broth ?
wah keren posting kamu….sangat web design banget hehehehe
Btw SEO ntu apa? KeSlEO y
? ah gak asik pake IE, gak cool
browser paling keren y firefox duns (qalo gak salah artinya rubah api y? atau api rubah? keren
)
wah bisa kayak gitu yah??
sayang ya cuman bisa dibaca IE aja…
thx buat infonya…
btw, jgn sedih nggak bisa mengibarkan merah putih di rumah sendiri
[...] biasanya saya berikan. Karena tiga buah postingan telah saya borong untuk diposting semalam, yaitu Pengenalan Meta Tag untuk animasi, Lindows si cantik nan manis, dan wordpress syntax highlighting buat wordpress.com. Jadi hari ini [...]
@ika:
hehehehe… pasar IE sepertinya semakin terpuruk..
@panda:
waduh… gak ada broth.. ini cara yang mudah dan gak makan banyak resource…
@uwiuw:
hehehe.. jadi malu…
@didta:
saya penggemar Opera. Pake Firefox gak ciamik. boros memori..
@Panda™:
oke deh mas.. saya tidak sedih lagi kok..
si bro banyak banget ni tutorialnya yang bagus2. sayang aku rada lemot, jadi mesti pelan2 biar ngerti.
btw trims
@yudi:
trims kembali mas..;)
belum begitu ngeh ttg ini
makasih bro
Contoh animasinya mana Mas?
salam kenal dari saya