Comprueba tu sitio web en varios dispositivos. Herramientas Gratis !!

Comprueba tu sitio web en varios dispositivos. Herramientas Gratis !!

Cuando creamos un sitio web, es fundamental recordar que tendrá que verse en todo tipo de dispositivos, con un amplio abanico de distintas resoluciones. Llevar a cabo un buen diseño y maquetación que se adapte a todos estos dispositivos, es muy importante, no sólo por ofrecer una buena experiencia de navegación al usuario, también desde el punto de vista del SEO y la penalización que conlleva no ofrecer un buen responsive.

Por lo tanto es muy importante verificar cómo se ve nuestro site y cómo se comporta en esos distintos dispositivos.

What is my screen resolution

Hoy os dejo What is my screen resolution. Se trata de una intuitiva herramienta excelente para probar cómo se verá su sitio en diferentes dispositivos. Escribes la URL y eliges entre escritorio, móvil, tableta y televisión e incluso la orientación. Verás que al pulsar sobre desktop, mobile, tablet o televisión, te saldrán unas resoluciones por defecto, pero si luego quieres probar una resolución en concreto, puedes introducirla y comprobar la visibilidad del site. Muy interesante y además GRATIS !!!

COMPROBAR RESOLUCIONES

 

 

Template PSD GRATIS de Instagram

Template PSD GRATIS de Instagram

Como diseñadores, en numerosas ocasiones debemos realizar propuestas para clientes relacionadas con las redes sociales, entre ellas Instagram es una de las más activas a la hora de proponer nuevas ideas de negocio, a través de sus stories o publicaciones. En el caso de los stories no hace falta ningún tipo de template, pero si para las publicaciones, cuando queremos enseñar al cliente cómo quedará su post.

En esta ocasión he preparado un PSD que podréis descargar de modo gratuito, en resolución grande, con un tamaño de 1125x2436px. Todo guardado en capas para que podáis editar vuestros contenidos, con todos los elementos necesarios. Espero que os sea útil.

Veréis que en el ejemplo he utilizado mi perfil de Instagram, si os gustan mis post, podéis seguirme en Instagram @designgloobs

 

 

Instagram Template PSD

Instagram Template PSD

SÍGUEME EN INSTAGRAM      DESCARGAR PSD GRATIS

Recorta tus fotos en unos segundos GRATIS

Recorta tus fotos en unos segundos GRATIS

Nada más tedioso que ponerse a trazar una imagen para recortarla ¿verdad?, y ya si se trata de pelo, el trabajo se multiplica exponencialmente.

Bien, existe una página en la que sueltas tu imagen y te la recorta de una manera muy aceptable, te aconsejo que la pruebes, la velocidad es increíble, 5 segundos,  y para según qué trabajos, merece muy mucho la pena.

VISITAR LA WEB
¿Buscas un sitio donde inspirarte y con buenos recursos gráficos?

¿Buscas un sitio donde inspirarte y con buenos recursos gráficos?

Me gusta tener un listado de sitios a los que recurrir cuando tengo necesidad de encontrar algo distinto. Unas veces se trata de inspiración, otras alguna fuente que me sorprenda, ¿sabes de lo que te hablo verdad? 😉

Frebie es uno de los últimos que he añadido a mis favoritos y que hoy me gustaría compartir con vosotros.

AHHH !!!! Y ES GRATIS !!!!!

Aquí os dejo una muestra de alguno de los recursos que podéis encontrar, y al final del post el enlace para visitarlo, espero que sea de vuestro agrado.

VISITAR FREBIE
Fuente Facunda, retro-vintage. Descarga Gratis.

Fuente Facunda, retro-vintage. Descarga Gratis.

Facunda es una fuente gratuita creada por bybu.

Se trata de una fuente condensada ideal para titulares modernos con un aspecto retro-vintage. Cuenta con 5 estilos diferentes y es de uso público.
En principio os puede parecer que no hay diferencia en el estilo alternate, si os fijáis por ejemplo en la barra horizontal de la letra A, veréis que en la variedad alternate, en lugar de estar situada a mitad de altura, está un poco más alta.
A continuación os dejos una imagen para que podáis ver su aspecto y el botón de descarga.

(más…)

Slide Down Box Menu, un menú completísimo con jQuery y CSS

Menú con jQuery y CSS

Menú con jQuery y CSS

En este blog de diseño web hemos mostrado numerosos ejemplos de menú, y seguiré añadiendo, porque el menú constituye una parte esencial del diseño web, cada proyecto es un mundo y requiere un menú diferente.

La mayoría de las veces, el menú viene condicionado o bien por la cantidad de secciones que vayamos a utilizar o por los absurdos títulos larguísimos que nos pide el cliente. En el segundo caso es casi esencial convencerle que el titular de un menú ha de ser conciso y breve si queremos que funcione.

Hoy os dejo un menú que me ha parecido muy vistoso y útil. Se trata de un menú en el que al hacer rollover sobre la opción la casilla que contiene el titular se abre con un efecto elástico, en la zona superior aparece una imagen y el texto se desplaza hacia abajo, mostrando, cuando es preciso un submenú a su derecha.

Además de poder descargar todo el código de forma gratuita, podréis consultar con amplio detalle todos los pasos del proceso.

VER DEMO Y DESCARGAR MENÚ SLIDE DOWN BOX

Psd’s de Ribbons GRATIS !!!

