uvedobles.com» Aprender

Anatomía de una tipografía

dedavid — Thu, 20 May 2010 05:52:13 +0000

La imagen superior, que se amplía al pulsar sobre ella hasta unos considerales 1920 x 1200 pixelazos, se trata de un póster donde se muestran casi todos los conceptos inherentes al diseño de tipos de letra, tipografías o fuentes.

No es un compendio para clasificar las fuentes atendiendo a su tipología o mensaje, es un descriptor de la física de cada letra, de los rasgos que la conforman.

El póster se encuentra en inglés pero esto no debe ser un handicap. Gracias a él refrescaremos la palabrería utilizada en diseño para describir a una fuente, desde los conceptos como centro óptico, linea base, vértice. bowls, etc. Si te la imprimes o la utilizas de escritorio, aprenderás a hablar como un auténtico diseñador, es decir con tipográfica propiedad.

Páginas relacionadas con este artículo:

Comprobador de RSS

dedavid — Tue, 13 Apr 2010 07:06:25 +0000

Los RSS o feeds son un sistema muy popular para el movimiento de información, noticias o titulares de las mismas entre una página web y un usuario e incluso entre diferentes páginas webs. Este sistema se ha popularizado gracias a ser un componente intrínseco de los blogs y poseer un carácter digamos que social.

El RSS es un sistema que en marketing se agruparía dentro de los PUSH, pues es el RSS el que va a buscar al usuario, obviamente una vez este se ha suscrito, la página web en sí es un método PULL donde al contrario que en los PUSH es el usuario el que tiene que ir a buscar la información con su navegador.

No vamos a entrar en este artículo a hablar de las numerosas bondades del RSS pero sí que vamos a ver un sencillo y práctico validador de RSS online.

Para comprobar si un determinado Feed cumple con las reglas de dicho formato existen muchas opciones, algunas de escritorio pero para nosotros la mejor es Feed Validator, una aplicación online que te validará cualquier dirección de internet que contenga un RSS. Toma buena nota de la dirección: http://beta.feedvalidator.org/

En la captura anterior, hemos realizado la prueba con un cliente nuestro, cablematic.com donde hemos colocado un nuevo generador de RSS para todas y cada una de las familias de productos, al intentarlo validar podemos ver diversos errores detectados en la estructura del FeedRSS, el primero y realmente importante es la utilización de signos [] también denominados brackets en el tag interno del title de la noticia del RSS.

Para evitar este error hay que escapear la salida de todos los textos, míra como lo hemos realizado:

$rssOutput .= ‘’.'<![CDATA['.$lng_ref_min.' '.$productRef.' '.$productName.']]>’.'’.”\n”;

Es decir tras el tag ponemos el

El resto de errores que nos lanza Feed Validator no son errores como tal sino sugerencias para intentar compatibilizar el feed con el mayor número de lectores de RSS. Por ejemplo la primera nos informa de que existen demasiadas entradas con la misma fecha y hora. El segundo que para mejorar la compatibilidad no se incluya HTML dentro de los feeds, pero nosotros en este caso no buscamos la mayor compatibilidad si no que quien los vea los vea bien y a todo lujo de detalles, un producto bien presentado vende mucho más que uno que se vea con un Amstrad CPC a sólo texto.

Enlace: http://beta.feedvalidator.org/

Páginas relacionadas con este artículo:

Buscador de libros electrónicos gratis

dedavid — Tue, 23 Mar 2010 06:40:18 +0000

Menudo descubrimiento, con este buscador podrás encontrar libros electrónicos en formato PDF de prácticamente cualquier materia, muchos son totalmente gratuitos otros no lo sabrás y si decides descargarlos estarás infringiendo la ley, lo difícil es saber si estos tienen o no copyright pues por ejemplo, hemos podido descargar la trilogía de Stieg Larsson, La chica que soñaba con una cerilla y un bidón de gasolina así sin más.

Así pues sin una política clara será tu sentido común el que te diga si lo que te bajas es legal o no, menudo tema después que el gobierno decida poder cerrar páginas así sin más, en fin. Esta página está fuera de nuestras fronteras y seguro que no la cerrarán. En ella encontrarás libros tanto en lengua castellana como en otras lenguas, otro uso es el de conseguir manuales técnicos o libros sobre programación, hemos buscado “php” y “javascript” y hemos conseguido excelentes resultados.

Así que toma buena nota: http://mega-pdf.com/

Páginas relacionadas con este artículo:

Posicionar tienda online 1

