Nueva demostración de gráficos con HTML5 y Javascript

Hoy os presentamos una interesante demostración de la capacidad gráfica que ofrece HTML5 con Javascript. Hakim El Hattab es un desarrollador que ha realizado unos experimentos visuales usando la etiqueta canvas, que permite dibujar gráficos en un área de la pantalla.

Hakim además ha publicado en detalle cómo ha llevado acabo su trabajo, incluido el código fuente, dirigido a la gente que quiera aprender a hacer cosas similares. Además comentó, que no quiere echar más leña al fuego con el asunto de Flash, sino que simplemente lo ha realizado porque le parece algo divertido.
Os dejamos el enlace para que los disfrutéis.

Entendiendo el soporte actual de HTML5 y CSS3

En la web de alt1040 nos explican varios detalles sobre el estándar HTML 5 y CSS 3 en castellano. Hablan de las demos HTML 5 que ha mostrado Apple, de cómo funciona un estándar del W3C, que es quien crea los estándares de la web y cómo son los pasos para crear un estándar.

Nos siguen explicando que tanto HTML5 como CSS3 están en estado de working drafts, tema explicado en los pasos de creación del estándar y que se resume en que está en constante evolución, cambios y cancelaciones, con los problemas que esto conlleva y el motivo de por qué hay que incluir los prefijos -webkit-, -moz-, -o- y -ms- en el código para que el navegador actual lo interprete correctamente, cuando sea un estándar definitivo esto ya no será necesario.

La llegada de Internet Explorer 9 y de Firefox 4.0 podrían marcar el paso definitivo hacia un estándar HTML 5 definitivo hacia finales de año. Lectura corta y en castellano recomendada.

Facebook también adopta HTML5 y acelera la muerte de Adobe Flash

Facebook, la red social que iguala y en ocasiones supera en visitas a Google en EE.UU., acaba de anunciar que se pasa al estándar HTML5 para reproducir vídeos en sus páginas, liberándose de la tecnología propietaria Flash y, por consiguiente, de su plugin.

Actualmente ya se pueden subir vídeos en ese formato, aunque la solución de Adobe no se ha eliminado totalmente y aún se utiliza para reproducir contenidos antiguos. El objetivo es reproducir todo de manera nativa en el nuevo estándar de la web. La muerte de Flash es algo inevitable, al menos para la reproducción de vídeos en Internet, y el hecho de que portales que tienen la mayoría del tráfico abandonen Flash no hace más que acelerar su caída.

Google y el tiempo de carga de las páginas web

Google incluyó hace poco un nuevo criterio en su motor de búsqueda para establecer la relevancia de las páginas web a la hora de indexarlas. El tiempo de carga del sitio web es ahora un punto importante a tener en cuenta si queremos que nuestra página tenga más posibilidades de aparecer en las búsquedas que realizan los usuarios, ya que según Google un sitio que tarde menos en mostrarse al usuario le da más calidad al mismo.

Otros criterios conocidos del motor que usa Google son el nombre del dominio, titulo de las página web, el contenido original y de calidad, la limpieza del código y su correcta utilización, el cumplimiento de estándares, la usabilidad y accesibilidad del sitio web, etc.

Desde caminando.com.es, nos ofrecen una serie de consejos para rebajar el tiempo de carga y cumplir lo mejor que se pueda ante la puntuación del buscador. Los consejos son los siguientes:

- Optimizar las imágenes: Usar formatos más livianos por ejemplo.
- Optimizar las hojas de estilo CSS: Confeccionarlas para que carguen rápido.
- Evitar el Hot-linking: Es decir, no enlazar a contenido que no esté alojado en el sitio web propio.
- Intentar hacer uso de la caché para la mayoría de los contenidos del sitio web (imágenes, iconos, hojas de estilo, archivos javascript, etc).

Para comprobar el tiempo de carga tras sucesivas optimizaciones, podremos utilizar la herramienta http://tools.pingdom.com/, aunque para que sea fiable tenemos que tener en cuenta que el resultado puede variar según el estado en que se encuentre el servidor donde esté alojado nuestro sitio web.

Wordpress 3.0 disponible, cargadito de mejoras

