Lisää kotisivullesi Android-laitteita tukeva ikoni

Kirjoitin aikaisemmin tänään ohjeet web-ikonin lisäämiseen Applen iOS-pohjaisia mobiililaitteita varten. Kyseessä on siis ikoni, joka näkyy käyttäjälle muun muassa silloin, kun verkkosivusto lisätään kotinäkymään pikakuvakkeeksi. Pian jutun julkaisun jälkeen ryhdyin miettimään, että Androidin puolella täytyy olla vastaavanlainen ratkaisu, ja niinhän siellä onkin!

Googlen kehittämä Chrome-selain on vakiinnuttanut asemansa myös Android-laitteiden verkkoselaimena. Se antaa Applen Safarin tavoin mahdollisuuden lisätä verkkosivustoja kotinäkymään, jolloin omiin suosikkisivuihin pääsee käsiksi mahdollisimman nopeasti. Niinpä myös tähän tarkoitukseen kannattaa muokata kuvankäsittelyohjelmalla sopiva ikoni.

Androidin kohdalla hommaan riittää yksi ainoa kuvake, jonka suositeltava koko on 192 x 192 pikseliä. Näin ohjeistetaan Chromen kehittäjäsivustolla, johon linkki löytyy tämän artikkelin lopusta. Kun kuvake on valmis, lisää alla oleva koodi <head></head>-tagien väliin muokkaamalla sitä ikonisi osoitteella.

<link rel="icon" sizes="192x192" href="IKONIN OSOITE">

Ekstra: Oman verkkosivuston voi optimoida toimimaan niin sanottujen tavallisten sovellusten kaltaisesti alla olevalla koodilla. Se lisätään myös <head></head>-tagien väliin. Kun koodi on käytössä, poistetaan näkyvistä verkkoselaimen elementit (osoitepalkki jne.), jolloin sivusto toimii ikään kuin natiivin sovelluksen tavoin. Tämä pätee silloin, kun sivusto avataan kotinäkymään lisätyn kuvakkeen kautta. Ratkaisua kannattaa harkita, jos oma sivusto on optimoitu hyvin mobiililaitteita varten. Se on kuitenkin tehty pääasiassa verkkopohjaisia sovelluksia varten, joten ratkaisun hyödyntämistä esimerkiksi blogin kohdalla kannattaa harkita ennen lopullista päätöstä.

<meta name="mobile-web-app-capable" content="yes">

Google Chrome, Add to Homescreen

Vastaa