Favicon, Que es, como se hace y como lo agrego a mi blog..

Un FAVICON es simplemente un icono o dicho de otra manera una imagen pequeña que se puede notar en algunos navegadores (FireFox, Opera, IE7 en IE6 no se puede observar), en la barra de direcciones del lado izquierdo de la dirección de la web en la que estamos.. Una pequeña prueba acerca de esto, simplemente dirige tu mirada a la dirección de ese blog podrás notar una pequeña imagen junto a la url del sitio, pues como lo dije anteriormente, ese es un FAVICON..

¿Pero y como hago un favicon?

Es muy simple, todo esto se realiza en unos cuantos pasos sin necesidad de descargar ningún programa especial ni nada de eso, en pocas palabras utilizaremos un servicio online que nos da la posibilidad de hacerlo sencillo y rápido..

Los pasos a seguir son muy simples, lo haremos así..

[1] Elegimos la imagen que se convertirá en nuestro favicon, puede ser alguna letra, simbolo,dibujo, etc..

[2] Una vez elegida la imagen la editamos un poco con el programa que mas nos acomode, dentro del programa de edición de imagenes le cambiamos el tamaño original por el de 16×16 pixel..

[3] Cuando este lista entramos a esta web para subir nuestra imagen a la cual hemos cambiado el tamaño para convertirla en nuestro favicon, al subirla la web por si sola convertirá la imagen a formato ico, y nos dará el código para pegarlo en tu blog o web..

Copiamos y pegamos el código que nos proporcionan en nuestra plantilla y eso sera todo, la próxima vez que entres a tu blog podrás observar que ya tienes tu propio FAVICON..

¿Pero quiero ahorrarme todos estos pasos, que hago?

Si no te gusta seguir pasos y lo quieres todo a la mano este sitio es para ti, en ella se recopilan una gran cantidad de iconos para agregar a tu blog totalmente gratis, además de todo puedes subir tu propia imagen o dibujo y en menos de un minuto tendrás el favicon que deseas..

Una vez que hayas elegido el favicon idoneo o creado tu propio favicon, lo descargas a tu pc, en este casi tendrás que subir la imagen a tu servidor, después de ellos solo copias la url del archivo y lo agregas al código que te proporcionaran en MpP..

Lo agregáis a tu plantilla antes del fin de < /Head> y eso sera todo..

<link href="'DIRECCION DE TU FAVICON'" rel="'shortcut" type="'image/x-icon'/">
<link href="'DIRECCION DE TU FAVICON'" rel="'icon'" type="'image/jpg'/">

Hay que tener presente que la parte final del código puede ser modificada, si el formato de tu imagen no es jpg solo remplazala por el formato de tu favicon que corresponda..

Como podrás ver ya no hay excusa para tener tu propio favicon..


Entradas relacionadas

Icono en la barra de navegación
Como agregar bordes directamente a las imagenes..
Cursor personalizado en CSS..
Dar estilo a las listas con CSS
IE6, Un problema para los diseñadores y bloggers

Bromas pesadas tomadas en vídeo..

Quien no ha hecho una broma o a sido víctima de una muy mala broma, sobre todo las pesadas que en verdad te molestan y te sacan de quicio a veces, pero al saber que es una simple broma de television yo tomaría con humor, pero no es así con todas estas personas que al parecer no le gusto nada que el personaje que efectúa la bromas lo hiciera de ese modo..

Todas se realizan en parecer en Brasil y en Venezuela, la verdad son muy buenas, pero al final se enojan demasiado y terminan golpeando al autor de la broma pesada..

Esta es la primera al parecer realizada en un programa de television venezolana, la verdad se pasaron con la bromita la mujer pudo a ver muerto del susto o algo parecido..



La segunda es realizada en Brasil, al parecer una persona que se transporta en su silla de ruedas pide ayuda para poder pasar al otro lado de la avenida, pero la realidad es que si puede caminar y todo el esfuerzo que habían hecho las victimas se transforma en enojo..




Entradas relacionadas

¿Por que es mejor estar sobrio?
Top 5 de los mejores comerciales vistos en YouTube..
Las 25 mejores muertes en las peliculas de terror..
¿Como llega la carne a tu plato?
¿Qué pasaría si chocara un gran meteorito contra la tierra?

La maldición de ser Informático..

Cuando se es Informático, (y nadie me lo puede negar) se es asediado por amigos y familiares o aveces hasta personas que ni conoces que te preguntan que Antivirus es el mejor del mercado, siempre les contesto que instalen el Avast, cada quien tiene su favorito y ese es el mio..

