/chrome/?hl=fi

 

Verkkokehittäjien UKK

Johdanto

  1. Mitä Google Chrome pitää sisällään?
  2. Mistä saan tietoa muista selaimista?

User agent

  1. Mikä on Google Chromen user agent -merkkijono?

Kielen koodaus

  1. Merkit eivät näy oikein Google Chromessa
  2. Merkistöjärjestelmän ilmoittaminen JavaScriptin avulla (document.write) ei toimi
  3. Google Chromessa näkyy '%B1%C1%C3%E5' kahden kiinalaisen kirjoitusmerkin sijasta

Komentosarjat ja verkkosovellukset

  1. ActiveX-ohjausobjekti ei lataudu
  2. JavaScript ei toimi oikein

Renderointi ja selaimen käyttäytyminen

  1. Sivustoni sisältö näkyy Google Chromessa eri tavalla kuin Internet Explorerissa
  2. Kuinka voin testata sivustoani Google Chromessa?
  3. Ulkopuolisen tyylitaulukon kirjasinmääritykset eivät tule voimaan
  4. Sivustoni ponnahdusikkunat eivät näy Google Chromessa
  5. SSL-suojatussa sivustossani näkyy lukon sijasta huutomerkki Google Chromessa
  6. Google Chrome ei tue HTML5-tietokannan sovellusliittymää
  7. Kuinka sivuuni osoittavien Google Chromen pikapainikkeiden ulkoasua ja toimintaa muokataan?
  8. Kuinka verkkosivu voi avata uuden välilehden eri prosessiin?
  9. Miten voin poistaa sivustoni Chromen Instant-URL-latauksesta?

Haku

  1. Intranet-sivuston osoitteen kirjoittaminen tuo näkyviin hakutulossivun eikä intranet-sivustoa
  2. Kuinka voin lisätä sivustoni haun Google Chromen hakuasetuksiin?

Johdanto

1. Mitä Google Chrome pitää sisällään?

Google Chromessa on monia ominaisuuksia, joita hyödyntämällä ylläpitäjät voivat parantaa sivustojensa käyttömukavuutta. Google Chromessa on sisäänrakennettuna Gears, minkä ansiosta sivustojen ylläpitäjät voivat käyttää hyväkseen sovellusliittymiä, kuten offline-tallennustilaa. Lisäksi Google Chromessa verkkosovelluksesi voi näyttää ja tuntua kuin oikealta, "omalla koneella" olevalta sovellukselta, sillä Google Chromen voi käynnistää niin, että sen käyttöliittymässä näkyy vain otsikkopalkki.

Google Chromessa käytetään myös aivan uutta JavaScript-tulkkia (V8), joka on paljon nopeampi kuin aiemmat JavaScript-tulkit. Tämä tarkoittaa, että voit luoda monimutkaisempia ja vaativampia AJAX-sovelluksia ja nopeutta ja prosessointia rajoitetaan vähemmän. Google Chromen pohjana on WebKit, joten Google Chromen käyttäjät hyötyvät WebKitin uusimmista CSS3-ominaisuuksista heti, kun ne julkaistaan.

2. Mistä saan tietoa muista selaimista?

On olemassa monia muita selaimia, joista voit valita. Näissä sivustoissa on tietoa joistakin yleisesti käytetyistä selaimista:

User agent

3. Mikä on Google Chromen user agent -merkkijono?

Google Chromen user agent -merkkijono on:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.X.Y.Z Safari/525.13.

Google Chrome käyttää WebKit-selainmoottoria, jota käyttävät myös muut selaimet, esimerkiksi Applen Safari. Verkkosivujen pitäisi näyttää Google Chromessa samanlaisilta kuin näissä muissa WebKit-pohjaisissa selaimissa. Voit mieluummin etsiä user agent -merkkijonoista kohdetta webkit kuin jotain tiettyä selaimen nimeä (kuten Google Chrome tai Safari).

Kielen koodaus

4. Merkit eivät näy oikein Google Chromessa

Selainten on helpompaa näyttää sisältösi oikein, jos annat sisältöön ja merkistöjärjestelmään liittyviä tietoja asiakirjasi lähdekoodin yläosassa. Jos käytät kehyksiä tai iframes-kehyksiä, ilmoita merkistöjärjestelmä myös kehysten yläosassa. Osa selaimista (kuten Google Chrome) ei tunnista merkistöjärjestelmän ilmoitusta, jos se on asiakirjassa alempana (esimerkiksi CSS:n tai komentosarjan jälkeen asiakirjan head-osassa).

Esimerkki hyvästä merkistöjärjestelmätiedon paikasta:

<html>    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    <script type="text/javascript">
    ... Oma JavaScript-koodisi ...
    </script>
    .......

Varmista myös, että verkkopalvelimesi ei lähetä ristiriitaisia HTTP-otsakkeita. Verkkopalvelimen lähettämät otsakkeet ohittavat sivun sisältämät charset-ilmoitukset.

5. Merkistöjärjestelmän ilmoittaminen JavaScriptin avulla (document.write) ei toimi

Google Chrome ei lue merkistöjärjestelmätietoja, jotka ilmoitetaan document.write()-komennolla. Jos käytät tätä tapaa merkistöjärjestelmän ilmoittamiseen esimerkiksi iframes-kehyksissä, kehystä näytettäessä saattaa näkyä sekavia merkkejä. Älä siis käytä tätä tapaa:

frame1.js

document.write("<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">");
    ... muu JavaScript-koodi ...

...vaan käytä mieluummin tätä:

frame1.html

<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    <script type="text/javascript">
    ... Oma JavaScript-koodisi ...
    </script>
    ...

6. Google Chromessa näkyy '%B1%C1%C3%E5' kahden kiinalaisen kirjoitusmerkin sijasta

Google Chrome käyttää prosenttimerkkejä hakuparametrien koodaamiseen URL-osoitteessa. Varmista että palvelimesi komentojonot purkavat prosenttien avulla esitettyjen merkkien koodauksen oikein ennen tietojen käsittelyä.

Komentosarjat ja verkkosovellukset

7. ActiveX-ohjausobjekti ei lataudu

Määritä laajennuksen versioksi NPAPI.

ActiveX-tekniikkaa tukee vain Internet Explorer (ja selaimet, joiden pohjalla on Internet Explorer) Windowsissa. Google Chrome, Mozilla Firefox, Apple Safari ja muut selaimet eivät tue ActiveX-tekniikkaa. Sen sijaan nämä selaimet käyttävät NPAPIa (Netscape Plugin Application Programming Interface).

8. JavaScript ei toimi oikein

Google Chromessa voi tarkastella JavaScript-virheitä ja korjata ne seuraavilla tavoilla:

  • JavaScript-konsoli: napsauta Sivu-valikon kuvaketta ja valitse Kehittäjä > JavaScript-konsoli. Täällä voit tarkastella JavaScriptin suorituksen virheitä ja lisätä suoritettavia JavaScript-komentoja.
  • JavaScript-viankorjaus: saatavilla kohdassa Sivu-valikon kuvake > Kehittäjä > JavaScript-viankorjaus. Viankorjauksessa on komentokehote, jossa voi asettaa mm. keskeytyskohtia ja backtrace-raportin. Kirjoita ohje viankorjauksen komentoriville, niin pääset alkuun.

Renderointi ja selaimen käyttäytyminen

9. Sivustoni sisältö näkyy Google Chromessa eri tavalla kuin Internet Explorerissa

Google Chrome käyttää eri selainydintä kuin Internet Explorer, joten verkkosivut saattavat näyttää erilaisilta. Apple Safari käyttää samaa selainydintä kuin Google Chrome (WebKit), joten siinä sivujen pitäisi näkyä samalla tavalla.

10. Kuinka voin testata sivustoani Google Chromessa?

Voit testata sivustoasi Google Chromessa monien työkalujen avulla:

  • Verkkotarkistin
    Käynnistä verkkotarkistin napsauttamalla mitä tahansa verkkosivun osaa hiiren kakkospainikkeella. Näet napsauttamaasi osaan liittyvät elementit ja resurssit, kuten hierarkkisen DOM-mallin ja JavaScript-konsolin.
  • Tehtävänhallinta
    Valitse Sivu-valikon kuvake ja sitten Kehittäjä > Tehtävänhallinta (voit myös painaa Shift+Esc). Tehtävänhallinnassa näkyvät kaikki Google Chromen käynnissä olevat prosessit ja resurssit, joita ne käyttävät (muisti, suoritin ja verkko).
  • JavaScript-viankorjaus
    Valitse Sivu-valikon kuvake ja sitten Kehittäjä > JavaScript-viankorjaus. Se käynnistää JavaScript-viankorjauksen, jonka avulla voidaan liittää käynnissä oleviin prosesseihin.

11. Ulkopuolisen tyylitaulukon kirjasinmääritykset eivät tule voimaan

Varmista, että ulkopuoliset tyylitaulukot käyttävät oikeita charset- ja content-type-muuttujia. Niitä tulee käyttää muodossa text/css tai text/css;charset=X.

Tyylitaulukon charset-muuttujaa ei ole hyvä määrittää HTTP-otsakkeessa. Lisää sen sijaan ilmoitus CSS-tyylitaulukossa aivan alkuun (ei mitään merkkejä ennen sitä, ei edes välilyöntejä tai rivinvaihtoja) seuraavalla tavalla:

@charset "xxx"

Merkistöjärjestelmän tietojen unohtaminen voi aiheuttaa sen, että tyylitaulukko ei jäsenny oikein.

Katso lisätietoja tästä aiheesta World Wide Web Consortiumin aineistosta osoitteessa http://www.w3.org/TR/CSS21/syndata.html#charset.

12. Sivustoni ponnahdusikkunat eivät näy Google Chromessa

Google Chrome pienentää ponnahdusikkunat ja näyttää niistä vain otsikkopalkin selainikkunan oikeassa alakulmassa. Käyttäjät voivat nähdä ponnahdusikkunan sisällön vetämällä sen otsikkopalkin paremmin näkyvään kohtaan. Näin ponnahdusikkunat voivat latautua, jotta niistä riippuvaisten sivustojen toiminta ei häiriinny. Samalla epätoivotut ponnahdusikkunat eivät pääse peittämään sivua ja häiritsemään käyttäjiä.

13. SSL-suojatussa sivustossani näkyy lukon sijasta huutomerkki Google Chromessa

Tämä osoittaa, että sivulla on ongelma SSL:n käytössä. Saat lisätietoja ongelmasta napsauttamalla Google Chromessa näkyvää huutomerkkiä. Usein ongelmat johtuvat sivulla olevasta sekasisällöstä - esimerkiksi, jos ylätason verkkosivu käyttää HTTPS-protokollaa ja on SSL-suojattu mutta olet lisännyt sivulle myös HTTP-protokollaa käyttäviä elementtejä (kuten kuvia, komentojonon tai CSS-koodia). Lukko näkyy vain, jos kaikki sisältö käyttää HTTPS-protokollaa.

14. Google Chrome ei tue HTML5-tietokannan sovellusliittymää

Google Chromen kehittelytiimi aikoo lisätä tulevaan versioon HTML5-tietokannan sovellusliittymän tuen, samoin kuin muiden WebKitin tukemien sovellusliittymien, kuten offline-tilan ja työntekijöiden, tuen.

15. Kuinka sivuuni osoittavien Google Chromen pikapainikkeiden ulkoasua ja toimintaa muokataan?

Google Chromen käyttäjät voivat luoda pikapainikkeita haluamilleen verkkosivuille valitsemalla Luo ohjelmapikapainikkeita Sivu-valikosta. Oletuksena uusissa pikapainikkeissa käytetään kyseisen sivun otsikkoa ja favicon-kuvaketta.

Voit määrittää sivuusi osoittavien Google Chromen pikapainikkeiden otsikon, kuvauksen ja URL-osoitteen lisäämällä tiedostosi <head>-osaan sisällönkuvauskenttiä.

Muokattava asia: Tunniste Esimerkki
Pikapainikkeen otsikko application-name <meta name="application-name" content="Gmail"/>
Kuvaus (käytetään, kun tilaa on enemmän, kuten valintapaneelissa) description <meta name="description" content="Googlen näkemys sähköpostista"/>
URL-osoite, joka avataan, kun pikapainiketta painetaan application-url <meta name="application-url" content="http://www.gmail.com"/>
Pikapainikkeen kuvake   <link rel="icon" href="gmail_32x32.png" sizes="32x32"/>
<link rel="icon" href="gmail_48x48.png" sizes="48x48"/>

Esimerkki:

<head>
    <meta name="application-name" content="Gmail"/>
    <meta name="description" content="Googlen näkemys sähköpostista"/>
    <meta name="application-url" content="http://www.gmail.com"/>
    <link rel="icon" href=gmail_32x32.png sizes="32x32"/>
    <link rel="icon" href=gmail_48x48.png sizes="48x48"/>
    </head>

Nämä tunnisteet ovat lähes samat kuin Gears Desktop -sovellusliittymässä. Katso lisätietoja Gears Desktop -sovellusliittymän dokumentaatiosta.

16. Kuinka verkkosivu voi avata uuden välilehden eri prosessiin?

Google Chromessa on moniajoarkkitehtuuri, mikä tarkoittaa, että välilehdet voidaan suorittaa prosesseissa, jotka ovat erillään toisistaan ja selaimen prosessista. Verkkosivun synnyttämät uudet välilehdet avataan kuitenkin yleensä samaan prosessiin, jotta alkuperäinen sivu voi käyttää uutta välilehteä JavaScriptin avulla.

Google Chrome etsii kuitenkin vinkkejä uusien välilehtien avaamiseksi erillisessä prosessissa, jos siirrät uuden välilehden eri verkkosivustolle.

Helpoin lähestymistapa on käyttää linkkiä eri verkkosivustolle, joka on kohdistettu uuteen ikkunaan lähettämättä viittaustietoja. Google Chrome tunnistaa, että tämä on vinkki pitää uusi sivu erotettuna alkuperäisestä sivusta. Se lataa uuden sivun erilliseen prosessiin. Esimerkki:

<a href="http://erisivusto.com" target="_blank" rel="noreferrer">Avaa uuteen välilehteen uudessa prosessissa</a>

Jos haluat avata uuden välilehden uudessa prosessissa, kun lähetät viittaustietoja, noudata seuraavia JavaScript-ohjeita:

  • Avaa uusi välilehti, jonka kohteena on about:blank.
  • Avaa uuden avatun välilehden opener-muuttujaksi null, jotta se ei voi käyttää alkuperäistä sivua.
  • Ohjaa kohteesta about:blank muuhun verkkosivustoon kuin alkuperäiseen sivuun.

Esimerkki:

var w = window.open();
w.opener = null;
w.document.location = "http://erisivusto.com/index.html";

Nämä vinkit toimivat vain URL-osoitteissa, jotka ovat eri verkkotunnuksessa tai protokollassa kuin ponnahdusikkunan antava sivu. Jos ponnahdusikkunan avaava sivu on esimerkiksi osoitteessa http://www.example.com/:

  • eri verkkotunnuksia ovat http://www.example.org ja http://www.example2.com
  • eri protokolla on https://www.example.com

17. Miten voin poistaa sivustoni Chromen Instant-URL-latauksesta?

Jos Google Chromen käyttäjä on ottanut Chrome Instant -ominaisuuden käyttöön, useimmat verkkosivut latautuvat heti, kun URL-osoite on kirjoitettu osoitepalkkiin – siis jo ennen kuin käyttäjä painaa Enter-painiketta.

Jos olet verkkosivuston järjestelmänvalvoja, voit estää Google Chromea Instant-lataamasta verkkosivustoasi:

  • Kun Google Chrome lähettää pyynnön verkkosivustosi palvelimelle, selain lähettää seuraavan header-tunnisteen:
    X-Purpose: instant
  • Etsi kyseinen header ja palauta HTTP 403 ("Kielletty") -tilakoodi.
  • Kun Google Chrome vastaanottaa tämän tilakoodin, se lisää verkkosivustosi palvelimen ylläpitämälle estolistalle. Estolista on voimassa käyttäjän selausistunnon ajan.

Haku

18. Intranet-sivuston osoitteen kirjoittaminen tuo näkyviin hakutulossivun eikä intranet-sivustoa

Kun käyttäjä syöttää osoitepalkkiin vain yhden sanan, Google Chrome tekee haun tällä termillä ja palauttaa käyttäjän oletushakukoneen antamat tulokset. Samalla Google Chrome lähettää HEAD-pyynnön osoitteelle http://termi. Näin selviää, onko se voimassaoleva verkkosivusto. Jos Google Chrome saa vastaukseksi HTTP/2xx (esimerkiksi HTTP/200 OK), käyttäjältä kysytään, haluaako hän mieluummin vierailla sivustossa. Jos kehotteesta siirrytään sivustoon, kyseinen sivusto asetetaan tämän termin oletuskohteeksi tulevia kyselyjä varten.

Google Chrome näyttää kehotteen myös, jos se vastaanottaa jonkin seuraavista:

  • HTTP/401- tai HTTP/407-vastauksen
  • HTTP/3xx-uudelleenohjauksen, joka päätyy sivulle, josta saadaan jokin yllämainituista vastauksista

Varmista, että verkkopalvelimesi vastaa oikein sivun GET-pyyntöjen lisäksi myös HEAD-pyyntöihin.

Esimerkiksi, jos sivusto on osoitteessa http://project.intranet.example.com, ja yrityksen verkon sisäinen käyttäjä kirjoittaa osoitepalkkiin project:

  • Google Chrome palauttaa hakutulokset termille project.
  • Samalla Google Chrome tarkastaa, onko http://project voimassaoleva verkkosivusto. Jos näin on,
  • Näkyviin tulee kehote, jossa kysytään, haluaako käyttäjä siirtyä osoitteeseen http://project.
  • Kun käyttäjä siirtyy osoitteeseen http://project, Google Chrome asettaa osoitteen http://project kohteeksi kaikille osoitepalkissa termillä project tehtäville hauille.

Käyttäjä voi ohittaa oletuksena tehtävän haun kirjoittamalla project/ tai http://project, tai valitsemalla osoitepalkin merkinnän, jossa lukee project/, eikä sitä, jossa lukee Haku termillä: project.

19. Kuinka voin lisätä sivustoni haun Google Chromen hakuasetuksiin?

Jos sinulla on OSDD-tiedosto (OpenSearch description document), Google Chrome voi lisätä sivustosi selaimen hakukoneluetteloon. Lisätietoja OpenSearchistä on osoitteessa http://www.opensearch.org.