Seguramente hayáis visto estos «ribbons» o cintas en multitud de diseños, un estilo retro con mucha fuerza en los actuales diseños.
Tanto para cabeceras, titulares, menús o botones, es un recurso al que siempre podréis recurrir.
En este pack podréis encontrar varios ejemplos en diferentes PSD’s, todos los archivos psd de Photoshop están bien repartidos en capas y pueden ser fácilmente editadas. También podréis ver que incluye  variaciones de color. Si queréis más variaciones y más tipos, tocará rascarse el bolsillo…

(más…)

Descárgate gratis el timeline de Facebook en PSD

Si te dedicas al diseño web, seguro que más de una vez te ha tocado diseñar la cabecera o alguna entrada para la página Facebook de algún cliente. Nada más últil que esta guía en psd para poder diseñar a tamaño exacto todos y cada uno de los elementos customizables de Facebook. Además, las imágenes vienen acotadas para mayor comodidad.

El psd está completo y bien serparado por carpetas para poder encontrar todo enseguida.

(más…)

Iconos gestuales para presentaciones de iPhone GRATIS !!!

Ante todo, mil disculpas por la caída de la web este fin de semana, afortunadamente ya está todo subsanado.

Hoy traemos unos iconos muy útiles para realizar presentaciones o storyboards de aplicaciones iPhone. Se trata de iconos gestuales para poder explicar la funcionalidad de nuestras apps o incluso de nuestras web para iPhone. Son 12 iconos en formato AI de uso libre.

Iconos gestuales para iPhone

Iconos gestuales para iPhone

 

 

DESCARGAR VECTORES GRATIS

RECURSOS PARA DISEÑO WEB. LIBROS GRATIS !!!

Recursos para diseño web. Libros

Recursos para diseño web. Libros

Soy uno de esos diseñadores que empezó en este mundillo a finales de los 90’s, poca formación había entonces y menos recursos. Hoy en día es impresionante la cantidad de recursos de diseño web que podemos encontrar en la red. OpenLibra es un portal en el que puedes encontrar todo tipo de libros técnicos. En lo que nos ocupa, diseño web, podemos encontrar materias como bases de datos, desarrollo web (CSS3, HTML5, diseño de interfaces,…), diseño, marketing, programación, redes, SEO, SEM, Web 2.0, Social Media,… Una verdadera mina de recursos gratuitos. Son libros en PDF listos para descargar, en español e inglés.
Estos son algunos libros en español que podréis encontrar, por supuesto, mejor echad un vistazo y buscad, porque hay muchos más:
(más…)

Recursos para diseño web Gratis !!! Mapas

La geolocalización forma parte habitual del diseño web y aplicaciones para teléfonos y tablets. En numerosas ocasiones nos vamos a encontrar con la necesidad de diseñar incluyendo mapas de Google Maps, controladores de mapas, ubicaciones, pins de localización…

En este post de recursos de diseño web, vais a encontrar una gran variedad de mapas y demás útiles para realizar con éxito vuestros diseños de geolocalización.

(más…)

Interfaz usuario en PSD gratis !!!

CrazyPixels nos trae un interfaz de usuario súper completo para descargar gratuitamente.

El archivo es un PSD, en el que podremos encontrar múltiples utilidades para nuestros diseños de interfaz. Botones de sonido, controles, formularios, calendario, sliders de avatares, mapas, cajas de diálogo,… Todo lo que necesitas para diseñar tu interfaz de usuario.
El diseño es muy limpio y elegante, como todas las capas vienen separadas y bien guardadas en su carpeta, no te será difícil costumizarlo a tu gusto o necesidad.

(más…)

Vectores, fotografías y PSD’s GRATIS !!!

Vectores, fotografías y PSD's gratis

Los que seguís este blog de diseño web, sabéis que intento en la medida de lo posible hacer referencia a todos aquellos sitios en los que podemos encontrar ayudas para nuestros diseño web.

Hoy por casualidad he encontrado esta página, Freepik, en la que podemos encontrar vectores, fotografías y psd’s gratis para descargar. La calidad es muy buena en los tres apartados, en el caso de los psd’s he de decir que al menos aquellos que he descargado están muy bien, sin capas acopladas y ordenadas por carpetas, ciertamente la calidad me ha sorprendido.

Os dejo a continuación el enlace para que la visitéis y os la descarguéis enterita 😉

Menús con Animación en CSS3 GRATIS !!!

Menús con Animación en CSS3 GRATIS !!!

Menús con animación en CSS3 Gratis

Menús con animación en CSS3 Gratis

Todo lo que antes era impensable en un diseño web, ahora es fácil con CSS3, y más si te ofrecen el código para que te lo descargues gratuítamente !!

Tympanus.net nos deja 10 ejemplos espectaculares para que hagas tu menú más atractivo para el usuario. Se trata de varios ejemplos que juegan con los tamaños y animaciones de fuentes, colores e iconos, seguro que encuentras el que andabas buscando !!.

500 pinceles Grunge para Photoshop GRATIS !!!

500 pinceles Grunge para Photoshop GRATIS !!!

Diseño Grunge

Diseño Grunge

A la hora de hacer un diseño web, el uso de pinceles nos puede ayudar a conseguir efectos que de otro modo, nos llevaría horas conseguir.

Hoy traemos 500 pinceles Grunge, que seguro que os van a sugerir alguna buena idea.

Y si os va lo grunge, en este post podréis encontrar fuentes grungetexturas grungefondos grunge, …

Además tenéis un post dedicado exclusivamente al diseño grunge.