- Desde
- 10 Oct 2010
- Mensajes
- 1.417
Hoy les quiero mostrar algo que uso mucho, al momento de trabajar, ya que soy Desarrollador Web.
Cuando estamos haciendo una página web, a veces necesitamos llenar espacios, por ejemplo el de un bloque de adsense que irá en cierta zona de nuestra web, pero es muy tedioso, creo yo, ir a photoshop y hacer una imagen de ciertas dimensiones para llenar dicho espacio.
Existen muchas formas de hacer esto en solo segundos, librerías para crear imágenes del lado del cliente o servicios que generan automáticamente la imagen con tan solo usar una url con parámetros.
Holder.js // Es una librería de Javascript.
¿Cómo funciona?
Simplemente debemos escribir en el apartado del src="" de nuestra imagen holder.js/300x200, las dimensiones en ancho y alto de nuestra imagen y listo.
Ejemplo: <img src="holder.js/300x200">
Página oficial
Placehold.it // Es un script que funciona por parámetros, en el cual no debemos agregar librería algúna a nuestro código.
¿Cómo funciona?
Placehold, funciona mediante parámetros que nos permiten agregar texto, color, tamaño y formato.
Definir tamaño de imagen
Simplemente agregamos a la url las dimensiones como parámetro, primero ancho y después alto.
Ejemplo: Placehold.it - Quick and simple image placeholders350x150
Agregar texto a la imagen
Para añadirle texto a la imagen, demos agregar como parámetro: &text=nuestro+texto
Ejemplo: http://placehold.it/350x150&text=nuestro+texto
Definir formato de imagen
Podemos definir un formato de imagen, ya sea JPG, PNG, GIF, JPEG. Añadiengo al final &.formato
Ejemplo: http://placehold.it/350x150&text=nuestro+texto&.png
Añadir color
El script también nos permite añadir color a nuestra imagen, agregando después de las dimensiones /primercolor/segundocolor
Ejemplo: http://placehold.it/350x150/ffffff/000000&text=nuestro+texto
Página oficial
:encouragement: Saludos a todos, espero les sirva 8:.
Cuando estamos haciendo una página web, a veces necesitamos llenar espacios, por ejemplo el de un bloque de adsense que irá en cierta zona de nuestra web, pero es muy tedioso, creo yo, ir a photoshop y hacer una imagen de ciertas dimensiones para llenar dicho espacio.
Existen muchas formas de hacer esto en solo segundos, librerías para crear imágenes del lado del cliente o servicios que generan automáticamente la imagen con tan solo usar una url con parámetros.
Holder.js // Es una librería de Javascript.
¿Cómo funciona?
Simplemente debemos escribir en el apartado del src="" de nuestra imagen holder.js/300x200, las dimensiones en ancho y alto de nuestra imagen y listo.
Ejemplo: <img src="holder.js/300x200">
Página oficial
Placehold.it // Es un script que funciona por parámetros, en el cual no debemos agregar librería algúna a nuestro código.
¿Cómo funciona?
Placehold, funciona mediante parámetros que nos permiten agregar texto, color, tamaño y formato.
Definir tamaño de imagen
Simplemente agregamos a la url las dimensiones como parámetro, primero ancho y después alto.
Ejemplo: Placehold.it - Quick and simple image placeholders350x150
Agregar texto a la imagen
Para añadirle texto a la imagen, demos agregar como parámetro: &text=nuestro+texto
Ejemplo: http://placehold.it/350x150&text=nuestro+texto
Definir formato de imagen
Podemos definir un formato de imagen, ya sea JPG, PNG, GIF, JPEG. Añadiengo al final &.formato
Ejemplo: http://placehold.it/350x150&text=nuestro+texto&.png
Añadir color
El script también nos permite añadir color a nuestra imagen, agregando después de las dimensiones /primercolor/segundocolor
Ejemplo: http://placehold.it/350x150/ffffff/000000&text=nuestro+texto
Página oficial
:encouragement: Saludos a todos, espero les sirva 8:.
Última edición: