Carlos Leopoldo » Diseño Web

Reglas para crear un logotipo

Carlos Leopoldo — Tue, 07 Oct 2008 04:06:48 +0000

Si ya leiste cómo hacer un logotipo paso por paso ahora sería bueno que le echaras un vistazo a las reglas para la creación de logos, escritas por TannerSite y traducidas por Blog Vecindad, son un total de 45 reglas y aquí les pongo las primeras 10:

No utilizar más de tres colores.
Elimina todo lo que no sea absolutamente necesario.
La tipografía debe ser fácil de leer, aún para personas de la tercera edad.
El logo debe reconocerse al instante.
Crea una forma única para el logo.
Ignora completamente lo que tus padres o espos@ piensan acerca del diseño.
Confirma que el logo sí convence a más de tres personas.
No combines elementos basados en logos populares y digas que es un trabajo original.
No utilizar clipart bajo ninguna circunstancia.
El logo debe verse bien en blanco y negro.

Vía frogx.three.

Otros artículos relacionados

Editores CSS gratis

Carlos Leopoldo — Thu, 25 Sep 2008 04:26:56 +0000

Otra vez Speckyboy ha publicado una de sus listas muy buenas, en este caso 7 editores CSS gratuitos, los 7 editores son muy buenos, a ti te toca elegir el mejor:

Simple CSS, sitio de descarga.
TS Webeditor (tswebeditor), sitio de descarga.
A Style CSS Editor, sitio de descarga.
CSSED - “A GTK-2 CSS Editor”, sitio de descarga.
ELEDO - Eledicss, sitio de descarga.
JustStyle CSS Editor, sitio de descarga.
TopStyle Lite, sitio de descarga.

Otros artículos relacionados

Diseño de comentarios que todo diseñador web tiene que ver

Carlos Leopoldo — Thu, 25 Sep 2008 03:49:56 +0000

Hace tiempo en Blog design Blog habían publicado un excelente listado con 30 muy buenos diseños de comentarios para blogs y ahora han publicado otro listado con otros 30 muy buenos diseños, entre los que se encuentra mi blog (este blog) en 5º lugar.

A mi especialmente me gustó mucho el diseño de los comentarios del blog de MacRabbit, me parece muy buena idea alternar la alineación entre derecha e izquierda, muy al estilo de iChat en Mac OS.

Diseño de los comentarios de MacRabbit

Si deseas ver la lista completa entra en: 30 More Must See Comment Designs for Blog Designers

Otros artículos relacionados

Comprueba que tu código (X)HTML CSS sea igual al diseño

Carlos Leopoldo — Sun, 21 Sep 2008 23:11:06 +0000

Si cuando diseñas un sitio web primero acostumbras a realizar el diseño en Photoshop, Fireworks, etc., seguramente te ha pasado que te cuesta trabajo hacer coincidir el tamaño y la distribución de los elementos de la página con el diseño original, pues hay una manera de comprobar que todo vaya bien con un plugin.

Se llama Pixel Perfect y se trata de una extensión para la add-on Firebug de Firefox, de hecho hay muchas extensiones buenas para Firebug.

Con Pixel Perfect puedes sobreponer una imagen sobre un sitio web, es decir que puedes poner el diseño original en JPG o PNG para comprobar si se respetan las medidas originales, márgenes, distribución de los elementos, etc, aquí puedes ver un video de demostración.

Para instalarlo debes tener primero Firebug, si no lo tienes déscargalo, y enseguida descarga Pixel Perfect.

Otros artículos relacionados

Crea un Slider a partir de un campo Select en tus formularios

Carlos Leopoldo — Mon, 08 Sep 2008 03:24:09 +0000

Si te gustaría cambiar los campos Select, mejor conocidos cómo cajas de selección, de los formularios HTML por un bonito Slider o barra deslizante, esto es posible gracias a un plugin para jQuery UI llamado Slider Component, en la siguiente imagen podemos ver un ejemplo de cómo podemos convertir 2 Select Boxes en un Slider que está más abajo de color verde.

De Select Box a Slider

Lo mejor de todo es que para hacerlo es muy fácil, sólo debemos de tener nuestro Select Box cómo por ejemplo el siguiente:

Selecciona la velocidad:

Adjuntar previamente el Script de jQuery UI y Slider Component a nuestro documento HTML y llamar a la función por medio de este código JavaScript que vamos a poner entre las etiquetas y de nuestro documento HTML.

$('select#speed').accessibleUISlider();

