Wstęp
HTML5 udostępnia wiele nowych, niesamowitych narzędzi do tworzenia stron internetowych, w tym:
- Nowe, wydajniejsze interfejsy API JavaScript
- SVG dla grafiki wektorowej
- Canvas dla formatu 2D i grafika 3D WebGL
- CSS3 – zaokrąglone narożniki, gradienty itp.
- Bardziej ekspresyjne znaczniki
Ta lista oczywiście nie jest wyczerpująca, ponieważ platforma internetowa posuwa się naprzód, a różnice między starymi i nowoczesnymi przeglądarkami poszerzają się każdego dnia.
Każda popularna przeglądarka na komputery obsługuje obecnie znaczną część kodu HTML5 w najnowszej wersji, ale stare przeglądarki sprawiają, że korzystanie z najnowszych i najlepszych funkcji jest obecnie wyzwaniem.
Google Chrome Frame pozwoli Ci tworzyć najnowocześniejsze strony HTML5 już dziś, a jednocześnie umożliwi przeglądanie treści użytkownikom starszych przeglądarek.
Co to jest Google Chrome Frame
Google Chrome Frame to wtyczka do Internet Explorera, która umożliwia renderowanie całej kanwy przeglądarki za pomocą mechanizmu renderowania Google Chrome. Obsługuje wszystkie funkcje HTML5 dostępne w Chrome i jest płynnie zintegrowane z przeglądarką Internet Explorer. Chrome Frame jest dostępna w Internet Explorerze 6, 7, 8 i 9. Wtyczka Chrome Frame jest z pewnością przydatniejsza przy obsłudze starszych przeglądarek, takich jak IE6-to-IE8, ale jeśli np. wymagasz w aplikacji zastosowania WebGL, to osoby korzystające z IE9 również mogą używać tej wtyczki.
Kody polyfill HTML5 ułatwiają przejście na nowsze przeglądarki w inny sposób. Niestety nie mogą one emulować wszystkich funkcji i spowalniają działanie strony w starszych przeglądarkach, które są już wolniejsze od nowej generacji.
Nawet jeśli witryna nie wymaga funkcji HTML5, używanie Chrome Frame może zapewnić użytkownikom lepsze wrażenia. W przypadku użytkowników, którzy już ją zainstalowali, renderowanie jest szybsze i zyska dostęp do funkcji, które nie są obsługiwane w starszych przeglądarkach. Oczywiście nadal możesz zdecydować się na obsługę starych przeglądarek na komputerach użytkowników, którzy nie mają wtyczki Chrome Frame.
Włączanie opcji
Aby włączyć wyświetlanie strony w Chrome Frame, dodaj metatag HTML lub użyj nagłówka HTTP. To bardzo ważne. Oznacza to, że żadna strona nie będzie działać, jeśli użytkownik ma zainstalowaną wtyczkę Chrome Frame, bo ma ona pełną kontrolę nad korzystaniem z wtyczki i domyślnym renderowaniem. Poniższe fragmenty kodu pokazują, jak można włączyć renderowanie witryny przez Chrome Frame.
Opcja 1.Nagłówek HTTP (możesz go dodać do konfiguracji serwera HTTP (np. Apache)):
X-UA-Compatible: chrome=1
Opcja 2: metatag (wklej go w sekcji HTML <head>)
<meta http-equiv="X-UA-Compatible" content="chrome=1">
Po dodaniu do witryny którejś z tych opcji strony będą renderowane za pomocą Chrome Frame, jeśli jest ona zainstalowana na komputerze użytkownika.
Monit o Google Chrome Frame
Możesz zdecydować się na całkowite wycofanie obsługi starych przeglądarek z wielu powodów, takich jak:
- Twoja witryna wymaga nowoczesnych funkcji, takich jak wideo HTML5, kanwy, WebGL czy CSS3
- Czas programowania w starych przeglądarkach jest zbyt długi
- Przyspieszenie tworzenia nowych funkcji
Chrome Frame może być strategią zachęcania użytkowników starszych przeglądarek do korzystania z witryny.
Wtyczka Chrome Frame przesyła informację o dostępności, rozszerzając nagłówek User-Agent hosta o ciąg „chromeframe”. Więcej informacji znajdziesz w artykule Klient użytkownika Chrome Frame.
Aby wyszukać ten token i określić, czy w przypadku strony można użyć wtyczki Chrome Frame, użyj wykrywania po stronie serwera. Jeśli wtyczka Chrome Frame jest zainstalowana, możesz wstawić wymagany metatag. Jeśli nie, możesz przekierować użytkowników na stronę wyjaśniającą, jak zainstalować Chrome Frame. Zamiast przechwytywania po stronie serwera możesz użyć skryptu CFInstall.js, by wykrywać Chrome Frame i prosić użytkowników o zainstalowanie wtyczki bez ponownego uruchamiania przeglądarki. Korzystanie ze skryptu jest proste. Wystarczy, że dodasz do strony tagi skryptu i opcjonalne style, jak w tym przykładzie:
<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>
Zadaj sobie pytanie
Możesz też samodzielnie utworzyć stronę docelową lub warstwy. Odsyłaj użytkowników do tego adresu URL
http://www.google.com/chromeframe/
który można umieścić w ramce IFRAME.
Dołącz parametr przekierowania, aby odsyłać użytkowników z powrotem do Twojej witryny po zakończeniu instalacji:
http://www.google.com/chromeframe/?redirect=http://www.google.com/ Zamiast odwiedzać stronę docelową Chrome Frame, możesz odesłać użytkowników bezpośrednio do licencji użytkownika, co pozwala zapisać jeden krok procesu instalacji. http://www.google.com/chromeframe/eula.html
Nie są potrzebne uprawnienia administratora
Użytkownicy mogą instalować Chrome Frame bez uprawnień administratora na swoich komputerach.
Dołącz parametr user=true, aby umożliwić instalację Chrome Frame na poziomie użytkownika, jak poniżej:
http://www.google.com/chromeframe/?user=true
Instalacja dla firm
Firmy mogą wdrożyć Chrome Frame w całej firmie, korzystając z instalatora MSI, który można pobrać tutaj: http://www.google.com/chromeframe/eula.html?msi=true.
Więcej informacji o wdrożeniach Chrome i w firmach znajdziesz na http://www.chromium.org/administrators.
Rozpowszechnienie
Obsługę Google Chrome Frame zastosowano na wielu popularnych stronach, takich jak yahoo.com, wordpress.com i kilka usług Google. Chrome Frame nie tylko zapewnia użytkownikom dostęp do bardziej nowoczesnych funkcji internetowych, ale też znacznie skróci czas wczytywania. Aby sprawdzić, czy Chrome Frame przyspiesza renderowanie stron w Twojej witrynie, wejdź na webpagetest.org i wybierz Chrome Frame jako przeglądarkę.
Więcej informacji
Aby uzyskać więcej informacji, zapoznaj się z wprowadzeniem lub obejrzyj ten film z Google IO 2011.