Web Designer Wall ha publicado un excelente documento sobre SEO orientado a diseñadores, personalmente siempre he pensado que el diseñador web debe pensar no solo en lo artistico cuando tiene a cargo el diseño de un sitio web, si no tambien en la usabilidad y en los factores que ayudan a un sitio a ser conocido, como lo son los bucadores, en el articulo mencionan los errores mas comunes de los diseñadores.

En el mismo articulo hacen una encuesta y me sorprendieron los resultados, la pregunta es:

Como diseñador piensas en los requerimientos de SEO?

• Si 73% (4,606)
• No 11% (607)
• Lo siento, no se que significa SEO 16% (1,007)

Mi sorpresa es la tercera opcion como puede ser que los diseñadores “web” no sepan que es SEO, si desafortunadamente eres uno de la lista en la wikipedia puedes encontrar el significado e importacia del SEO.

En el articulo los puntos a destacar segun mi humilde opinion son:

• How Search Engines Work?
• Top 9 SEO Mistakes Made by Designers and Developers
• Don’t Be Afraid of Internal Linking
• Don’t Be Dense About Keyword Density

Enlace: WDW, SEO Guide for designers

Aqui esta la tercera entrega de quick notes en esta ocación el tema es 5 notas sobre diseño web.

Loge Ease

No podias dejar pasar esta excelente utilidad que ya fue publicada en infinidad de blogs, es logo ease es un excelente sitio donde podras crear el logo de tu empresa gratis con un acabado muy profesional.

CSS, Clearing floats

El uso de multiples columnas usando capas ha hecho que el uso de la propiedad float de CSS sea muy utilizado sin embargo existen alternativas al float, mas usables ya que al usar float si utilizas mas elementos necesitaras utilizar la propiedad clear, aqui un ejemplo: Como usar la propiedad float de CSS

ScrnShots

Es un excelente sitio donde puedes compartir gratuitamente las capturas de pantalla que saques y que te hayan inspirado por alguna razon, ya sea un sitio web o una captura de tu escritorio, en fin el slogan del sitio lo dice todo: Share your inspiration.

Aqui les dejo algunos tags de capturas que interesantes que encontre en el sitio: design, georgia y navigation

50 blogs con diseños excelentes

Otra de Smashing magazine, es una recopilación de 50 blogs con excelentes diseños de diferentes estilos grunge, vectores, minimalistas, etc..

WPPAL, editor de diseños para wordpress

WPPal es un sitio que posee un poderoso editor de diseños para wordpress completamente online, es gratuito, actualmente tienen 6 diseños los cuales puedes modificar a tu gusto y posteriormente descargarlos completamente gratis.

Espero y les guste, ya ando preparando la 4 entrega e igual viene sobre diseño web.

Photoshop no lo es todo aunque es mejor que el Adobe Fireworks, pero pues mucho igual preferimos el Fireworks para cosas sencillas y es que no es un software para despreciar.

Este tutorial bastante sencillo nos enseña a crear stickers con la punta levantada, tal y como la imagen del post anterior lo tiene (5000 fondos de pantalla para iPhone).

En el tutorial tambien puedes descargar el archivo fuente PNG para modificarlo y practicar.

Enlace: Firetuts, Tutorial Creating a realistic peelable sticker effect with Fireworks

La semana pasada en la segunda entrega de Quick Tips: sobre desarrollo web, hacíamos referencia a un articulo de Ajaxian sobre las variables CSS y su posible inclusión en la siguiente versión de este lenguaje pero eso esta aun en veremos.

Mientras tanto nosotros ya podemos gustar de la bendición de los que son las variables CSS usando PHP, pero como? sigan estos simples pasos:

Creamos nuestros archivo CSS con nombre “default.css”

/* globals */
*       { margin:0; padding:0; }
body    { color:$body_text_color; font-size:$body_font_size; }

Ahora viene el codigo php que va aplicar los valores de las variables, en el archivo llamado “stylesheet.php”.

