Icono en barra de direcciones

Desde que me cambié a firefox, hace dos o tres años (antes creía que la e de explorer 6 significaba internet :D), siempre me pregunté cómo ponían esos pequeños iconos en la barra de direcciones que eran acordes a la pagina web que estuviéramos viendo. Sin querer hace unos días encontré este tutorial que realmente sirve, no lo quise probar aquí, pero si lo hice en mi pagina de pruebas, se supone que en safari también se puede ver pero como no guardé la imagen en formato .ico(la guardé en .png), no la puedo ver, la idea es guardar en .ico para que se vea en los distintos navegadores, creo que explorer 7 también puede ver estos iconos, no es por ser cerrado a "nuevas tecnologías", pero nunca he usado ese famoso browser. El pequeño problema es que debemos usar iconos de 16x16 con 16 colores y según el tutorial solo se debe usar .ico, y como dije más arriba a mi me sirvió el .png, por lo menos para firefox. 

Para solucionar ese problema existe este buscador donde podrás encontrar miles de iconos de distintos tamaños. 

Actualizado: Para pasar los iconos de .png a .ico descarguen iconographer X 2.5 (para OS X), muy facil de usar, no he buscado programas para windows y linux. 

Acualización 2: Encontré una herramienta para crear iconos online llamada Dynamic Drive que hace todo más facil, y si que lo hace, por que renombra tu icono como favicon.ico, que, como dice el tutorial es lo que buscan lo web browsers y por fin lo veo en safari.

 Lo que falta es la prueba:

Tutorial

Buscador

Programa OS X

Herramienta Online

Web de prueba