Los degradados en internet, ya son invisibles. Pero no porque no estén, todo lo contrario. Son invisibles porque ya estamos demasiado acostumbrados a ellos y no podemos detenernos a pensar en que un fondo tiene un degradado, por ejemplo.
Pero nosotros somos parte de los que hacemos la web, por lo que este tema sí nos debe interesar y no nos tiene que parecer invisible. Antes
Para crear un degradado, teníamos que abrir en nuestro ordenador un programa de creación de imágenes (como el Photoshop) y crear el degradado en formato de imagen (png, jpg, gif). Lo cual nos costaba, además de trabajo, un poco de tiempo. Hoy
Existen muchas aplicaciones y páginas que nos ayudan a crear el degradado sólo copiando y pegando un código de CSS3 y son muy fáciles de usar!
Antes de empezar a explicar, quiero que vean el resultado de lo que les proponemos en este post haciendo click en el enlace que los lleva al final del post. Click aquí para ver los degradés.
Tras largos meses de ausencia, quiero darles las gracias por todas las visitas que nos han regalado cada uno de ustedes. Sé que no serán muchos en comparación con otras páginas, pero son muchos para mí.
Sinceramente (me gusta ser sincero), no sólo tuve tiempo para seguir con esta maravilla de los blogs, sino que me ha desepcionado la idea de tener que actualizar todas las entradas debido a la ya no reciente actualización de Blogger (la mejor plataforma de blogs del mundo).
Sin embargo, en ésta última semana me estuve interiorizando con esto (una vez más) y renové fuerzas para seguir escribiendo y enseñarles, porque eso es lo que hacemos desde el año 2009.
GRACIAS a toda la población de habla hispana que entró en estos meses y a todos los que siguen comentando en un blog a pesar de la presencia subordinada de las redes sociales.
Los saludo y los espero pronto.
Mayo 2013.
El favicon de un blog o página web es un pequeño ícono que aparece en el navegador, al lado de la barra de dirección. En la siguiente imagen se muestra lo que estoy hablando: El predeterminado favicon de todo blog de blogger, es el siguiente: Este ícono que representa a Blogger, puede ser cambiado por otro que quieras. Seguramente esto ya lo sabías ya que hay miles de administradores de blogs que ya lo hicieron. Por eso, te recomendamos ver el siguiente post y seguir los pasos que se muestran en el siguiente recuadro.
Sabemos que hoy se obtienen visitas y tráfico por los motores de búsqueda y principalmente por las redes sociales. Es aquí a donde elige ir la mayoría de los usuarios en Interte en todo el planeta.Entonces qué mejor que tener parte de una de las redes sociales más visitadas en tu blog. En esta ocasión elegimos Twitter, que nos ofrece un gadget que permite que tus lectores vean tus tweets de manera muy práctica.
Este reloj va en cuenta regresiva y te indica cuántas horas, minutos o segundos falta para que termine el día. Esto sólo se puede añadir a un gadget del blog, ya que este truco lo conforma un script. La única manera de agregarlo en una entrada es poniendo el script solo en un gadget, y en la entrada poner el código HTML ligado al script. ¡No te preocupes! Explicaremos ambas formas.
Nosotros hemos probado una de las páginas que te ofrecen tener un dominio .tk gratis, antes de publicarlo como un truco más para Blogger. Nuestro error fue haberlo probado en esta misma página, Teoría Blogger. Los administradores de aquellas páginas o blogs que enseñan esto, no lo probaron lo suficiente (o sí), aún así con tal de obtener visitas seducen a sus lectores mostrándoles algo que puede ser perjudicial al pasar el tiempo.
Experiencia que he tenido
Para ser sinceros, yo también he sentido por un momento que se me ha cumplido el sueño de todo bloguero de Blogger, es decir he probado el dominio .tk. Usé el servicio de dot.tk, pero no debí usarlo gratis... En un principio no tuve problemas de ningún tipo: No había publicidades, no se saturaba, no era más lento de lo normal, NADA. Hasta que un día, luego de un año y unos meses entré a "teoriablogger.tk" y ví una página con un diseño precario, parecido al de Google (aclaro que Google no tiene nada que ver con esto) y lleno de links publicitarios.
Explicación del asunto
La única explicación posible es lo comercial Pero, ¿Cómo? Luego de un largo tiempo, luego de que Teoría Blogger tenga varias visitas diarias, un día éste desapareció de la red y fue sustituido por una plagada de links publicitarios. No estoy en contra del dominio .tk para usarlo como dominio para acortar la URL, sino de que en otros blogs parecidos a éste, proporcionen información desconocida y que no adviertan que comprar un dominio .tk es eficiente y te lo asegura en un lapso de tiempo determinado que si a éste lo obtenemos de forma gratuita.
Actualmente el dominio .com.ar (dominio de la región argentina), es el único dominio gratuito y te asegura 2 años en la red (para extenderlo deben pagar). Este dominio se puede aplicar a Blogger (como todos), pero requiere de conocimientos de los cuales carecemos. Si conoces otro dominio que garantiza un largo tiempo y es gratuito, envíanos tu sugerencia.
Últimamente, los productos Google están evolucionando sus diseños. El último más trascendente es el de Youtube, pero ya hace tiempo que le tocó a Blogger. Para muchos, la nueva interfaz de Blogger es más modernay está más organizado que la anterior interfaz. Es mucho más atrayente, ya que sus nuevas tendencias llaman la atención. Pero, no faltan (y no son pocos) los que se quedan con la antigua interfaz. Esto puede deberse a que les resulta complicado adaptarse a las nuevas funciones del "nuevo Blogger" o simplemente por costumbre a éste. En este nuevo post, vamos a enseñarles cómo cambiar ambas interfaces, para aquellos que no pudieron hacerlo o que tienen interés.
Concurrimos, una vez más, a Btemplates para buscar las mejores plantillas para blogs que se traten de juegos.
Para usar una plantilla en tu blog
Una vez que hayamos elegido la plantilla que nos gustó, vamos a descargarlo haciendo click en el botón "Download" y guardaremos un archivo que nos descargará como archivo .zip.
Vamos a la carpeta Descargas (o carpeta que contiene el archivo .zip) y hacemos click derecho en ese archivo, y click en "Extraer aquí" (o "Extract Here") para descomprimir el archivo de formato XML, el archivo que subiremos a Blogger (esto es probable que aparezca dentro de una carpeta con el mismo nombre de la plantilla) Vamos a Blogger → Plantilla → Botón, Edición de HTML [En la vieja interfaz, Diseño → Edición de HTML], hacemos click en y seleccionamos el archivo XML de la carpeta, que se puede ver en la imagen anterior. Hacemos click en http://www.blogger.com/img/blank.gif
Nota: Para descomprimir el archivo .zip, es decir, hacer click derecho y "extraer aquí", debes tener instalado en tu ordenador un programa para descomprimir archivos o descomprensor. Puedes descargar Win rar o programas similares. No son muy pesados. Para más info, click aquí: http://www.softonic.com/s/descompresor
Esta etiqueta es una de las más utilizadas ya que gracias a ella se crean los famosos enlaces o links. Los links nos enlazan o nos llevan a otras páginas al hacer click en uno de ellos.
Ejemplo
Un simple ejemplo, es el siguiente que nos llevará al inicio de esta página Teoría Blogger.
Sintaxis
Como siempre, remarcamos la sitaxis de cada etiqueta, es decir, cómo hacerlo, de qué se compone.
Para crear el link necesitaremos de: - La etiqueta de apertura
<a>
- Dentro de la etiqueta pondremos el atributo href y dentro pondremos la URL de la página
Seguramente la mayoría de los blogueros de Blogger, han puesto una encuesta en su blog con el gadget que nos ofrece Blogger. Si bien es una opción, existe una página que no sólo crea las encuestas, sino que también nos da la oportunidad de modificarlas y personalizarlas.
Esta es la opción que nos ofrece Blogger para insertar una encuesta en el diseño del blog
99polls es una página que nos permite crear encuestas flash. Dichas encuestas de dicha página, son simples, ya que cuentan con lo escencial: La pregunta, las opciones, un botón para votar y un botón de resultado. También nos permite modificar sus colores (ya sean los de las letras, de las preguntas, de los bordes). Una de las características, respecto de su función, es que sólo nos permite votar una sola vez. De ninguna manera se puede votar dos veces (salvo que tengamos dos ordenadores).
Este truco consiste en un gadget que mediante un script, puede mostrarte la cantidad de entradas publicadas en tu blog.
Es una pequeña función que a pesar de que es lo único que muestra, se actualiza sólo. Es decir, una vez que publiquemos más entradas no hay que modificar nada.
La etiqueta <hr> se indica cuando se quiere llevar a cabo una línea horizontal para separar un texto con otro. El uso frecuente de esta etiqueta en un solo post o página puede resultar desprolijo e innecesario.
Sintaxis
Para determinar esta línea horizontal vamos a escribir solo una etiqueta: <br/>. ¿Por qué no usamos dos etiquetas, la de incio y la de final? Porque esta etiqueta no encierra un contenido de ninguna manera.
<hr/>
El resultado de esta etiqueta nos da una barra horizontal como esta:
Para que se entienda mejor esto, paso a explicar. El "truco" consiste en hacer que una imagen (cualquiera) flote en la parte inferior, es decir, que esta imagen esté siempre presente en la entrada en la que vamos a insertar esta imagen. Podemos ver el ejemplo en esta entrada en particular, donde la imagen que aparece abajo es sólo por esta entrada. Cuando entremos a otra entrada o página, la imagen desaparecerá.
La propiedad text-shadow, permite dar sombra a un determinado texto. Esta sombra se puede modificar en cuanto a posición, nitidez y color. Usar esta etiqueta es muy eficiente estéticamente y además es algo muy moderno.
Sintaxis
En esta propiedad, se pueden poner de 2 a 4 valores: Posición eje X, Posición eje Y, Nitidéz y Color.
Así usamos text-shadow con todos sus valores:
text-shadow: 1px1px3px#FF0400;
El primer valor se posiciona de modo horizontal. Y si pones el signo menos (-) la sombra se correrá hacia la izquierda.
El segundo valor hace que la sombra se posicione verticalmente. Si precede un signo menos a este valor, la sombra se irá hacia arriba.
El tercer valor hace que la sombra tenga una especie de "esfumado" o le quita nitidez al aumentar el valor. Este valor es opcional.
El cuarto valor hace que le de color a la sombra. Este valor es opcional.
Así usamos text-shadow en CSS:
<span style="text-shadow:1px 1px #FF0400;">Ejemplo de texto con sombra nítida</span>
Ejemplo de texto con sombra esfumado menor
<span style="text-shadow:1px 1px 1px #FF0400;">Ejemplo de texto con sombra esfumado menor</span>
Ejemplo de texto con sombra esfumado medio
<span style="text-shadow:1px 1px 3px #FF0400;">Ejemplo de texto con sombra esfumado medio</span>
Ejemplo de texto con sombra esfumado mayor
<span style="text-shadow:1px 1px 6px #FF0400;">Ejemplo de texto con sombra esfumado mayor</span>
Ejemplo de texto con sombra nítida sin color
<span style="text-shadow:1px 1px;">Ejemplo de texto con sombra nítida sin color</span>
Los colores que se ponen al final del valor de la propiedad pueden ser establecidos como Colores Hexagecimal, RGB o con el nombre.
Para tener una lista de colores y saber cómo se usa, haz click aquí.
Atención! Como bien indica luego, este truco se aplica en un gadget (sidebar)
Como ya dijimos en posts anteriores, las redes sociales ya son una parte inevitable para incorporar a la actualidad a tu blog.
Entonces qué mejor que incorporarlos a tu blog, haciendo así, que los visitantes puedan acceder a ellas mediante un diseño cómodo, elegante y fácil.
Este truco se puede ver claramente a la derecha de Teoría Blogger:
La etiqueta strike (<strike>) implica simplemente que un texto sea tachado.
Muchas veces esta etiqueta es usada irónicamente para mostrar que uno se ha equivocado con un texto o palabra.
Sintaxis
La etiqueta strike o s (<s>) se usa con un texto de intermediario. Esto significa que supone de dos etiquetas y en el medio se inserta el texto: una que abre la función (<strike>) y otra que la cierra (</strike>).
Ejemplo:
Venus es <strike>un canal</strike> el segundo planeta que gira en torno al Sol
Venus es un canal el segundo planeta que gira en torno al Sol
Etiquetas o propiedades paralelas
Existen otras alternativas para determinar este efecto de la etiqueta strike. En la siguiente tabla mostramos esas alternativas ya sea usando HTML o CSS:
Strike en HTML
<strike></strike>
<s></s>
<del></del>
Strike en CSS
<span class="tachado">Este texto está tachado gracias al CSS →</span>
span .tachado {
text-decoration:line-through;
}
Atributos que se tienden a emplear
Lista de todos los atributos que son más factibles para usar en esta etiqueta (hay más atributos para emplear):
La revista Users es una revista que personalmete compro mensualmente, para enterarme de la última tecnología, aprender sobre computación, internet, etc.
En cada edición de la revista, siempre hay un tema principal. Un tema en el cual le dedican varias páginas en el medio.
En la edición nº 241, aparece como tema principal y a aprender, sobre cómo mejorar nuestros blogs, con el título de "Blogs Super Poderosos".
Escaneé las 11 páginas que le dieron lugar en esta prestigiosa revista.