dedavid — Thu, 18 Mar 2010 15:40:07 +0000

Posicionar tienda online en Google

En esta serie de artículos sobre posicionamiento en buscadores de tiendas online vamos a tratar algunos de los métodos en cuanto a programación de estructuras internas se refiere para conseguir una mayor optimización de las tiendas virtuales.

Estos artículos no tratan de cubrir la totalidad de opciones y metodologías que existen para posicionar mejor una tienda online. Pretenden ser tan sólo un reflejo a modo de concepto de las novedades en cuanto a posicionamiento en Google que vamos a ir incorporando a nuestros sistemas de tiendas online durante este año 2010. Partimos de una base previa ya consolidada a lo largo del año 2009 donde hemos introducido entre otras nuevas prestaciones el uso de permalinks 100% limpios y la generación de los metatags de descripciones y palabras claves en base a una estudiada fórmula así como un novedoso sistema de ahorcado de familias de productos que permite generar tantas webs satélites como subfamilias de producto tengas en tu tienda online, algunos de estos sistemas los comentaremos en un futuro post.

Así pues tras esclarecer un poco el ámbito de estos artículos vamos a proceder a descubrir el contenido de este primer capítulo: los denominados Microformats, vamos a tratar de conseguir que aquellas tiendas online y catálogos de productos en internet que se basan en nuestro sistema de tiendas online ecOOmmerce.com mejoren sustancialmente su posicionamento en Google si bien la información aquí contenida puede ser aplicable a la práctica totalidad de sistemas de tiendas online, aunque bajo algunos casos como el del extendido OScommerce la estructura interna del mismo, en exceso anticuada puede ser un escollo insuperable, lastrando la escalada vertical de posiciones en el buscador.

Nuestro sistema de tienda online se beneficiará de los Microformats

ecOOmmerce.com es nuestro sistema de tiendas online, en la futura versión 3.8 cuya fecha estimada de salida es en mayo del 2010 vamos realizar especial hincapié en los denominados Microformats con el objetivo de optimizar las capacidades en cuanto a posicionamiento de los productos de nuestros clientes en el buscador Google.

Durante este mes de marzo estamos ultimando la versión 3.7 que contará con un nuevo sistema de carrito de la compra y un avance significativo en la construcción interna de la estructura HTML o DOM de la tienda online.

Experiencia previa de los microformats en sistemas de blog automático

Si bien esta nueva funcionalidad de ecOOmmerce.com nos proporcionará resultados en un tiempo antes vamos a poder contar con la experiencia previa en otra plataforma nuestra cOOmmunicate.com un sistema de generación de blogs automático que se sincroniza directamente con ecOOmmerce.com mediante RSS, o con cualquier otro sistema que genere RSS, su funcionalidad es realizar un blog automático con las novedades de productos con el objetivo de conseguir una mayor visibilidad del conjunto.

¿Qué son los Microformats o Microformatos?

Los microformats son un parche popular que se está utilizando en internet desde no hace mucho tiempo para volver la web algo más semántica, es decir que un contenido se intente autodefinir y clasificar por si mismo, anteriormente decimos parche pues no se trata de ningún sistema o programación específica creada desde cero, tan sólo se trata de una metodología de trabajo que pretende aprovechar los comandos o tags habituales del lenguaje HTML para definir algunas estructuras semánticas básicas y no tan básicas. Seguro que con esto no te has aclarado del todo, no te preocupes a nosotros nos pasó igual, lo mejor, como no, un ejemplo clarificador:

Ejemplo de uso de Microformats

Producto: Sartén 24 cm. de diámetro con antiadherente
Marca: Aceroxidados
Familia: Utensilios de cocina
Descripción del producto:

Moderna cacerola que hace uso de los máximos estándares de calidad existentes en la industria,
fabricada mediante un complejo proceso químico que le confiere una aleación y blablabla…

Precio de venta:
19.95e.

Gracias al uso del delimitador “div” combinado con un nombre de clase llamado hProduct buscadores como Google, Yahoo, navegadores como Firefox, y programas que automatizan procesos etc. saben que el texto “Sartén 24cm.” delimitado por el tag de HTML

es el nombre o descripción de un producto, mientras que precio es tan sólo un número, y por tanto la primera parte es semántica, es decir saben de que va y la posicionan como tal, es decir como un producto.

Con esto ya hemos utilizado el microformat hProduct para facilitar la tarea a buscadores y otros engendros automatizadores, a partir de aquí vamos a implementarlo en nuestro programa de tiendas online ecOOmmerce.com adaptando como no el diseño estructural y capeado de las fichas así como los nombres de las classes que utilizamos para mostrar la ficha de productos al cliente.

