Pengantar
HTML5 menambahkan banyak alat baru yang luar biasa ke toolbox developer web, termasuk yang berikut ini:
- JavaScript API baru yang lebih canggih
- SVG untuk grafik vektor
- Kanvas untuk 2D dan dengan grafis 3D WebGL
- CSS3 untuk sudut membulat, gradien, dll.
- Markup yang lebih ekspresif
Daftar ini tentu saja tidak komprehensif; platform web
telah berkembang pesat, dan kesenjangan antara browser lama dan browser modern semakin melebar setiap harinya.
Setiap browser desktop utama kini mendukung bagian penting HTML5 dalam versi terbaru, tetapi browser lama yang masih digunakan menimbulkan tantangan dalam mengadopsi fitur terbaru dan terbaik saat ini.
Google Chrome Frame dapat membantu Anda membuat halaman HTML5 canggih saat ini sekaligus memungkinkan orang yang menggunakan browser lama melihat konten Anda.
Apa yang dimaksud dengan Google Chrome Frame
Google Chrome Frame adalah plugin untuk Internet Explorer yang memungkinkan rendering kanvas browser lengkap menggunakan mesin rendering Google Chrome. Fitur ini mendukung semua fitur HTML5 yang Anda temukan di Chrome yang terintegrasi dengan lancar ke dalam pengalaman pengguna Internet Explorer. Chrome Frame tersedia untuk Internet Explorer 6, 7, 8, dan 9. Chrome Frame tentu lebih berguna saat mendukung browser lama seperti IE6 hingga IE8, tetapi jika Anda, misalnya, memerlukan WebGL untuk aplikasi, mewajibkan Chrome Frame untuk pengguna IE9 mungkin juga berguna.
Polyfill HTML5 memberikan cara lain untuk memperlancar transisi ke browser yang lebih baru. Sayangnya, browser tersebut tidak dapat mengemulasi setiap fitur, dan memperlambat halaman Anda di browser lama, yang sudah lebih lambat dari generasi baru.
Meskipun situs Anda tidak memerlukan fitur HTML5, penggunaan Chrome Frame tetap dapat memberikan pengalaman pengguna yang lebih baik. Untuk pengguna yang sudah menginstalnya, rendering umumnya lebih cepat dan mereka dapat mendapatkan akses ke fitur yang tidak didukung di browser lama. Anda tentunya 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 halaman dengan menambahkan tag meta HTML atau menggunakan header HTTP. Hal ini sangat penting. Artinya, tidak ada situs yang akan rusak jika pengguna menginstal Chrome Frame, karena situs tersebut memiliki kontrol penuh atas penggunaan plugin atau rendering default. Cuplikan kode berikut menunjukkan cara situs dapat memilih untuk dirender oleh Chrome Frame.
Opsi 1: HTTP-Header (Anda dapat menambahkannya ke konfigurasi server HTTP (misalnya, Apache):
X-UA-Compatible: chrome=1
Opsi 2: Tag meta (Cukup tempelkan ke bagian <head> HTML Anda)
<meta http-equiv="X-UA-Compatible" content="chrome=1">
Setelah Anda menambahkan salah satu dari keduanya ke situs, halaman akan dirender menggunakan Chrome Frame jika diinstal di komputer pengguna.
Permintaan untuk Google Chrome Frame
Anda dapat memutuskan untuk sepenuhnya menghentikan dukungan untuk browser lama karena berbagai alasan, termasuk hal berikut:
- Situs Anda memerlukan fitur modern seperti video HTML5, kanvas, WebGL, atau CSS3
- Waktu pengembangan yang dihabiskan di browser lama terlalu tinggi
- Mempercepat waktu pengembangan untuk fitur baru
Chrome Frame dapat memberikan strategi untuk terus memberi pengguna browser lama cara agar tetap dapat menggunakan situs Anda.
Chrome Frame mengirimkan bahwa Chrome Frame tersedia 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 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 untuk sniffing sisi server, Anda dapat menggunakan skrip CFInstall.js untuk mendeteksi Chrome Frame dan meminta pengguna menginstal plugin tanpa memulai ulang browser mereka. Penggunaan skrip ini 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>
Memberi perintah kepada diri sendiri
Anda juga dapat memutuskan untuk membuat halaman landing atau lapisan sendiri. Mengarahkan pengguna ke URL ini
http://www.google.com/chromeframe/
yang dapat dimasukkan ke dalam IFRAME.
Tambahkan parameter pengalihan untuk mengirim pengguna kembali ke situs Anda setelah penginstalan selesai:
http://www.google.com/chromeframe/?redirect=http://www.google.com/ Daripada membuka halaman landing Chrome Frame, Anda juga dapat mengarahkan pengguna langsung ke EULA 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 di tingkat pengguna, seperti dalam contoh berikut:
http://www.google.com/chromeframe/?user=true
Penginstalan perusahaan
Perusahaan dapat men-deploy Chrome Frame di seluruh perusahaan menggunakan penginstal MSI yang dapat didownload di sini: http://www.google.com/chromeframe/eula.html?msi=true.
Untuk mengetahui informasi selengkapnya tentang Chrome dan deployment perusahaan, lihat http://www.chromium.org/administrators.
Adopsi
Banyak situs besar seperti yahoo.com, wordpress.com, dan beberapa properti Google telah mengadopsi Google Chrome Frame. Selain memberi pengguna akses ke pengalaman web yang lebih modern untuk banyak situs, Chrome Frame juga memberikan peningkatan yang signifikan dalam 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 mengetahui informasi selengkapnya, lihat Panduan Memulai atau tonton video dari Google IO 2011 ini