WordPress acaba de presentar la versión final 3.0 de su homónima plataforma de blogging open source. Llega después de 3 versiones Release Candidate y una larga serie de mejoras, como por ejemplo 1.217 bugs solucionados desde las versiones pre 3.0.

Ofrece además un nivel extraordinario de personalización, pudiendo cambiar prácticamente todo el aspecto de un blog a golpe de clic, desde la estructura básica, los colores, temas etcétera.

Otra de las mejoras de Wordpress 3.0 es la integración de la característica actualizar todo, que permite o bien actualizar temas, plugins y Wordpress por separado, o bien actualizar todo con un solo botón.

Como crear un tema de Wordpress en minutos, con Elastic

Elastic es un plugin para Wordpress que nos permite crear un tema de Wordpress desde 0. Lo más impresionante? Que sólo requiere unos cuantos clicks por aquí y por allá, definir para qué sirve cada “caja”, y en segundos, tendremos el tema de Wordpress que queremos.

Según los creadores, las opciones disponibles de temas, no son suficientes; lo que buscaron con Elastic, pues, fue darles la posibilidad a los usuarios de crear temas, de manera tan sencilla y rápida, como si estuviésemos navegando para aplicar un tema de Wordpress.

El resultado? La posibilidad de crear temas en un minuto. No me creen? Denle un vistazo a este video:

Impresionante, verdad? Con tan solo arrastrar el mouse en diferentes áreas, definir para qué sirven, y crear más áreas, podemos tener un tema de Wordpress totalmente funcional, en meros segundos!

Descargar Elastic para Wordpress

via wwwhat’s new

Google premiará a sitios rápidos en su buscador

Las páginas con un tiempo de carga menor contarán con prioridad para aparecer en los resultados de las búsquedas.

(DT, AGENCIAS) La relevancia, los acuerdos económicos o el page Rank no serán los únicos factores que situarán a una página en las primeras posiciones tras una búsqueda realizada con Google. La compañía ha anunciado que ha añadido un factor más a su algortimo que también determinará la clasificación de los resultados: la velocidad de carga de una web.

Los ingenieros de Mountain View, Matt Cutts y Amit Singhal lo describen así en un blog oficial: "Conceras que en Google estamos obsesionados con la velocidad, en nuestros productos y en la web. Como parte de este empeño, hemos incluido una nueva variable en nuestros algoritmos de búsqueda: la velocidad del sitio".

Por el momento las webs más rápidas en cargarse tendrán un mejor posicionamiento en el buscador. La medida tiene su lógica ya que, “cuando una página web es lenta, los visitantes pasan menos tiempo en ella”.

Web Widgets en Dreamweaver

El pasado día 15 de Octubre se publicó en Adobe Labs la primera beta pública del Widget Packager. Una extensión para Dreramweaver que permite empaquetar widgets creados con cualquier framework y convertirlos en extensiones listas para ser usadas. Te explicamos algunos conceptos básicos para que entiendas cómo funcionan.

Es muy probable que todos los que hayáis utilizado algún framework de AJAX (Spry, JQuery, YUI, MooTools, Prototype…) habréis utilizado un widget en vuestro proyecto: son sencillamente esos fragmentos de código que nos permiten de forma rápida añadir elementos como un calendario, una navegación por pestañas, efectos…

Dreamweaver posee por defecto una colección de ellos que utilizan spry, sin embargo no estamos limitados al uso de este framework para utilizar widgets.

Gracias al Widget Packager, podemos añadir al insertbar widgets que utilicen otros frameworks, de manera que podamos utilizarlos (nosotros y otros usuarios) con un solo click de ratón.

Los pasos a seguir son bastante sencillos:

• Creamos una carpeta donde incluyamos todos los archivos de los que haga uso el widget (JavaScript, CSS)
• En dicha carpeta, crearemos un archivo xml con la extensión *.wdf (widget descriptor file) donde definiremos los parámetros y características de dicho widget. La sintaxis empleada es una implementación de la Open Ajax Alliance (OAA) Widget Metadata Specification.
  Podréis encontrar el listado de etiquetas soportadas y su descripción en la Guía para desarrolladores. Yo todavía me la estoy leyendo, así que de momento no puedo explicar todas las etiquetas 8-(
• Instalaremos la extensión Widget Packager en Dreamweaver. Es recomendable leer antes nuestra technote sobre instalación de extensiones en CS4.

Esta extensión añadirá un nuevo elemento a nuestro menú ‘Commands’: Package Web Widget.

• En la ventana emergente sólo tendremos que indicar la ruta al archivo wdf y activar la casilla ‘install extension’ si queremos que se nos incluya al terminar en nuestra lista de extensiones:
  
• Al terminar el empaquetado, habremos obtenido un archivo mxp listo parar ser usado por cualquier otro usuario de Dreamweaver

Como podéis ver, el proceso es bastante similar al empaquetado de extensiones normales (el archivo wdf se parece a un archivo mxi), pero algo más sencillo (no hay que crear la interfaz ni documentos edml, por ejemplo).

En cualquier caso, siempre es más sencillo aprovechar los widgets creados por terceros: En vez de fabricarlos tú, visita la sección de Adobe Exchange dedicada a los web widgets, descárgate los que te interesen e instálalos utilizando el Extension Manager (de nuevo, recuerda nuestra technote!)

Fuente: http://www.dwug.es/go/465

15 artículos de CSS para principiantes

Cuanto más trabajo con CSS más pienso en lo fácil que parecía al principio. Y es que aunque hacer hojas de estilo para tus diseños no te parezca tan árido como aprender a programar en Java, hacerlas bien sí que puede traerte algunos quebraderos de cabeza. Aunque haciendo una chapuza a ti te parezca que queda como querías, luego te encontrarás con que en distintos navegadores tu web se ve diferente, con que un día te da por cambiar un píxel de espaciado y se va toda la estructura al carajo, etc…

Por ello lo mejor es empaparse un poquito antes de empezar y aquí os dejo esta lista de artículos para principiantes de Line 25 que descubrí hace tiempo y que me han servido de mucho. No son para principiantes totales, algo tendrás que saber, pero seguro que alguno de ellos tarde o temprano te saca de un apuro.

1. Resetting your styles with CSS Reset

Te parecerá extraño pero aunque empieces tu hoja de estilo desde cero, es posible que para los navegadores tu diseño no parta de cero. Por ello lo primero es poner a todos los navegadores de acuerdo y que no se tomen licencias que tú no quieres a la hora de considerar algunos espacios o dismensiones. Esto se hace a través de la técnica del CSS Reset sobre la que por cierto hay muchas variaciones como se puede observar en Perishable Press o en Inspiringpixel

2. Learn CSS Positioning in ten steps

Un tema que puede volver loco a cualquier los primeros días: las diferentes formas de posicionar un elemento a través de la hoja de estilos. Este me parece el mejor tutorial que he visto hasta la fecha y aún así no acabo de tenerlo del todo claro.

3. Internet Explorer and the CSS box model

Si ves que aparecen CSS e Internet Explorer en la misma frase vete haciendo café. Como decía en el primer tutorial, la forma en que interpretan las medidas los distintos navegadores te hará llevarte las manos a la cabeza más de una vez, pero la forma en la que las interpreta Internet Explorer merece darle de comer aparte. Estupendo artículo para enfrentarse a este problema.

4. Specifics on CSS Specificity

No me gusta el color de este enlace así que voy a cambiarlo en la hoja de estilos [...] ¿Pero qué? [...] ¿Por qué demonios sigue saliendo en rojo si lo acabo de cambiar? Pues probablemente porque en algún otro lugar le hayas dicho al navegador que ese enlace va en rojo y o cambias las prioridades o te puedes armar un buen jaleo. De eso va este tutorial: de qué propiedades de tu hoja de estilos valen más que otras o cómo interfieren entre sí.

5. Faux Columns

Cualquier tutorial que venga de A List Apart es de calidad. En esta ocasión comentan algunos trucos para conseguir que una columna se extienda verticalemente más allá de su contenido. Muy útil cuando tenemos un diseño tipo blog con una columa de dimensión variable que cambia según el tamaño de los post y otra que es siempre igual (la barra lateral) pero que queremos que “acompañe” a la principal.

6. Sexy Ordered Lists with CSS

Algo tan sencillo como darle estilo a una lista ordenada numéricamente pero separando el estilo de los números de los elementos de la lista. Se puede ver un ejemplo del resultado.

7. Divitis. What is and How to Avoid it.

Si vienes de diseñar con tablas seguro que el maravilloso mundo del

te atrapa y te pones a “enmarcar” todos los trocitos de tu web con divisiones. Esto es la divitis y la mayoría de las veces no es necesario. A mí me ha pasado muchas veces que por no saber darle estilo a una lista o a una imagen, la metía dentro de un

y le daba formato a este. Pues como te imaginarás hay formas mucho mejores de hacerlo.

8. Using background-image to replace text

Una clásico. Si aparte del CSS te interesa un poco el mundo del SEO sabrás que aunque pongas un maravilloso logo hecho en Photoshop de tu negocio en la web, convendría que ese logo estuviera acompañádo de un

con el nombre de la empresa en el código HTML. ¿Cómo hacemos para que no se muestre el texto del

pero sí el logo? Hay diversas técnicas con pros y contras discutidas en el tutorial.

9. CSS Sprites: What They Are, Why They’re Cool, and How To Use Them

A mí ya me costó en su día lo de usar una única imagen y que al pasar el ratón por encima cambie pero es que de un tiempo a esta parte lo que optimiza la carga de tu sitio web es meter la mayor cantidad posible de iconos en una única imagen y jugar con la posición de esta. Muchos sitios como Google que necesitan un tiempo de carga muy rápido usan ya esta técnica. Al final del tutorial tienes más ejemplos con Facebook o Google Reader.

10. How to create CSS Menu using Image Sprites

Enlace a la caché de Google porque el original no tira bien. En la línea del anterior, cómo crear un menú clásico de navegación de un sitio web con efectos y una única imagen.

11. 10 Examples of Beautiful CSS Typography and how they did it…

De primeras cuando uno se pone a jugar con la tipograf’ia en una hoja de estilos piensa que no tiene muchas posibilidades pero la verdad es que con un poco de imaginación y creatividad se pueden hacer vriguerías desde la hoja de estilos. Aquí tienes unos cuantos ejemplos.

12. CSS Shorthand Guide

Una guía de ¿bolsillo? con técnicas para reducir el tamaño de tu hoja de estilos agrupando diversas propiedades en un única línea. A veces no hace falta que el color, la posición, el tamaño y más cosas vaya cada una por su cuenta. Podemos agruparlas todas y así seguir mejorando la velocidad de carga de nuestro sitio web.

13. Push Your Web Design Into The Future With CSS3

Y con todo lo que te ha llevado a ti aprender CSS2 y ahora resulta que tienes que cambiarlo a CSS3 . No te preocupes, la evolución suele traer muchas más ventajas que inconvenientes así que si quieres aprender cómo poner sombras, transparencias o usar tipografías personalizadas todo a través de CSS aquí aprenderás cómo.

14. How to use headings in HTML

Muy muy sencillo y muy recomendado también con los interesados en el SEO ya que un uso correcto de los encabezamientos en el código HTML es muy buena práctica de cara a Google y otros buscadores.

15. 10 HTML tag crimes You Really Shouldn’t Commit

Apuesto lo que sea a que si llevas menos de un mes con CSS hasta comentido al menos 8 de estos 10 errores. Muchos provienen de que en HTML+CSS al mismo objetivo se puede llegar por distinos caminos pero es no significa que sean todos igual de buenos. Una artículo estupendo

Dummy Image: el Loren Ipsum de las imágenes

Loren Ipsum no es otra cosa que el comienzo de un texto en latín que usan la mayoría de diseñadores web cuando tienen que rellenar espacio en un sitio web que aún está en construcción. En vez de ponerte a inventar palabras, coges un texto predefinido y te ahorras un par de neuronas.

Pues en el Tumblr de Iván lasso descube Dummy Image Generator que hace lo mismo pero con imágenes. ¿Cómo es esto?

Vale, suponte que necesitas colocar en un sitio una imagen de 300 x 250 pixels que aún no sabes cómo será. Pues en el código de tu página web pones:

Y te saldrá algo como esto:

Para otros ejemplos sólo tienes que cambiar las dimensiones de la línea código (donde pone 300×250) y listo.

Videotutoriales para aprender a programar en JavaScript.

Serie de 13 videotutoriales sobre programación en JavaScript en español. Podéis verlos todos desde este enlace

Ventajas de configurar Google Analytics

"Frecuentemente los nuevos de Google Analytics no valoran en su justa medida esta potente herramienta de analítica web y piensan que básicamente ofrece lo mismo que otras muchas herramientas de estadística web que se incluyen de forma gratuita con sus planes de hospedaje y la razón es que usan Analytics con su configuración básica, sin personalizarlo para dar respuesta a sus necesidades reales.

Ventajas de configurar Google Analytics

Frecuentemente los nuevos de Google Analytics no valoran en su justa medida esta potente herramienta de analítica web y piensan que básicamente ofrece lo mismo que otras muchas herramientas de estadística web que se incluyen de forma gratuita con sus planes de hospedaje y la razón es que usan Analytics con su configuración básica, sin personalizarlo para dar respuesta a sus necesidades reales.

Dar de alta una cuenta en Analytics es muy sencillo y el único “trabajo” que supone es el de copiar un código de control que debe estar instalado en todas las páginas del web, algo muy sencillo y rápido si hemos realizado un diseño previsor y tenemos partes comunes en las páginas web que nos permitan actualizar toda la web con modificar un único archivo.

En la configuración básica Analytics nos ofrece información estadística que efectivamente proporcionan todos los demás sistemas de estadística gratuitadel mercado como son el número de nuestras visitas, las páginas vistas, procedencia de las mismas, páginas más visitadas, navegadores utilizados, etc.

El verdadero problema consiste en cuando deseamos mejorar una web de la que sólo tenemos esta información básica ya que solo podremos conocer si el sitio web está creciendo en visitas, pero no en rentabilidad. Si el modelo de negocio de su empresa se basara únicamente en vender banners y lo único que nos interesara es aumentar el número de páginas vistas por usuario y el de páginas vistas o impresiones en total, puede que este dato nos ayudara, pero… ¿Acaso busca usted solamente visitas o busca Clientes? ¿Qué pasa si lo que queremos es saber la rentabilidad real del web?

Una configuración Avanzada de Google Analytics le permite definir objetivos de rentabilidad de forma que respondamos a preguntas como estas: ¿de qué provincia o país son los clientes que compran más? ¿Qué contenido publicado (artículos, textos…) es el que consigue que se den de alta los usuarios en nuestra base de datos? ¿Piden más información los clientes que leen la oferta A o la oferta B? ¿Son más rentables mis campañas de tráfico gratuito en buscadores (SEO) o las campañas de pago (SEM)? ¿Cuántos clientes generaron las campañas de email que realicé la semana pasada? ¿Es realmente rentable el banner que he contratado en esa web? ¿Qué buscador y palabras clave en SEO y SEM me traen clientes finales y no sólo curiosos?....

En resumen una configuración avanzada de Google Analytics y personalizada le permite saber si lo que tenemos son “más curiosos” o “más clientes potenciales o finales” y no invertir a la vieja usanza con frases como “Sé que estoy tirando a la basura la mitad de mi presupuesto publicitario, pero no sé qué mitad”, tal y como sigue pasando por desgracia con muchas campañas en medios tradicionales.

Enrique Maldonado (Qualified en Google Analytics)
http://www.marketing-on-line.es/
http://www.marketalia.com/

Los 14 mejores editores CSS para diseñadores y desarrolladores

CSS se ha convertido en el sistema indiscutible para dar estilo y cambiar la apariencia de todos los sitios web modificando un único archivo. Este proceso se puede hacer incluso más sencillo mediante el uso de editores CSS. En BestDesignTuts.com han recopilado 14 Editores CSS que pueden reducir mucho el tiempo necesario para crear nuestro código CSS, aunque en cualquier caso el conocimiento del Código CSS va seguir siendo siempre muy necesario.

Diferencias CSS en Internet explorer 6,7,8

Uno de los hechos más esperpénticos en relación con el uso de los navegadores es el modo en el que las distintas versiones de Internet Explorer interpretan el código CSS de las hojas de estilo y como se adaptan a los estándares. Si a esto se le une que, aunque el IE sigue siendo el navegador más utilizado (en torno al 65% del mercado) lo hace de un modo muy repartido entre sus distintas versiones. Aunque parece increible muchísimos ordenadores siguen usando la versión 6 de IE. Consecuencia: los desarrolladores se ven obligados a testear sus proyectos en las distintas versiones. En algunos casos se ha pasado a la insumisión y simplemente no se hace, pero cuando estás trabajando para un cliente, eso no le va convencer mucho. Pues para el que no le quede otro remedio, en este excelente artículo de Smashingmagazine, explican a modo de cheat sheat y con comparaciones muy claras las diferencias entre estas tres versiones de IE en cuanto a : Selectores y Herencias; Pseudo-Clases y Pseudo-elementos; Soporte para las propiedades CSS; Otras técnicas y los Bugs más significativos e incompatibilidades. Imprescindible para el momento que tengas que probar si tu proyecto se ve bien hasta en el IE6......si no te queda otro remedio, claro, porque en ese caso lo mejor es declararse "insumiso" y el que entre con el IE6 que lo actualice si quiere.

Sinergias entre AdWords-Analytics

"Un problema muy común con el que nos encontramos cuando tenemos un primer contacto con nuestros clientes es que la mayoría ya están utilizando programas más o menos avanzados de analítica web, pero no saben sacarle todo el jugo a la información que estos ofrecen.
Todos los programas de estadísticas ofrecen información básica como el número de visitas, impresiones por visitantes, origen de la visita, tipo de buscador utilizado, etc… pero según el tipo de sitio web que estamos gestionando deberemos fijarnos más en unos datos que en otros.


Sinergias entre AdWords-Analytics
Un problema muy común con el que nos encontramos cuando tenemos un primer contacto con nuestros clientes es que la mayoría ya están utilizando programas más o menos avanzados de analítica web, pero no saben sacarle todo el jugo a la información que estos ofrecen.
Todos los programas de estadísticas ofrecen información básica como el número de visitas, impresiones por visitantes, origen de la visita, tipo de buscador utilizado, etc… pero según el tipo de sitio web que estamos gestionando deberemos fijarnos más en unos datos que en otros.
Profesionalmente creo que una herramienta gratuita como Google Analytics es más que suficiente para la mayoría de los proyectos web, y si se configura de una forma avanzada nos puede ofrecer información realmente valiosa. La ventaja de Analytics es que es una aplicación gratuita y que si la utilizamos junto con Google AdWords nos permite extraer información conjunta realmente interesante.

Sitios de e-Commerce
En los sitios de comercio electrónico las métricas más importantes que debemos analizar son: Beneficios, ingresos, ratios de conversión, pedido medio y la media del coste de las conversiones.
Esta es la configuración más complicada para obtener datos fiables, pero si configuramos AdWords y Analytics adecuadamente la mayor parte de la información la tendremos en tiempo real. Por ejemplo, es posible indicar el precio o beneficio obtenido por un producto individual de forma que cuando consultemos los datos de nuestra web veamos qué campañas tienen un mayor retorno de inversión (ROI).
Un dato especialmente importante que nos ofrece Analytics es saber qué orígenes de datos son los que nos están generando ingresos. Por ejemplo, podemos saber la rentabilidad diaria del banner en la web de un afiliado, conocer la rentabilidad de una campaña de e-mailing, saber que una palabra clave en SEO (posicionamiento orgánico) nos genera X ingresos y las palabras más rentables de nuestra campaña de publicidad en buscadores (SEM).
Generación de Leads / Peticiones o Registros
Este segundo tipo de sitios webs, que basan su negocio en la generación de Leads (Registros o Peticiones de Información) son seguramente los que mas partido pueden sacar de una campaña de AdWords y de la analítica Web.
En los sitios de Generación de Leads las métricas más importantes a analizar son: volumen de leads generados, tasa de conversión de clic a Lead, ingresos generados por cada lead, coste por lead y beneficio de cada visita.
La mayor parte de la información que necesitamos nos la ofrece el propio AdWords una vez que hemos configurado adecuadamente el seguimiento de conversiones, pero al igual que en los sitios de comercio electrónico, hay información de campañas adicionales (e-mailings, banners, enlaces comprados en otras webs, etc…) que sólo podemos obtener con Analytics.
Incluso es posible saber la calidad y rentabilidad que generan los resultados gratuitos en los buscadores (SEO) frente a los resultados de campañas de pago en buscadores (SEM).
Un error muy habitual de muchas campañas en AdWords es fijarse sólo en el coste por clic CPC en vez del coste por Lead o número de Conversiones. ¿Qué más nos da pagar 1 Euro por clic si obtenemos clientes a 5 Euros y nuestro producto se vende a un precio de 50 Euros? ¿No es más rentable que una campaña de CPC a 0,50 Euros pero que no genera apenas Leads o los genera a un precio desorbitado? El ratio de Conversión y el coste final por Lead son los datos más importantes en este tipo de campañas.

Sitios basados en Publicidad
El modelo de los sitios que basan su negocio en la publicidad es más simple: deben obtener el máximo número de páginas vista por usuario y conseguir vender sus espacios publicitarios al mejor precio posible para maximizar sus ingresos. Ante este modelo el objetivo que debemos seguir es una campaña con un CPC bajo.
Las métricas que debemos examinar en un sitio basado en Publicidad son: beneficio, ingresos, páginas vistas de media por cada usuario, coste medio por visita y beneficio medio por visita.
En este tipo de sitios la red de contenido de Google puede ayudar a obtener clics a bajo coste ya que generalmente ofrece un CPC menor, pero sin dejar de revisar el número de páginas vista por cada usuario y campaña, información que obtendremos de Analytics.


Enrique Maldonado
Director Técnico
Marketalia Marketing On Line
www.marketing-on-line.es

como asegurarnos de que google visita a fondo nuestras páginas web

Toda empresa debe tener algún tipo de presencia en Internet, pero de poco sirve estar en Internet si no nos aseguramos de que los robots de los buscadores encuentren nuestras páginas y sean capaces de visitar todos nuestros contenidos. A continuación vamos a dar unos consejos básicos especialmente recomendados para mejorar la visibilidad de nuestra web en Google, lo que de por sí ya ayudará a mejorar nuestro posicionamiento, aunque sólo sea porque gracias a seguir estos consejos Google entenderá mejor nuestro sitio y no se dejará ninguna página que deseemos sin visitar.

CÓMO ASEGURARNOS DE QUE GOOGLE VISITE A FONDO NUESTRAS PÁGINAS WEB EN 10 PASOS Toda empresa debe tener algún tipo de presencia en Internet, pero de poco sirve estar en Internet si no nos aseguramos de que los robots de los buscadores encuentren nuestras páginas y sean capaces de visitar todos nuestros contenidos. A continuación vamos a dar unos consejos básicos especialmente recomendados para mejorar la visibilidad de nuestra web en Google, lo que de por sí ya ayudará a mejorar nuestro posicionamiento, aunque sólo sea porque gracias a seguir estos consejos Google entenderá mejor nuestro sitio y no se dejará ninguna página que deseemos sin visitar. 1. Da de alta tu página web en el buscador de Google si no lo estaba ya y consigue que otros sitios web enlacen a tu sitio web ofreciéndoles valor añadido (artículos, notas de prensa, informes…) Google aprecia mucho la información y el contenido fresco. 2. Si ya tienes páginas incluidas en Google, empieza con una simple búsqueda en el propio Google que te diga las páginas que tiene indexadas, para ello escribe la siguiente búsqueda: site: miweb.com 3. Utiliza las Herramientas para Webmasters gratuitas de Google para conocer cómo Google rastrea nuestro sitio Web. Si no tienes dado de alta tu sitio dalo de alta. Por ejemplo, la herramienta de Análisis de Contenido te permitirá saber si hay problema con tus etiquetas Meta. 4. Crea y actualiza con frecuencia el Sitemap (Mapa del sitio estándar en formato XML para buscadores) de tu sitio en función de lo que actualices cada sección e incluye información de qué secciones se actualizan con más frecuencia. 5. Revisa que los nombres de tus imágenes aporten información de lo que contienen. Google prefiere encontrarse nombres de archivos de imágenes del estilo contacto.jpg, pedidos.jpg… que 0001.jpg, imagenA.jpg… Piensa además que, si lo permites a través de las herramientas de Webmasters, las imágenes también se incluirán en el buscador de imágenes de Google. 6. Si apareces en el primer puesto de Google, es muy posible que junto con tu web aparezcan una serie de enlaces adicionales que son las secciones que el buscador ha considerado las principales de tu Web. Si no estás de acuerdo con esa clasificación puedes eliminar alguno de esos enlaces para que aparezcan otros modificándolos. 7. Revisa los estados de tus páginas Web y sobre todos los errores 404 de página no encontrada. Si una página cambia de sitio emite un código 301 e indica la ubicación nueva de la página, esto te ayudará a no perder el histórico de puntuación que le hubiese dado el buscador y evitarás molestias a tus usuarios, ya que el cambio es transparente. Si la página efectivamente ya no existe, asegúrate de que no esté enlazada desde otro punto de la web. Revisa la documentación de Google sobre como manejar los cambios en URL. 8. Crea contenidos originales pensados para las personas, no sólo para estar mejor posicionado en Google. Evita duplicar contenidos y si no tienes más remedio (como pasa con los programas de afiliados), personalízalos al máximo o mejóralos con contenidos e información adicional. No uses nunca páginas que sólo puedan ver los buscadores (Doorway pages) o puedes ser expulsado y borrado de Google. 9. Organiza el contenido de tus páginas esquematizando la estructura de tu sitio web con etiquetas …. de forma que por ejemplo, la eqtiqueta H1 sea el título de la página, la H2 los puntos principales, H3 subpuntos… tal y como harías con un documento escrito. 10. Utiliza los estándares web y verifica si tu web los cumple. El W3C ofrece herramientas online gratuitas para verificar si tu web cumple con los estándares XHML o si tus hojas de estilo cumplen con el estándar CSS. Esto además de mejorar la visibilidad con los buscadores ayudará a mejorar la usabilidad y compatibilidad del sitio web. Enrique Maldonado www.marketalia.com www.marketing-on-line.es "

plone para phyton

Hola a todos!. Estoy muy interesado en un cms que se llama plone y que se desarrolla en zope, todo programado en python. Estoy intentando aprendera a hacer webs con plone, creo que tiene muchisimas posibilidades, me he comprado un libro Building websites with Plone, esta en ingles y lo voy leyendo despacio. Creo que este sistemas de hacer webs es muy profesional y con muchas posibilidades, ademas esta programado con python con lo que se puede modificar facilmente y crear nuevos contenidos.

http://www.plone-es.org
http://plone.org/
http://www.plonehispano.com/foro/

4 Vídeos imprescindibles para entender la web 3.0

1. The future Internet: Service 3.0 Video será presentado en el Web 3.0 Event en pocas semanas. Ha sido un descubrimiento reciente y creo que es, simplemente, lo mejor de la serie para entender la evolución de la web. No he podido encontrar el código para embeberlo, así que os dejo enlace:

2. Entender la web semántica: Lo utilizo y comento en mis presentaciones porque creo que, al estilo de los de Common Craft, ayuda a entender de forma simple y amena el concepto:

3. Kevin Kelly, de Wired, una de las publicaciones digitales más antiguas: Los próximos 5000 días de la web, también en inglés pero insustituible como introducción a lo que vendrá:

4. El futuro de Internet: El vídeo, hecho por Simón Hergueta, trata sobre singularidad tecnológica, esa inteligencia sobrehumana de la que habla, también Kevin Kelly y que seguro que es posible si no la entendemos como nada más que eso, inteligencia, sin voluntad, conciencia y algunas otras de las cosas que hacen del ser humano algo distinto.

Ha generado bastante polémica (también en Los sueños de la razón y estoy de acuerdo en cuestionarlo si supone que el aumento de conexiones podría hacer surgir de forma espontánea la conciencia.

javascript MVC

JavaScript sigue siendo el centro de la web, con presencia en prácticamente todos los proyectos que aparecen continuamente. Al igual que con HTML, sus orígenes eran mucho más limitados y su constante crecimiento obliga a un replanteamiento de su uso. La aparición de ROR, aunque no se ha convertido en el estándar que muchos esperaban, sí ha hecho que las arquitecturas MVC se hayan extendido a la mayoría de los lenguajes de programación. Y JavaScript no podía ser menos. En A List Apart incluyen un excelente artículo sobre la implementación MVC para JavaScript como medio de organización del código.

php 5.3

Aqui obtendrás información acerca de migrar de php 5.2 a 5.3 http://es2.php.net/migration53
Aqui todo lo relacionado con php 5.3 http://php.net/releases/5_3_0.php