Así de fácil es. Enlace para descargar Slider Component y jQuery UI.

Otros artículos relacionados

Crea menús CSS para tus diseños de manera online

Carlos Leopoldo — Thu, 04 Sep 2008 08:39:37 +0000

Si estás cansado de hacer los menús para tus diseños web escribiéndo código CSS manualmente o si no sabes nada de CSS te recomiendo CSS Menu Builder que es un sitio web donde puedes crear tus menús CSS, este sitio te permite crear más de 30 tipos de menú horizontal, o más de 700 menús verticales con ilimitadas combinaciones de color.

Menús horizontales en CSS Menu Builder

Todo esto con una interface muy sencilla de usar, así que ni siquiera requiere que tengas conocimientos de CSS y sólo algo básico de HTML para poder insertar el menú en tus diseños.

Otros artículos relacionados

Limpia tu código CSS

Carlos Leopoldo — Tue, 02 Sep 2008 06:31:02 +0000

A veces cuando hacemos algo en CSS escribimos código o selectores innecesarios, eliminar esos selectores es algo que nos ayuda a reducir el tamaño de los archivos CSS, pero muchas veces hacerlo manualmente es algo tedioso, para eso existen herramientas que nos facilitan la vida, se trata de CSS Redundancy Checker que es un sitio web que muestra los selectores CSS redundantes y que debemos eliminar. Enlace: CSS Redundancy Checker.

Otros artículos relacionados

Google Search Masters 2008 en México

Carlos Leopoldo — Thu, 14 Aug 2008 12:10:51 +0000

Después de haber realizado el Google Developer Day 2008 en México al cual tuve la oportunidad de asistir, Google nos trae otro evento, se trata del Google Search Masters 2008, este evento se realizará el 22 de Septiembre de 2008 en el Centro Banamex de la Ciudad de México.

Según el sitio de Google Search Masters 2008 el evento consiste en:

El programa incluye presentaciones con algunos de nuestros más reconocidos expertos en el tema de búsquedas, dónde presentarán las herramientas que Google pone a disposición de los Webmasters para mejorar el desempeño de sus sitios, como son: Aplicaciones de Búsqueda Google, Motores de Búsqueda Personalizados, el Centro de Webmasters, las Herramientas Webmaster y el Foro de Debates para Webmasters.

Así que si te interesa asistir no lo pienses más e inscribete aquí, no tiene algún costo. Enlace: Google Search Masters 2008.

Otros artículos relacionados

Las 10 mejores tablas diseñadas con CSS

Carlos Leopoldo — Thu, 14 Aug 2008 07:10:48 +0000

Las tablas llegaron a ser uno de los objetos más difíciles y polémicos en el diseño web por la gran candtidad de requisitos la falta de compatibilidad entre navegadores y su uso excesivo, pero en Smashing Magazine han publicado un excelente post sobre las formas más fáciles y válidas de crear tablas HTML y darles estilo con CSS.

Otros artículos relacionados

Aumenta el tamaño de la fuente con jQuery

Carlos Leopoldo — Fri, 08 Aug 2008 15:58:52 +0000

Existe un nuevo plugin para jQuery llamado fontSizer, este plugin ha sido desarrollado entre 2 desarrolladores chilenos: Jorge Epuñan y Rodrigo Augosto, este plugin sirve básicamente para manejar el aumento y disminución del tamaño de fuentes en una página web, y el usarlo en tu sitio web o blog es muy sencillo, solamente debes de descargar el plugin FontSizer y jQuery en cualquier versión superior a la 1.2:

Adjuntar jquery.js y jquery.fontSizer.js entre las etiquetas
Definir id’s para ambos links, por ejemplo #aumentar (+) y #disminuir (-)

Inicializar el plugin, como en el ejemplo:

$(document).ready(function(){
$(’#aumentar).fontSizer({
action: "up"
});
$(’#disminuir).fontSizer({
action: ‘down’,
});
});

Eso es. El único parámetro obligatorio es indicar la acción de cada link mediante action. Los parámetros son:
action: “up/down” (requerido).
elements: “elemento” (un id, class o etiqueta donde actuará el cambio de tamaño de fuente).
increment: número (en cuántos pasos serán el cambio de tamaño; por defecto es de 1 en 1).
max: número (tamaño máximo del tamaño de fuente; por defecto es 30px).
min: número (tamaño mínimo del tamaño de fuente; por defecto es 8px).

Puedes ver un ejemplo funcionando y puedes descargar el plugin.