/* get the stylesheet */
$stylesheet = @is_file($_GET['stylesheet']) && strtolower(substr(strrchr($file_name,’.'),1)) == ‘css’ ? $_GET['stylesheet'] : ‘default.css’;

/* set the header information */
//will be output as css
header(’Content-type: text/css’);
//set an expiration date
$days_to_cache = 10;
header(’Expires: ‘.gmdate(’D, d M Y H:i:s’,time() + (60 * 60 * 24 * $days_to_cache)).’ GMT’);

/* set the dynamic information */
//default css variable information
$default = array(
	‘body_font_size’ => ‘16px’,
	‘body_text_color’ => ‘#00f’
);

//red css variable information
$red = array(
	‘body_font_size’ => ‘10px’,
	‘body_text_color’ => ‘#f00′
);

/* extract the propery array’s information */
extract($_GET['theme'] && ${$_GET['theme']} ? ${$_GET['theme']} : $default);

/* load in the stylesheet */
$content = preg_replace(’/$([w]+)/e’,'$0′,@file_get_contents($stylesheet));

/* spit it out */
echo $content;

Eso es todo ahora lo que cambia en nuestro código HTML es cuando hablamos a la hoja de estilos en vez de pedir el default.css vamos a hablar al “stylesheet.php”, ejemplo:

<link rel="stylesheet" type="text/css" href="/stylesheet.php">

Eso es todo el resultado de nuestro CSS debe ser el siguiente:

/* globals */
*		{ margin:0; padding:0; }
body		{ color:#00f; font-size:16px; }

Nota: El archivo default.css jamas se va a sobreescribir con los valores de las variables, simplemente cuando hablamos al stylesheet.php este procesa el CSS reemplazando las variables por valores y se lo devuelve al servidor ya con valores para que sea interpretado, sin haber modificado el archivo CSS.

Via: davidwalsh, CSS Variables using PHP (en ingles)

El diseño web sencillo no es, afortunadamente, digo eso porque si sencillo fuese no habría como apasionarnos con el como yo estoy, desde que me enfoque en esto me ha apasionado el diseño web, pero no es solo dibujos, debes tomar en cuenta muchas cosas, y Smashing Magazine les han tomado en cuenta y por eso comparte lo que para ellos son los 5 principios para un diseño web efectivo.

Estan en ingles si lo quieren ver sigan la liga, los temas son:

• Utilizar un principio de mercadotecnia efectivo
• Experimentar con colores
• Balanceo de tu diseño
• La claridad de lo que ofreces
• Dirige a tus usuarios a los que necesitan realmente

Las traducciones que hice no son textuales, son mas que nada explicaciones de los temas.

Enlace: 5 more principles of effective web design

Aquí uno de esos post que hace rato que no hacia y tratare ahora si de realizarlos mas seguido, se trata de 5 notas rápidas en este caso sobre desarrollo web.

Open Source Rails

Ruby on Rails ese lenguaje de programación que desde que salio dio de que hablar, si tu eres uno de los que le intereso y se metio a conocer y programar con Ruby este sitio te puede interesar recopilan aplicaciones Open Sources creadas con Ruby on Rails.

Consejos para optimizar consultas MySQL

La mayoría del sitios en Internet mas conocidos usan MySQL pero mantener una base de datos como por ejemplo de la twitter no es fácil, asi que hay que optimizarla al máximo, aqui unos tips para optimizar tus consultas MySQL.

Creando menús con efecto kwicks con jQuery

Excelente tutorial para crear menús con efecto kwicks, este efecto es el mismo que usa mootools en su portada en los cuadritos de colores.

Snipplr Code 2.0

Snipplr se trata de un servicio que recopila snippets muy usados en sitios web 2.0, los snippets son recortes de código fuente, si estas empezando en la programación este tipo de recursos son perfectos.

63 tips para optimizar tu codigo PHP

PHP otro código muy utilizado en Internet su gran ventaja es que es gratuito, pero también necesita de ser optimizado recuerda que la experiencia del usuario en tu sitio web es tu valor agregado, un sitio lento en sus procesos no sirve, asi que aqui hay 63 tips para optimizar tu codigo PHP. (en ingles)