Vamos ahora a ver todas las subclases del microformato hProduct para estudiar que podemos aplicar.

Microformato hProduct y sus subclases

hproduct: Esta es la clase que autodefine que estás en una ficha de producto
brand: con esta clase identificamos la marca del producto, si existiese otro microformato del tipo hCard activo, esta última debería contener el nombre del fabricante y brand tan sólo la marca.
category:: la categoría o familia de productos a la que pertenece el producto, puede utilizarse más de una vez en la misma página para tiendas online multifamilia
price:: el precio del producto, puede contener también un “55.90eur. ahorre hoy un 5%” es decir frases promocionales
description:: la descripción completa del producto.
fn:: el nombre del producto
photo:: la clase para fotos que debería aplicarse a los tags o que contenga la foto, pueden existir más de uno
url:: esta clase debería asociarse a los tag que enlacen con la página de detalle del producto
review:: al igual que url pero enfoca a la página que contiene análisis del producto no obstante se puede usar la clase mayor hReview. Puede contener varios.

Enlaces:

Microformatos en general: http://en.wikipedia.org/wiki/Microformat

Microformato para productos: http://microformats.org/wiki/hproduct

Microformato para productos según Google: http://www.google.com/support/webmasters/bin/answer.py?answer=146750

Páginas relacionadas con este artículo:

Saber que aplicaciones consumen más recursos

dedavid — Tue, 16 Mar 2010 07:50:14 +0000

Un apunte ultrarápido que nos permitirá saber que aplicaciones y que usuarios están consumiendo más recursos en tu máquina, esta funcionalidad es válida tan sólo para máquinas Linux o basadas en Unix, se trata del comando top.

Abre una terminal e introduce el comando: top

Te aparecerá una pantalla como la que te mostramos en nuestra captura,mostrándote ordenadas las aplicaciones o procesos de mayor a menor consumo de recursos, en nuestro caso lo que más está consumiendo es Firefox (tenemos más de 15 pestañas abiertas), con un 32% de la cpu y un 6,4% de la memoria RAM. Vemos curiosamente que XORG, la interficie gráfica que incorpora Ubuntu utiliza un 1% escaso, a la que hay que añadir Compiz con un 1,4% gt-window con un 0,3% y gnome-panel con un 0,9 total, que tenemos una interficie gráfica de las de quitar el hipo, gestionando 2 pantallas de diferente resolución y un total de 4 escritorios virtuales sin pestañear, una interficie superior en muchos aspectos a la de Mac OSX (nuestro exposé es bastante mejor) .

Este comando en principio no requiere permisos de superusuario.Si bien si quieres ver el consumo de procesos que corren bajo root, como Apache o Mysql deberás ejecutarlo como superusuario, así que casi mejor que lo ejecutes como “sudo top” (te pedirá clave)

Ideal para monitorizar servidores basados en Linux a los que tengas acceso mediante SSH. Así que apunta hacia tu servidor virtual, tu servidor privado y a monitorizar para ir optimizando, que es gerundio.

Páginas relacionadas con este artículo:

Formato pubDate en RSS

dedavid — Fri, 05 Mar 2010 07:39:35 +0000

Generador de blogs automáticos

Actualmente estamos trabajando en nuestro nuevo proyecto cOOmmunicate.com, cOOmmunicate es un sistema que permite generar blogs automáticos partiendo de cualquier fuente de noticias RSS.

El objetivo de cOOmmunicate es el de mejorar el posicionamiento de producto ofreciendo a nuestros clientes un sistema de blogs automático que no precisa interacción del cliente una vez configurado, es decir el mismo consulta clasifica y actualiza el blog por si sólo. Con cOOmmunicate podrás tener un blog sobre tu empresa o sector sin tener que dedicarle nada de tiempo, un blog que recibirá cientos de visitas al día en muy poco tiempo, una visita siempre puede convertirse en un comprador en potencia.

En nuestro proyecto vamos a utilizar el fichero RSS generado en una web de un cliente nuestro, Cablematic.com un mayorista de armarios rack y todo tipo de cables que utiliza nuestro sistema de tiendas online ecOOmmerce.com, el resultado será un blog con todas las novedades que introduzca el cliente en el backoffice.