Aveces cobro por los servicios como instalar programas, formatear discos, pero la verdad es que son sumas muy pequeñas, nada comparado con lo que cobra un Informático de verdad, ya que yo soy un simple humano que solo sabe usar el msn y aun así no falta el que te pregunta como crear una base de datos en MYSQL, esta bien que te lo pidan una o dos veces el mes, pero nada comparado con este vídeo..

Piensalo bien antes de decirle a alguna persona que tu sabes de Informática y esas cosas ya que no te lo quitaras de encima para preguntarte lo imposible o lo mas fácil de la computación..




Entradas relacionadas

Video Documental: La historia jamas contada..
Video: El bebe de dos cabezas..
Las 25 mejores muertes en las peliculas de terror..
Bambee, version rara..
Video: La niña fantasma del espejo

Personalizando nuestro buscador con CSSy HTML..

En Blogger, agregar un buscador al blog es muy sencillo, es tan simple como usar el que nos muestran en Blogger Draft o simplemente crear uno a nuestro gusto y nuestros colores y forma preferida..

Para agregar un buscador sencillo al blog basta con agregar este pequeño código en el lugar donde queramos que aparezca, como podrán observar a continuación no tiene nada de fantástico..

<form action='http://nombreblog.blogspot.com/search' method='get'>
<input type='text' value='' name='q' />
<input type='submit' value='Buscar' />
</form>

El resultado seria este, lo único que hacemos es cambiar nombreblog por el nuestro en el codigo visto anteriormente..

¿Pero como lo personalizo utilizando CSS en el?

Es muy fácil, usaremos estas lineas de código para lograr lo que estábamos buscando..

#searchform #s { // Esta instrucción la usaremos para personalizar la caja de búsqueda
padding: 0px;
margin: 0px auto;
background-color : #FFFFFF; // El color de fondo es blanco, agrega el código hexadecimal para cambiar el color
height:14px; // Cambia la altura de la caja de búsqueda, cambia 14px por la medida exacta
width:150px; // Cambia el ancho de la caja de búsqueda, cambia 150px por la medida exacta
margin-left: 10px;
font:11px Arial, Times New Roman; // Tipo de letra y tamaño de letra
font-weight: normal;
padding: 5px 16px;
}

#searchsubmit:hover { // Esta instrucción la usaremos para personalizar el botón de enviar por defecto
background:#777777; // El color del enlace al ser pulsado
}

#searchsubmit {
margin-left: 0px;
padding: 0px;
background:#FFFFFF; // Color de fondo del botón de enviar
border:none;
width:80px; // Anchura del botón de enviar
height:21px; // Altura del botón de enviar
font:11px "Trebuchet MS", "Lucida Sans Unicode", Verdana;
color: #777777; // Tipo de letra, tamaño de letra y color de letra de la palabra Enviar
}

Cabe recordar que las partes en verde no pertenecen al código y que las borraremos cuando agregemos este mismo a nuestra plantilla..

Cuando terminemos de personalizar el buscador mediante CSS, agregamos esta otra linea de códigos en la parte de HTML, en la zona exacta donde queramos que aparezca el buscador..

<span>
<form action='/search' id='searchform' method='get'>
<table border='0'  width="350" bgcolor="#000000" cellpadding='10' cellspacing='0'>
<tbody>
<tr>    
<td><input id='s' maxlength='50' name='q' onblur='if (this.value == "") {this.value = "¿Buscas algo?";}' onfocus='if (this.value == "¿Buscas algo?") {this.value = "";}' size='18' type='text' value='¿Buscas algo?'/></td>    
<td><input id='searchsubmit' type='submit' value='Buscar'/></td>
</tr>
</tbody>
</table>
</form>
</span>   

Las partes que podemos modificar están marcadas de colores diferentes, para cambiar el tamaño y color de fondo de la parte donde estará el buscador, cambiamos las zonas marcadas con verde, para cambiar el mensaje de ¿Buscas algo? y Buscar simplemente modificamos ese texto por el deseado, las demás partes seria mejor dejarlas así si no queremos errores dentro del código..

Al final podría quedar algo parecido a esto si por supuesto usamos y modificamos estos pequeños códigos de una manera correcta y eficaz. Eso es todo, si te preguntas si esto funcionara en IE7 la respuesta es si, si funciona correctamente, pero ten cuidado el modificar el código ya que puedes llevarte una desagradable sorpresa :x..




Entradas relacionadas

Icono en la barra de navegación
Como agregar bordes directamente a las imagenes..
Cursor personalizado en CSS..
Dar estilo a las listas con CSS
IE6, Un problema para los diseñadores y bloggers