Dilluns Setembre 19 , 2011
Text Size
   

Posar icones a la URL de la web

Cada vegada més sovint, quan naveguem per la web, veiem algunes pàgines o blogs que incorporen el seu propi logo com a una icona que s'allotja a la pestanya i a la barra d'adreces del navegador.

icos


Com podem posar la pròpia icona a la URL de la nostra pàgina?

Aquestes icones son imatges petites (16x16 píxels) en format ICO.

El primer que cal fer doncs, és escollir la imatge que volem posar-hi i convertir-la al format adeqüat (ICO). No es necessita cap programa per a convertir des d'un JPG, GIF o PNG, a internet podem trobar moltes pàgines on podem fer-ho directament online.  Em permeto recomanar aquesta: http://www.convertico.com/, que fa una conversió fidel de PNG a ICO.

Un cop tenim el nostre arxiu ICO, haurem de "programar" la nostra web per tal que el situï com a icona d'URL.  Vegem com.

En programar la web per a què mostri el nostre arxiu ICO, ens podem trobar dues situacions:

 

1 Que la nostra pàgina s'hagi instal·lat amb Joomla!, o Moodle i la instal·lació ja coloqui una icona estàndard que és la imatge de la casa del soft.

Per a canviar-la de forma fàcil, ens connectem per FTP al nostre servidor i cerquem dins els arxius de la nostra web, l'arxiu que dona aquesta imatge (acostuma a ser un favicon.ICO i s'allotja a la carpeta del theme que hagim triat)

Reanomenem la nostra imatge com a favicon.ICO i la substituim al servidor.  La propera vegada que carregui la pàgina (algunes vegades cal netejar la caché abans), ja ens apareixerà la nostra imatge.

 

2 Que la nostra pàgina no mostri cap imatge al costat de la URL

(És el cas de WordPress, per exemple, o de Blogger).

En aquesta situació, haurem de pujar primer la imatge (en format ICO) al nostre servidor i anotar-nos en quina carpeta i subcarpeta el deixem i quin nom li hem donat.

Seguidament, de la plantilla de la nostra web, n'editem el fitxer principal (acostuma a ser index.html, o index.php) i, a la part de <head>, hi afegim una petita instrucció:

<link href='https://www.enxarxat.cat/images/favicon.ICO' rel='shortcut icon'/>

(on "https://www.enxarxat.cat/images/imatges/favicon.ICO" ha d'ésser l'adreça que porti a la icona que hem triat i situat al nostre servidor)

Algunes vegades, l'estructura de la pàgina web conté un arxiu anomenat header.php .  En aquests casos, és aquest el que haurem d'editar per introduir-hi la nostra instrucció.

Desem l'edició i ja ho tenim!!

Recordeu que heu de "refrescar" la pàgina del navegador abans no ens aparegui la icona.  Algunes vegades pot ser necessàri fins i tot esborrar la "caché".

Fa bonic, oi?