Tras esta introducción comercial sobre nuestro nuevo producto vamos a la parte más técnica y aquella a la que podéis extraer un mayor provecho ya que es en este punto del desarrollo cuando hemos detectado la necesidad de convertir las fechas entre formatos mysql y formatos de fecha en RSS, a partir de aquí y tras conseguir realizar las correspondientes fórmulas de conversión de fechas publicamos el código básico para aquellos que tengan la misma necesidad.

Manejo del formato de fecha pubDate

El pubDate es una etiqueta de los archivos de sindicación de contenidos RSS, en esta etiqueta se coloca la fecha del artículo o post y posee un formato un tanto especial :

Sat, 09 Jan 2010 00:00:00 +0100

Sat, 09 Jan 2010 00:00:00 GMT

Es decir:

Día de la semana coma número de día dentro del mes nombre del mes con tres letras año con cuatro números hora dos puntos minutos dos puntos segundos y GMT.

El problema o dificultad reside en como generar y manipular dicha fecha en PHP pues no existe un comando directo, si bien esto es una tarea más bien fácil os dejamos un apunte para aquellos que estén atascados con las conversiones de fecha en mysql, veamos un ejemplo:

Disponemos de una fecha en formato “date” de Mysql ej: 2010-01-01 y necesitamos convertirla a formato RSS para generar un rss de novedades de producto.

Para conseguir esto es suficiente con el siguiente par de líneas de código:

$mysqlDateStr = strtotime($mysqlDate);
$pubdate = date(‘D, d M Y H:i:s O’,$mysqlDateStr);

Este conversión la realizamos en dos pasos, primero convertimos en string el formato de mysql date para luego aplicarle el formato deseado, que no es otro que el formato pubDate de los RSS mediante el comando date de php.

En cambio si lo que tenemos en el origen es una fecha en formato TimeStamp deberemos utilizar el siguiente código:

$year = substr($timestampDate, 0, 4);
$month = substr($timestampDate, 4, 2);
$day = substr($timestampDate, 6, 2);
$hour = substr($timestampDate, 8, 2);
$min = substr($timestampDate, 10, 2);
$sec = substr($timestampDate, 12, 2);
$pubdate = date(‘D, d M Y H:i:s O’, mktime($hour, $min, $sec, $month, $day, $year));

En este código lo que hacemos es extraer cada parte del string en formato timestamp de mysql y lo convertimos en una variable aislada para finalmente formar una cadena de texto string con el comando de php date.

Ahora vamos a tratar el mismo problema a la inversa, es decir vamos a convertir una fecha en formato pubDate a un formato mysql:

$mysqlDate = date(‘Y-m-d H:i:s’,strtotime($pubDate);

Con este pequeño apunte ahora nos será más fácil y rápido convertir estas fechas.

Páginas relacionadas con este artículo:

Asignar el mismo valor a varias variables

dedavid — Thu, 04 Mar 2010 16:13:23 +0000

Hoy hemos descubierto como asignar el mismo valor a un número determinado de variables de una tacada, estando en pleno proceso de desarrollo de una nueva verisón del carrito de la compra para nuestro sistema de tiendas online ecOOmmerce.com teníamos el siguiente código que corresponde a la asignación de datos de cliente para un pedido:

$address_name =
$address_address =
$address_cp =
$address_city =
$Saddress_location =
$Saddress_country_code =
$order_address =
$Saddress_name =
$Saddress_address =
$Saddress_cp =
$Saddress_city =
$days_delayed =
$expireOrderDate =
$creatorUser = ‘ecOOmmerce.com’;

Si te fijas las variables aún están definidas, pues algunas son fruto de un cálculo y teníamos que desarrollar el código, sin querer hemos grabado el archivo así, y al realizar un recargar en el navegador para ver el resultado donde pensábamos que apache nos iba a tirar un error de PHP por no tener esas variables definidas a excepción de la última PHP ha asumido que todas tienen el valor ecOOmmerce.com, el valor de la última, así amigos ya sabeis, para hacer una multideclaración de variables en PHP podeis utilizar este método, muy curioso, por cierto PHP 5 y Apache 2:

$variable1 =
$variable2 =
.
.
.

$variableN = ‘mismo valor”

Páginas relacionadas con este artículo:

Forzar la aparición de las barras de scroll con CSS

dedavid — Sat, 27 Feb 2010 09:33:24 +0000

En alguna ocasión te encontrás el siguiente escenario donde en determinados proyectos existe una clara molestia visual producida por los constantes salto en la maquetación del contenido que se desplaza unos 20 píxeles hacia tu izquierda al navegar entre una página y otra.

Este salto es normalmente producido por la existencia o no existencia de la barra de desplazamiento vertical o barra de scroll, una barra que quieras o no ocupa su espacio en el universo y como dice un tal arquímedes con su teoría sobre los líquidos esta barra desplaza el contenido tantos píxeles como volumen tiene la misma.

Aunque si bien este es un comportamiento natural, predecible y argumentable hacia tus clientes, el efecto que produce ese desplazamiento de contenidos es del todo indeseado y más aún cuando suele suceder desde la propia página de inicio o home donde muchos maniáticos de la comunicación, entre los que me incluyo, quieren poco texto poco espacio para evitar un exceso de información e invitar al cliente a profundizar, en páginas con más contenido y por tanto con la dichosita barra de scroll.

Pues bien, hemos acudido al dios salvador, que no es otro que el CSS y tachán la solución en tres líneas, y tan fácil como forzar la aparición de las barras sí o sí.

El código CSS:

html {
/* forzado de scrollbars */
min-height: 100%;
margin-bottom: 1px;
}

Páginas relacionadas con este artículo:

Andresito, Andresito…

dedavid — Fri, 26 Feb 2010 08:28:08 +0000

Hoy me he llevado una gran desilusión, o no, según se mire, hoy a primera hora tras ver ciertas prácticas de Black Seo en uno de mis venerados gurú, gurúes que son más bien pocos porque en su mayoría a mi modo de ver y entender estos, que son muchos y no pongo la lista porque no se acabaría, suelen ser payasos mediáticos que venden poco más que humo con sus teorías egocentristas-marquetinianas sobre lo que debe ser la red y punto.

En defensa del buen gurú de Andrés Nieto y antes de exponer su BlackSeoAda diré que si no es el mejor spanishman en sistemas WordPress es porque no existe campeonato alguno, su colosal esfuerzo divulgativo sobre la materia es motivo de encumbramiento, un esfuerzo tremendo y del que yo como muchos otros desarrolladores he aprendido mucho leyendo sus preciados artículos, su web es como una enciclopedia sobre WordPress. Eso para mi es ser gurú.

Andresito, Andresito…

¡Hombres sin ombligo! desarrolladores mileuristas, mirad la web de Andres Nieto, Andresito para los habitules, apuntad rumbo hacia a2knieto.com ó anieto2k.com, nunca me acuerdo de como se escribe, Andrés, si me lees, te diré que tras varios procesos de consultoría y años de análisis sobre tu caso deberías mejorar el naming de dominio ya que sólo consigo llegar a tu blog porque mi navegador me lo chiva con tan sólo pulsar “ani”.

Si ya estáis en el templo de WordPress español, entrad en algún post, id a pie de página tal y como mostramos en la siguiente captura, mirad abajo tras los comentarios y con una leve tintada diferente al background de la página aparece un montón de keywords, que no dejan de ser una nube de tags del artículo o la página en cuestión pero que están hay semiescondidos, eso es Black Seo! Bravo, Andrés es humano y quiere posicionarse aunque me pregunto, ¿Le harán falta estas prácticas para posicionar con el fenomenal contenido que tiene en su blog?

Aquí la captura:

Páginas relacionadas con este artículo:

Megamenus para tu web

dedavid — Tue, 09 Feb 2010 08:52:57 +0000

En más de una ocasión los abrás visto en diferentes páginas web, unos menús tamaño XXL que aparecen al situarte sobre una opción de menú de navegación más o menos discreta, donde al pasar el ratón por encima y por tanto realizar el correspondiente “over” pummmm megamenu en tus narices.

Entonces posiblemente abrás pensado si eso es bueno o es malo, si es usable o no lo es, pues como todo exceso al principio puede reproductir repulsión. A mi, el escritor de este artículo, no son muy de mi agrado si bien tras reflexionarlo quizá el gurú de la navegación Jacob Nielsen tenga razón y sean una de las formas más óptimas de navegar en una web con muchos enlaces.

Así pues que una vez Mr. jacob ha bendecido los megamenús para su uso vamos a darle una oportunidad, y mirad por donde hemos encontrado una web con una demos excelente, donde podemos ver un montón de posibles aplicaciones, la que más no a gustado además de la primera localizada en la opción “A” del primer menú, es la última demo donde lo que nos ofrece son direcciones físicas ordenadas alfabéticamente como si de un address book o agenda se tratase.

Enlace: http://www.ihwy.com/Labs/demos/current/jquery-listmenu-plugin.aspx

Páginas relacionadas con este artículo: