Pengantar
HTML5 menambahkan banyak alat luar biasa baru ke kotak alat pengembang web, termasuk berikut ini:
- JavaScript API baru yang lebih andal
- SVG untuk grafik vektor
- Canvas untuk 2D dan grafis 3D WebGL
- CSS3 untuk sudut membulat, gradien, dll.
- Markup yang lebih ekspresif
Daftar ini tentu saja tidak komprehensif; platform web telah bergerak maju secara besar-besaran, dan kesenjangan antara browser lama dan browser modern semakin melebar setiap hari.
Setiap browser desktop utama kini mendukung sebagian besar HTML5 dalam versi terbaru, tetapi browser lama tetap menjadi tantangan dalam mengadopsi fitur terbaru dan terhebat saat ini.
Google Chrome Frame dapat membantu Anda membuat halaman HTML5 yang canggih saat ini sambil tetap memungkinkan orang yang menggunakan browser lama untuk melihat konten Anda.
Apa itu Google Chrome Frame
Google Chrome Frame adalah plugin untuk Internet Explorer yang memungkinkan rendering kanvas browser lengkap menggunakan mesin rendering Google Chrome. Alat ini mendukung semua fitur HTML5 yang Anda temukan di Chrome terintegrasi dengan lancar dengan pengalaman pengguna Internet Explorer. Chrome Frame tersedia untuk Internet Explorer 6, 7, 8, dan 9. Chrome Frame tentunya lebih berguna saat mendukung browser lama seperti IE6-ke-IE8, tetapi jika Anda, misalnya, memerlukan WebGL untuk aplikasi Anda, memerlukan Chrome Frame untuk pengguna IE9 mungkin juga berguna.
Polyfill HTML5 menyediakan cara lain untuk memperlancar transisi ke browser yang lebih baru. Sayangnya, fungsi ini tidak dapat mengemulasi setiap fitur dan memperlambat halaman Anda di browser lama, yang sudah lebih lambat dibandingkan generasi baru.
Meskipun situs Anda tidak memerlukan fitur HTML5, penggunaan Chrome Frame tetap dapat memberikan pengalaman pengguna yang lebih baik. Untuk pengguna yang telah menginstalnya, rendering umumnya lebih cepat dan mereka bisa mendapatkan akses ke fitur yang tidak didukung di browser lama. Tentu saja, Anda masih dapat memutuskan untuk mendukung browser lama bagi pengguna yang tidak memiliki Chrome Frame di komputer mereka.
Ikut serta
Anda dapat mengaktifkan Chrome Frame untuk merender laman dengan menambahkan tag meta HTML atau menggunakan header HTTP. Ini sangat penting. Artinya, tidak ada situs yang akan rusak jika pengguna menginstal Chrome Frame, karena situs tersebut memegang kontrol penuh untuk menggunakan plugin atau rendering default. Cuplikan kode berikut menunjukkan bagaimana sebuah situs dapat memilih untuk dirender oleh Chrome Frame.
Opsi 1: HTTP-Header (Anda dapat menambahkan ini ke konfigurasi server HTTP (mis. Apache):
X-UA-Compatible: chrome=1
Opsi 2: Tag meta (Cukup tempel ini ke bagian <head> HTML Anda)
<meta http-equiv="X-UA-Compatible" content="chrome=1">
Setelah Anda menambahkan salah satunya ke situs, halaman dirender menggunakan Chrome Frame jika diinstal di komputer pengguna.
Meminta Google Chrome Frame
Anda dapat memutuskan untuk menghentikan sepenuhnya dukungan bagi browser lama karena berbagai alasan, termasuk:
- Situs Anda memerlukan fitur modern seperti video HTML5, kanvas, WebGL, atau CSS3
- Waktu pengembangan yang digunakan pada browser lama terlalu tinggi
- Mempercepat waktu pengembangan untuk fitur baru
Chrome Frame mungkin memberikan strategi untuk terus memberi pengguna browser lama cara untuk tetap menggunakan situs Anda.
Chrome Frame mengirimkan informasi tersebut dengan memperluas header Agen Pengguna host dengan string "chromeframe". Untuk informasi selengkapnya, lihat Agen Pengguna Chrome Frame.
Gunakan deteksi sisi server untuk mencari token ini dan menentukan apakah Chrome Frame dapat digunakan untuk suatu halaman. Jika Chrome Frame ada, Anda dapat menyisipkan tag meta yang diperlukan; jika tidak, Anda dapat mengalihkan pengguna ke halaman yang menjelaskan cara menginstal Chrome Frame. Sebagai alternatif sniffing sisi server, Anda dapat menggunakan skrip CFInstall.js untuk mendeteksi Chrome Frame dan meminta pengguna menginstal plugin tanpa memulai ulang browser. Penggunaan skrip sangat mudah. Cukup tambahkan tag skrip dan gaya opsional ke halaman Anda seperti dalam contoh berikut:
<html>
<body>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
<style>
/*
CSS rules to use for styling the overlay:
.chromeFrameOverlayContent
.chromeFrameOverlayContent iframe
.chromeFrameOverlayCloseBar
.chromeFrameOverlayUnderlay
*/
</style>
<script>
// You may want to place these lines inside an onload handler
CFInstall.check({
mode: "overlay",
destination: "http://www.waikiki.com"
});
</script>
</body>
</html>
Tanyakan pada diri Anda
Anda juga dapat memutuskan untuk membuat halaman landing atau membuat lapisan sendiri. Kirim pengguna ke URL ini
http://www.google.com/chromeframe/
yang dapat dimasukkan ke dalam IFRAME.
Tambahkan parameter pengalihan untuk mengarahkan pengguna kembali ke situs Anda setelah penginstalan selesai:
http://www.google.com/chromeframe/?redirect=http://www.google.com/ Sebagai ganti membuka halaman landing Chrome Frame, Anda juga dapat mengarahkan pengguna langsung ke PLPA sehingga menghemat satu langkah dalam proses penginstalan. http://www.google.com/chromeframe/eula.html
Tidak memerlukan hak admin
Pengguna dapat menginstal Chrome Frame tanpa memiliki hak istimewa administratif di komputer mereka.
Tambahkan parameter user=true untuk mengaktifkan penginstalan Chrome Frame tingkat pengguna, seperti berikut:
http://www.google.com/chromeframe/?user=true
Penginstalan untuk perusahaan
Perusahaan dapat menerapkan Chrome Frame di seluruh perusahaan menggunakan pemasang MSI yang dapat diunduh di sini: http://www.google.com/chromeframe/eula.html?msi=true.
Untuk informasi selengkapnya tentang deployment Chrome dan perusahaan, lihat http://www.chromium.org/administrators.
Adopsi
Banyak situs besar seperti yahoo.com, wordpress.com, dan beberapa properti Google telah menggunakan Google Chrome Frame. Selain memberi pengguna akses ke pengalaman web yang lebih modern untuk banyak situs, Chrome Frame juga menghadirkan peningkatan yang signifikan pada waktu pemuatan awal. Anda dapat memeriksa apakah Chrome Frame membantu situs Anda mendapatkan rendering yang lebih cepat dengan membuka webpagetest.org dan memilih Chrome Frame sebagai browser.
Info selengkapnya
Untuk Informasi selengkapnya, lihat Panduan Memulai atau tonton video ini dari Google IO 2011