Desarrollador Senior

20 Pantillas Web en HTML5 & CSS3

2012-01-27T08:50:00.001+01:00

20 Pantillas Web en HTML5 & CSS3:
Una colección de templates desarrolladas en HTML5 y CSS3 para tener paginas web con mucha mas velocidad de carga, ya que en estas utilizamos al máximo el poder del CSS evitando imágenes que puedan dificultar la rapidez de una web, gracias al post de Noupe elabore este ranking con las 20 mejores según mi criterio, para los que quieran ver el resto pueden hacerlo en la fuente oficial.

vía: Noupe.com

Fuente craftyman.net

Spine Mobile: Framework para WebApps moviles

2012-01-12T22:58:00.000+01:00

Spine Mobile: Framework para WebApps moviles:
Spine Mobile es un Framework Javascript, nos permite desarrollar aplicaciones en HTML5 con diseño y funcionalidades nativas a las aplicaciones móviles.

Este Framework esta desarrollado en HTML5, CSS3 e incluye la librería jQuery, con una buena documentación y ejemplos nos será muy fácil empezar a probar este Framework.

Características:

Eventos touch
Diseño de panel agradable
Aceleración de transiciones por hardware

Video Demo

En este video podemos ver la funcionalidad y diseño de una aplicación realizada con este Framework.

Web: spinejs.com

Framework para crear formularios atractivos y funcionales con jQuery

2011-09-20T21:30:00.001+02:00

Framework para crear formularios atractivos y funcionales con jQuery:
Ideal Forms es un pequeño y potente framework para potenciar el uso y el diseño de formularios. Este framework esta desarrollado íntegramente utilizando jQuery, siendo el framework Javascript su única dependencia obligatoria.

Al transformar visualmente cualquier formulario un punto muy favorable de Ideal Forms es su compatibilidad cruzada con los distintos navegadores, dando soporte prácticamente completo a los navegadores: IE 7+, Firefox 3+, Chrome 3+, Safari 3.1+ y Opera 11+.

La utilización de imágenes es absolutamente prescindible, la mayoría de los cambios visuales que realiza este frameworks funcionan solo utilizando hojas de estilo, las mismas son incorporadas en la descarga, y cuenta con distintos varios diseños distintos para que nosotros podamos seleccionar que tema utilizar.

Para evitar problemas con los navegadores más antiguos se recomienda la utilización de Modernizr, de esta manera logramos un nivel de compatibilidad más amplio y solucionamos algunos pocos problemas de propiedades CSS no soportadas por ciertos navegadores. Estos problemas se detallan muy bien en el sitio oficial de Ideal Forms.

Utilizar Ideal Forms no requiere más que unas pocas lineas de código, si nuestros formularios están bien escritos y recurrimos a una estructura valida, implementar este frameworks es cuestión de unos pocos segundos.

Web: Ideal Forms

API PHP de Google+

2011-09-17T19:04:00.001+02:00

API PHP de Google+:
Acaban de anunciar la API de Google+, algo que mucha gente estaba pidiendo para que esta plataforma pueda despegar.

Pues ya se han currado una librería en PHP (en beta) para que podamos probar con ella:

// Include the library files
require_once 'google-api-php-client/src/apiClient.php';
require_once 'google-api-php-client/src/contrib/apiBuzzService.php';

// Create the apiClient and Buzz service class:
$apiClient = new apiClient();
$buzz = new apiBuzzService($apiClient);

// If an OAuth token was stored in the session, use that. Otherwise go through the OAuth flow.
session_start();
if (isset($_SESSION['access_token'])) {
$apiClient->setAccessToken($_SESSION['access_token']);
} else {
$apiClient->setAccessToken($apiClient->authenticate());
// In a real application this would be stored in a database, and not in the session!
$_SESSION['access_token'] = $apiClient->getAccessToken();
}

// Make an API call
$activities = $buzz->activities->listActivities('@me', '@consumption');

// And echo the returned activities
echo '<pre>Activities: ' . print_r($activities, true) . '</pre>';

// Save the updated access token in the session.
$_SESSION['access_token'] = $apiClient->getAccessToken();

Habrá que probarla

Google+ API PHP Client

iOS Boilerplate, punto de inicio para crear aplicaciones para iPhone o iPad

2011-09-17T19:02:00.001+02:00

iOS Boilerplate, punto de inicio para crear aplicaciones para iPhone o iPad:

Hace unos días escribimos sobre HTML5 Boilerplate, una plantilla en Html que cuenta con el Js y Css necesarios para crear tu sitio web de forma sencilla. En la misma línea ahora tenemos iOS Boilerplate para la creación de aplicaciones para iPhone.

Como bien indica este proyecto:

Su objetivo es proporcionar una base de código para iniciarse en desarrollo de aplicaciones iOS.
No pretende ser un framework.
Con la intención de ser modificado y ampliado por el promotor para satisfacer sus necesidades.
Incluye sólida bibliotecas de terceros si es necesario para no reinventar la rueda.

Está probado para funcionar en dispositivos como el iPhone, iPad o iPod touch con iOS 4 o posterior, aunque de forma independiente, ya que no ofrece soporte para aplicaciones universales, de momento, aunque se prentende que así sea más adelante.

iOSBoilerplate está basado en XCode, la herramienta de Mac para desarrollo iOS. Aunque se pretende actualizar hacia un verdadero modelo XCode, por lo que puedes comenzar con este proyecto, asegurándote actualizaciones y quizás más fácil que con XCode.

iOSBoilerplate incluye:

Solicitudes HTTP y caché de imágenes (tanto en memoria como en disco)
UITableViews y UITableViewCells: desplazamiento rápido, imágenes async, pull-down-to-refresh, células swipeable …
Mapas y ubicaciones: direcciones entre dos puntos, autocompletado de lugares, etc …

Es una forma de iniciarse en el desarrollo de aplicaciones con lo necesario para acceso a web, interacción con los elementos de la interfaz de usuario de iOS y acceso a mapas.

Videotutorial: como hacer un componente de Backend para Joomla 1.5 usando el patrón MVC

2011-09-17T18:58:00.001+02:00

Hace un tiempo hice un vídeo para Webempresa donde hablaba sobre el desarrollo de extensiones usando el patrón MVC en Joomla. También se explicaba como usar partes del Framework de Joomla y hacíamos un ejemplo sobre el ForntEnd de Joomla.

En esta ocasión en el vídeo trata sobre como desarrollar la parte del Backend de la extensión, la metodología es similar, pero hay funciones nuevas que merece la pena ver con más profundidad. Queda todo recojido en un vídeo de unos 50 minutos que podéis ver en el canal de Youtube de Webempresa o aquí debajo.

Podéis descargar el código de ejemplo aquí.

PD: Un saludo para Gnumax que me anima constantemente para que siga escribiendo artículos en el blog.

03.- Curso de Git. Comandos Git (II)

2011-08-06T15:55:00.004+02:00

03.- Curso de Git. Comandos Git (II): "

Videotutorial Nº 3 del Curso de Git y Github en el que seguimos viendo los comandos fundamentales.

VideoTutorial Nº 3 del Curso de Git. Seguimos viendo los Comandos Fundamentales. Uso del Comando git diff; Uso del argumento --staged; Uso de los argumentos -v y -m con git commit. Sáltarse el stage con el argumento -a de git commit; Eliminar archivos con gir rm; uso del argumento --cached; Mover archivos con el comando git mv. 35 minutos.

Descargar en formato mp4

Descargar en formato m4v HD 720

Descargar vía iTunes

Feed Rss del Curso

Descargar en formato m4v(iPod, iPhone, iPad...).

Descargar archivos prácticas

Suscríbete al Canal de Videotutoriales.com en YouTube

Google+ vs. Facebook [infographic]

2011-08-06T15:55:00.001+02:00

Google+ vs. Facebook [infographic]: "

Via Technobombs.

Stay on top of Google and Facebook.

Permalink

| Leave a comment »
"

Seguridad en sitios web para webmasters

2011-08-06T15:55:00.000+02:00

Seguridad en sitios web para webmasters: "

A los usuarios se les enseña a protegerse de programas maliciosos mediante la instalación de programas antivirus sofisticados pero, a veces, también confían sus datos personales a sitios web como el tuyo, en cuyo caso es importante proteger sus datos. Proteger tus propios datos también es importante. Si tienes una tienda online, no querrás que te roben.

A lo largo de los años, las empresas y los webmasters han aprendido (a menudo por las malas) que la seguridad de las aplicaciones web no es ninguna broma. Hemos visto fugas de contraseñas debidas a ataques de Inyección SQL, robo de cookies con XSS y sitios web vulnerados por hackers debido a negligencias en la validación de los datos de entrada.

Hoy os mostraremos algunos ejemplos de cómo se puede atacar una aplicación web, para que puedas aprender de ello. Con este fin, usaremos Gruyere, una aplicación intencionadamente vulnerable que también usamos internamente para formación sobre seguridad. No pruebes la vulnerabilidad de los sitios web de otras personas sin su permiso, puesto que podría considerarse un ataque (hacking), pero te damos la bienvenida (e incluso te animamos) a hacer pruebas en Gruyere.

Manipulación del estado del cliente (Client State): ¿qué sucede si altero la URL?

Imaginemos que tienes un sitio de alojamiento de imágenes y que usas una secuencia de comandos en PHP para mostrar las imágenes subidas por los usuarios.

http://www.example.com/showimage.php?imgloc=/garyillyes/kitten.jpg

Pues bien, ¿qué sucederá si cambio la URL por algo así y userpasswords.txt es un archivo de verdad?

http://www.example.com/showimage.php?imgloc=/../../userpasswords.txt

¿Obtendré el contenido de userpasswords.txt?

Otro ejemplo de manipulación de estado del cliente se produce cuando no se validan los campos de los formularios. Por ejemplo, imaginemos que tienes este formulario:

Parece que el nombre de usuario del remitente se almacena en un campo oculto. Bueno, ¡esto es genial! ¿Significa que si cambio el valor de ese campo por el de otro nombre de usuario puedo enviar el formulario como si fuese ese otro usuario? Bien podría suceder. Aparentemente, los datos introducidos por el usuario no se autentican con, por ejemplo, ningún token que se pueda verificar en el servidor.

Imagina la situación si ese formulario formase parte de un carrito de la compra y modificásemos el precio de un artículo de 1000 USD por 1 USD para, después, enviar el pedido.

Proteger tu aplicación frente a este tipo de ataques no es fácil. Echa un vistazo a la tercera parte de Gruyere [inglés] para ver algunos consejos sobre cómo defender tu aplicación.

Cross-site scripting (XSS): los datos introducidos por el usuario no son de fiar

Una URL simple e inofensiva:

http://google-gruyere.appspot.com/611788451095/%3Cscript%3Ealert('0wn3d')%3C/script%3E

¿Es realmente inofensiva? Si descodificamos los caracteres codificados con el signo de porcentaje, obtenemos:

Al igual que muchos sitios web con páginas de error personalizadas, Gruyere está diseñada para incluir el componente de la ruta dentro de la página HTML. Esto puede generar problemas de seguridad, como XSS, puesto que introduce el código introducido por el usuario tal como está en la página HTML de la aplicación web. Podríamos pensar, 'bueno, es solo un cuadro de advertencia, ¿y qué?'. El problema es que si puedes inyectar un cuadro de advertencia, puedes, con toda probabilidad, inyectar otra cosa, también, y tal vez aprovechar para robarte las cookies y usarlas para acceder a tu sitio como si fueses tú.

Otro ejemplo es cuando no se limpian las entradas del usuario. Imaginemos que escribo un comentario en tu blog. Se trata de un comentario muy simple:

<a href=”javascript:alert(‘0wn3d’)”>Click here tos see a kitten</a>

Si otros usuarios hacen clic en mi inocente enlace, tendré sus cookies:

Puedes ver cómo resolver las vulnerabilidades por XSS en tu propia aplicación web e intentar resolverlas en la segunda parte de Gruyere [inglés] o, si eres un desarrollador avanzado, mirar las características sobre escapado automático en sistemas con plantillas de la que hablamos en nuestro blog sobre seguridad online [inglés].

Falsificación de petición en sitios cruzados (XSRF): ¿debería aceptar las solicitudes procedentes de diablos.com?

Oh, vaya, una imagen rota. No puede ser peligrosa: está rota, al fin y al cabo, lo cual significa que la URL de la imagen devuelve un código 404 o tiene un formato incorrecto. ¿Pero es siempre así?

¡No! La fuente de una imagen se puede especificar con cualquier URL, sea cual sea su tipo de contenido. Puede ser una página HTML, un archivo JavaScript, u otro recurso potencialmente malicioso. En este caso, la fuente es la URL de una simple página:

Esta página sólo funcionará si tengo una sesión iniciada y algunas cookies asignadas. Puesto que realmente tenía una sesión iniciada en la aplicación, cuando el navegador ha intentado recuperar la imagen accediendo a la URL de fuente, también ha eliminado mi primer fragmento. Esto no suena particularmente peligroso, pero si conozco un poco la aplicación también podría invocar una URL que elimine el perfil de un usuario o permita a un administrador otorgar permisos a otros usuarios.

Para proteger tu aplicación de XSRF no deberías permitir nunca que las acciones de cambio se soliciten vía GET. El método POST se inventó para este tipo de peticiones de cambio de estado. Este cambio por si solo podría mitigar el ataque anterior, pero por lo general no basta y es necesario añadir algún valor impredecible a todas las solicitudes que supongan un cambio de estado para prevenir las acciones de XSRF. Si quieres más información sobre XSRF puedes ir directamente a Gruyere [inglés].

Inclusión de Cross-site script (XSSI): todas tus secuencias de comandos nos pertenecen

En muchos sitios es posible actualizar dinámicamente el contenido de una página mediante peticiones de JavaScript asincrónicas que devuelven datos JSON. A veces JSON puede contener datos sensibles que, si no se toman las precauciones debidas, un hacker podría robar.

Imaginemos la situación siguiente: hemos creado una páginas HTML estándar y te enviamos el enlace. Puesto que confías en nosotros, visitas el enlace que te hemos enviado. La página contiene tan solo unas cuantas líneas:

Puesto que has iniciado sesión en Gruyere y dispones de un fragmento privado, verás un cuadro de alerta en mi página que te informa sobre el contenido de tu fragmento. Como siempre, si nos las hemos arreglado para abrir un cuadro de alerta, podremos hacer lo que queramos. En este caso se trata de un simple fragmento, pero también podría haber sido tu mayor secreto.

Defender a una aplicación frente a XSSI no es demasiado difícil, pero exige pensar con cuidado. Puedes usar tokens, tal como se explica en la sección sobre XSRF, hacer que tu secuencia de comandos solo responda a peticiones POST o simplemente iniciar la respuesta JSON por '\n' para asegurarte de que la respuesta no es ejecutable.

Inyección de SQL: ¿todavía crees que lo que introducen los usuarios es seguro?

Qué sucedería si intento acceder a tu aplicación con un nombre de usuario como

MarioMartinez' ; DROP TABLE members;--

Aunque este ejemplo en particular no dejaría expuestos los datos de los usuarios, podría provocar grandes quebraderos de cabeza porque tiene la capacidad de eliminar por completo la tabla de SQL en la cual tu aplicación almacena los datos de los miembros registrados.

Por lo general, puedes proteger a tu sitio web de la inyección de código SQL pensando proactivamente sobre la introducción de datos de los usuarios En primer lugar: ¿estás seguro de que tu usuario de SQL necesita disponer de permiso para ejecutar 'DROP TABLE members'? ¿No bastaría con concederle derechos de SELECT? Asignando los permisos de los usuarios cuidadosamente puedes evitar experiencias dolorosas y un montón de problemas. También puede ser útil configurar los informes de error de tal modo que no queden expuestos los nombres de las bases de datos ni de las tablas en caso de que una consulta falle.

En segundo lugar, tal como hemos aprendido en el caso XSS, los datos introducidos por el usuario no son nunca de fiar. Lo que para ti parece un formulario de inicio de sesión, es una posible puerta de acceso para un atacante. Limpia y verifica siempre la estructura de la información de entrada que se vaya a almacenar en una base de datos y, siempre que sea posible, usa instrucciones del tipo de consultas preparadas o parametrizadas, disponibles en la mayoría de las interfaces de programación de bases de datos.

Sabiendo cómo es posible atacar una aplicación web es el primer paso para entender cómo protegerla. Por este motivo, te animamos a que sigas el curso de Gruyere [inglés], aproveches otros cursos sobre seguridad web disponibles en la Google Code University [inglés]. También puedes probar Skipfish [inglés], una herramienta de prueba automática de la seguridad. Si tienes alguna pregunta más, no dudes en enviarla a nuestro Foro de ayuda para webmasters.

Publicado por Gary Illyes, Analista de tendencias para webmasters

Información sobre compatibilidad con HTML5 + CSS3 [actualizada]

2011-08-06T15:54:00.002+02:00

Información sobre compatibilidad con HTML5 + CSS3 [actualizada]: "
Uno de los grandes problemas a la hora de implementar tanto HTML5 como CSS3 es el relacionado con la compatibilidad con los distintos navegadores, en general los navegadores modernos no tienen inconvenientes en interpretar los nuevos estándares, no obstante ¿que ocurre con aquellos navegadores más antiguos?

Para ayudarnos a decidir que propiedades utilizar y cuales no podemos utilizar el sitio When can I Use, que nos brinda de forma muy simple y rápida las distintas compatibilidades de cada propiedad con las versiones de navegadores más utilizados. De esta herramienta ya había comentado algo hace un tiempo, pero ahora se encuentra completamente actualizada con opciones de lo más interesantes.

La forma de utilizar esta aplicación online y gratuita es de lo más sencilla, basta con seleccionar los navegadores que deseamos analizar y buscar las propiedades que vamos a utilizar, en las tablas que brinda el sitio podremos ver si dicha característica es reconocida y es compatible con el navegador seleccionado anteriormente.

Ejemplo de uso:

Los valores de cada propiedad varían según el navegador, los resultados posibles son: soportada, no soportada, parcialmente soportada y soporte desconocido.

When can I Use contempla algo que otras tablas de compatibilidad y es lo relacionado a navegadores para dispositivos móviles, por ejemplo tenemos iOS Safari, Opera Mini, Opera Mobile y como no podría faltar Android Browser.

Si lo que deseamos es una respuesta rapida cada propiedad tiene un promedio que nos indica a nivel general que tan compatible es con respecto a todos los navegadores disponibles, eso se indica de la misma forma que cada propiedad de forma individual. Por ejemplo si deseamos utilizar CSS min/max-width/height veremos que el porcentaje es alto, un 91.13%, es decir, es compatible con casi todos los navegadores.

Un sitio que va directamente a mis marcadores

Web: When can I Use

"

jQAPI, documentación alternativa de jQuery

2011-08-06T15:53:00.002+02:00

jQAPI, documentación alternativa de jQuery: "
Uno de los aspectos más importantes que debe contemplar cualquier framework, independientemente del lenguaje que utilice, es el referido a la documentación del mismo, jQuery hace un muy buen trabajo en cuanto a documentar en detalle cada una de las funciones y opciones disponibles. No obstante buscar en la documentación oficial de jQuery puede volverse un poco tedioso, para agilizar este proceso existe una alternativa llamada jQAPI.

jQAPI es un sitio que contiene toda la documentación alternativa disponible online pero que organiza la información de una manera mucho más accesible, y rápida. A diferencia de la documentación oficial de jQuery, uno cuando por ejemplo busca una función en jQAPI el sitio nos va a devolver solamente un resultado con la información, en lugar de muchas paginas como hace la documentación oficial.

Otro detalle genial es que podemos descargar toda la documentación con un solo click, tanto en versión HTML como en AIR, lista para consultarla en cualquier momento y desde la comodidad de nuestro disco en local.

Esta documentación jQuery puede ser navegada con el uso de las teclas de direcciones, un método simple pero efectivo de recorrer rápidamente las distintas secciones.

En lo personal voy a utilizar mucho más esta documentación que la oficial, uno agiliza muchísimo el proceso de buscar información, y ademas tener una versión instalada de forma local es una gran ayuda para la consulta rápida.

Web: jQAPI

"

Curso Moodle 1.9

2011-08-06T15:52:00.001+02:00

Curso Moodle 1.9: "

En esta segunda entrega presentare dos vídeos en los que se muestra como abrir y cerrar moodle después de haberlo instalado en forma local, el segundo vídeo trata sobre la creación de usuarios.

Video # 2 Abrir y cerrar moodle después de haberlo instalado.

Video # 3 Crear usuario en moodle.

CSS3 compatible con todos los navegadores en segundos

2011-08-06T15:51:00.000+02:00

CSS3 compatible con todos los navegadores en segundos: "
Prefixr es una nueva herramienta online, creada por la gente de Tutsplus, que se encarga de compatibilizar automáticamente nuestras hojas de estilo con todos los navegadores, haciendo mucho hincapié en las nuevas propiedades CSS3.

Una de las principales ventajas de utilizar esta herramienta es que nos ayuda a ahorrar mucho tiempo a la hora de escribir propiedades compatibles con los distintos navegadores, delegando completamente este trabajo a la aplicación.

Ejemplo de uso:

Si no vieron el video les resumo que Prefixr cuenta con una potente API, muy interesante para los usuarios del famoso editor Textmate con el que podemos automatizar el proceso directamente desde la mismísima edición de las hojas de estilo.

Les recomiendo probar y analizar sobre todo como incorporar la API a sus editores de código, seguramente esta herramienta va a dar mucho que hablar en un futuro. El tiempo que obtenemos a cambio de configurar esta aplicación es impresionante, y nos ayuda a no olvidar ningún navegador en el arduo proceso de lograr compatibilidad con nuestras propiedades CSS.

Web: Prefixr

"

Para qué sirve reCaptcha

2011-08-06T15:49:00.002+02:00

Para qué sirve reCaptcha: "
reCaptcha (y quizás otros sistemas de captcha) sirven más que para su cometido.

Y es que el cometido obvio, por así decirlo, de los sistemas de captcha es el de generar un desafío (challenge en inglés) para que ante un formulario el sistema web pueda asegurarse de que el que realizó la acción fue un ser humano y no un script o bot programado. Es entendible entonces como los sistemas de captcha evolucionan y van poniendo las letras cada vez mas complejas, tachadas o incompletas, ya que hecha la ley, hecha la trampa, y muchos hackers programan sistemas OCR para que rellenen automáticamente estos desafíos y completen automáticamente cualquier formulario o lo que sea.

Pero, al menos en reCaptcha, también hay otro objetivo (que no conocía… gracias a Pablo que me lo explicó) y es genial como lo implementan.

Este sistema, comprado por Google hace unos años, utiliza la “inteligencia colectiva” para que los humanos que rellenan formularios (o sea, nosotros) ayudemos a digitalizar textos. Los que han usado esto sabrán que cuando nos enfrentamos a un reCaptcha vemos 2 palabas: Una es la de control y la otra es el desafío (para el sistema). La de control el sistema la conoce, y la otra es la que el sistema está ingresando… ¿Pero a qué y para qué?

El tema es así, supongamos que somos Google y queremos digitalizar ediciones muy viejas de el New York Times. Primero le pagamos a gente para que ponga las hojas en un scanner (o sean escaneados por sistemas automáticos, da igual). La cuestión es que por más bueno que sea el software OCR, los diarios antiguos, por la mala calidad de impresión sumado al tiempo, tienen palabras irreconocibles…

El software OCR toma las palabras irreconocibles, las remarca, y se las manda a la API de reCaptcha para que los humanos que llenan formularios escriban “lo que les parece que dice”.

Obviamente si el sistema pone mil veces la siguiente palabra…

Mediante el algoritmo va a ir tomando los ingresos de los humanos que llenan formularios y determinará que esa palabra es DOUGLAS, (con coma) y a partir de que miles y miles escriban lo mismo, dará la palabra por sentado y además lo tendrá ingresado en la API como un desafío confiable.

Una vez que el sistema envía y recibe el feedback oculto de la comunidad (todo esto sin que casi nadie se entere que trabaja digitalizando texto) puede entregar el texto digitalizado con un 99,5% de efectividad ¿Groso? Miren el resultado final.

Ahora, ¿qué pasa si tenemos la “suerte” de que somos el primero o el segundo en recibir una nueva palabra? En ese caso es probable que si escribimos cualquier cosa el sistema nos deje pasar de todos modos, ya que la base de datos de esa palabra no existe.

El sistema no “valida” la palabra nueva como challenge, solamente lo hace con la de control, así que la primera (a veces varía el orden) es como desafío y la segunda es para “digitalizar”.

Si están con ganas de más les recomiendo este PDF (en inglés)

"

Las 10 mejores Conferencias Europeas sobre Desarrollo y Diseño Web en el 2011

2011-06-25T12:48:00.000+02:00

En el mundo del diseño y el desarrollo web no hay más remedio que estar aprendiendo continuamente. Pero para este aprendizaje continuo a veces, los libros y la red se quedan cortos, o al menos hacen que el proceso de adquirir este conocimiento sea mas lento.

Por eso es interesante asistir a alguna de estas conferencias (A.K.A. workshops, seminarios, etc..). En ellas, en pocos dias, podremos conocer las nuevas tecnologias, herramientas y recursos (muchas veces de la mano de los propios autores), la forma de trabajar de otros profesionales del sector, o simplemente comprender mejor aquello en lo que trabajamos dia a dia.

Asi que aqui os dejo una lista de las que a mi juicio son las 10 conferencias más interesantes que se van a realizar en Europa sobre Diseño y Desarrollo Web durante el 2011.

Ahi van:

1.- London Design Festival

El London Design Festival es una celebración del diseño que durante 9 dias se realizará en la capital de la creatividad mundial. El festival cubre un amplio espectro de disciplinas del diseño.

Cuándo: Del 17 al 25 de Septiembre del 2011

Dónde: Londres (Reino Unido) en diferentes ubicaciones a lo largo de la ciudad

Sitio Web: http://www.londondesignfestival.com/

2.- Fronteers

Fronteers es una organización sin animo de lucro de Desarrolladores front-end holandeses. Entre los objetivos de esta organización estan la profesionalización de este sector, mejorar el reconocimiento de la disciplina front-end, y la mejora de la posición de los desarrolladores front-end holandeses en sus empresas y del diseño/desarrollo web en el mundo en general.

Cuándo: Del 6 al 7 de Octubre del 2011

Dónde: Amsterdam (Holanda) en Pathé Tuschinski

Sitio Web: http://fronteers.nl/

3.- Web Performance Summit

Conferencia online donde se realizaran varias charlas para mejorar el rendimiento de nuestra web. Esta conferencia forma parte de una serie de conferencias online organizadas por Environments for humans

Cuándo: El 25 de Mayo del 2011

Dónde: Online

Sitio Web: http://environmentsforhumans.com/2011/web-performance-summit/

4.- Web Developers Conference

Conferencia organizada y presentada por Alex Older que lleva funcionando desde el 2007. Panoramica general vista por profesionales del sector.

Cuándo: El 21 de Octubre de 2011

Dónde: Bristol (Reino Unido)

Sitio Web: http://webdevconf.com/

5.- Frontend

Conferencia Internacional sobre diseño y desarrollo Frontend.

Cuándo: Del 10 al 12 de Octubre de 2011

Dónde: Oslo (Noruega)

Sitio Web: http://www.frontend2011.com/

6.- UX Camp London

Encuentro de un dia para cualquiera que esté interesado en la experiencia de usuario, el diseño de interacción, la arquitectura de la información o la usabilidad

Cuándo: El 9 de Julio del 2011

Dónde: Richmond, Londres (Reino Unido)

Sitio Web: http://uxcamplondon.org/

7.- NodeCamp

Encuentro de un par de dias con charlas, workshops, debates y más, centradas en Node.js

Cuándo: 11 y 12 de Junio de 2011

Dónde: Colonia (Alemania)

Sitio Web: http://nodecamp.eu/

8.- EuRuKo

La Conferencia europea de referencia sobre el lenguaje Ruby. Cada año se realiza en una ciudad distinta.

Cuándo: 28 y 29 de Mayo de 2011

Dónde: Berlin (Alemania)

Sitio Web: http://euruko2011.org/

9.- Full Frontal

Conferencias sobre Javascript y desarrollo FrontEnd durante un dia. Una de las citas imprescindibles para los Javascripers.

Cuándo: El 11 de Noviembre de 2011

Dónde: Brighton (Reino Unido) en Preston Circus

Sitio Web: http://2011.full-frontal.org/

10.- jsConf EU

'LA' Conferencia de Javascript. Cita anual para todos los programadores Javascript en Europa. Si quieres saber lo que se cuece a nivel mundial en JS no te la puedes perder.

Cuándo: 1 y 2 de Octubre de 2011

Dónde: Berlin (Alemania)

Sitio Web: http://jsconf.eu/2010/save_the_date_october_1st_and.html

... ¿Qué opinas de estas conferencias? ¿Has asistido a alguna de ellas en ediciones anteriores? ¿Alguna conferencia que creas que deba estar en esta lista?

Esperamos vuestros comentarios.

Más info:

Leer Las 10 mejores Conferencias Europeas sobre Desarrollo y Diseño Web en el 2011 en Pixelovers

Fuente pixelovers.com

03.- Curso de CSS3. Crear semitransparencias, gradientes y sombras.

2011-06-25T12:46:00.000+02:00

Tercer Videotutorial del Curso de CSS3 en el que seguimos elaborando nuestro primer proyecto y le aplicamos semitransparencias, gradientes y sombras.

Videotutorial Nº 3 del Curso de CSS3 en el que seguimos elaborando nuestro primer proyecto y profundizando en las principales propiedades y módulos de este nuevo nivel de las hojas de estilo. Fondos semitransparentes con RGBA o HSLA; Sintaxis; Herramienta de color online; Darle una semitransparencia a nuestros bocadillos; Uso de gradientes sin necesidad de imágenes; sintaxis -moz y -webkit; anatomía de un gradiente lineal; gradientes radiales; Aplicar sombras a elementos html sin imágenes; La propiedad box-shadow; Uso de Text-shadow. Una hora.

Descargar en formato mp4
Descargar en formato m4v HD 720
Descargar vía iTunes
Feed Rss del Curso
Descargar en formato m4v(iPod, iPhone, iPad...).
Descargar archivos de prácticas del videotutorial
Suscríbete al Canal de Videotutoriales.com en YouTube

Fuente illasaron.com

05.- Curso de CSS3. Uso de Css3 en el trabajo con imágenes.

2011-06-25T12:44:00.000+02:00

VideoTutorial Número 5 del Curso de CSS3. Nuevo proyecto de creación de una página web con el aspecto de la hoja de un cuaderno, que usaremos para conocer las propiedades y conceptos de CSS3 en el trabajo con imágenes.

VideoTutorial Nº 5 del Curso de CSS3 en el que iniciamos un nuevo proyecto que nos va permitir trabajar con las propiedades y conceptos aplicables a imágenes. Creamos una página con aspecto de una hoja de un cuaderno. Usamos la propiedad background-size para escalar una imagen de fondo con el texto. Vemos ejemplos prácticos y la sintaxis y usos de la propiedad a fondo. Vemos como aplicar múltiples imágenes de fondo en un mismo elemento y el modo de posicionarlos, redimensionarlas, repetirlas....... Hacemos también una selección de tutoriales online sobre los mismo temas. 45 minutos.

01.- Curso de Git y GitHub. Fundamentales e instalación.

2011-06-25T12:41:00.000+02:00

Primer Videotutorial de un nuevo curso dirigido especialmente a los programadores. En el año 2005 Linus Torvalds, se decidió a desarrollar un SCV(Sistema de Control de Versiones) para utilizar con el equipo de desarrollo del Kernel de Linux, focalizado sobre todo en la rapidez. Seis años más tarde, es usado por proyectos como: Android, CakePHP, Debian, Drupal, GNU Core Utils, GNOME, jQuery, Laconica, One Laptop Per Child (OLPC), Perl5, phpMyAdmin, Prototype, Ruby on Rails, Samba, VLC, WeeChat, Wine, Yum y decenas más que puedes ver en este enlace. Desde un año para acá no me canso de ver sitios de grandes proyectos que informan que están migrando a git. Por algo será. Así que si ya usas otros Sistemas de Control de Versiones o crees que tienes que empezar a usarlos, este Curso es para tí.

Nuevo curso destinado especialmente a los programadores. En el año 2005 Linus Torvalds, se decidió a desarrollar un SCV(Sistema de Control de Versiones) para utilizar con el equipo de desarrollo del Kernel de Linux, focalizado sobre todo en la rapidez. Seis años más tarde, es usado por proyectos como: Android, CakePHP, Debian, Drupal, GNU Core Utils, GNOME, jQuery, Laconica, One Laptop Per Child (OLPC), Perl5, phpMyAdmin, Prototype, Ruby on Rails, Samba, VLC, WeeChat, Wine, Yum y decenas más. Desde un año para acá no me canso de ver sitios de grandes proyectos que informan que están migrando a git. Por algo será. Así que si ya usas otros Sistemas de Control de Versiones o crees que tienes que empezar a usarlos, este Curso es para tí. En este primer videotutorial vemos los fundamentales de Git y Github, así como la instalación y configuración de ambos servicios. 58 minutos.

Descargar en formato mp4
Descargar en formato m4v HD 720
Descargar vía iTunes
Feed Rss del Curso
Descargar en formato m4v(iPod, iPhone, iPad...).
Suscríbete al Canal de Videotutoriales.com en YouTube

Fuente illasaron.com

Mozilla se niega a retirar un filtro de Firefox que se salta el bloqueo de EE UU a ciertas webs

2011-06-25T12:39:00.000+02:00

Un colectivo anónimo ha creado un complemento para el navegador quel redirige a los usuarios de forma automática a la nueva ubicación de las webs bloqueadas.
El Departamento de Seguridad Nacional de Estados Unidos ha pedido formalmente a Mozilla que lo retire y la fundación se ha negado.
Mozilla considera que la retirada sería una especie de censura.

Un colectivo anónimo creó en el mes de abril un complemento para el navegador de Mozilla, Firefox, llamado Mafiaafire, el cual redirige a los usuarios de forma automática a la nueva ubicación de las webs que han sido bloqueadas en EE UU. De esta forma, permite acceder a sitios bloqueados como Rojadirecta. El Departamento de Seguridad Nacional de EE UU ha pedido formalmente a Mozilla que lo retire y la fundación se ha negado.
Según informa un miembro del departamento legal de Mozilla, Harvey Anderson, en su blog, en un primer momento han rechazado eliminar esta extensión por considerarlo un tipo de censura en la Red. 'Una de las cuestiones fundamentales aquí es qué condiciones alegan para que los intermediarios se adhieran a las solicitudes del gobierno, solicitudes que tienen un efecto de censura y de amenaza a una Red abierta', asegura Anderson.
Anderson dice que lo único que han recibido es una solicitud para retirarlo y al no ser una orden judicial o una sentencia que lo prohíba expresamente no van a tomar medidas al respecto. Además, desde Mozilla les han remitido una serie de preguntas para evaluar la petición del departamento.
En esas cuestiones, el departamento legal de Mozilla pide al departamento de seguridad nacional que especifique y pruebe si algún tribunal ha dictado alguna sentencia contra Mafiaafire o si en realidad Mozilla está 'realmente obligado' a desactivar el complemento o si la petición se rige por otro tipo de razones. Tal y como asegura Harvey, por el momento no han recibido ninguna respuesta de la otra parte.
Hasta el momento la extensión sigue estando disponible tanto en el Mozilla como en la página web propia de la extensión

Google libera el estándar WebRTC

2011-06-25T12:37:00.000+02:00

Google ha lanzado el estándar WebRTC, un framework open source que tiene por objetivo ayudar los desarrolladores a crear chats de audio y videoconferencia en el navegador a través del empleo de APIs de JavaScript.

WebRTC permite codificar y decodificar los datos transmitidos, de forma que puedan ser transportados sin inconvenientes a través de las conexiones de red de los usuarios que lleven a cabo esas conversaciones. En cuanto al audio, se han empleado los códecs de voz iSAC, propiedad de Google desde que en mayo de 2010 la compañía adquirió a la empresa GIPS, mientras que para el video ha optado por sus propios códecs VP8.

Y casi tan importante como su potencial es el hecho de saber que la arquitectura en la que está basada la tecnología WebRTC -al igual que sus respectivos códecs y propiedad intelectual- son libres y su código está publicado bajo licencia BSD.

Por el momento, WebRTC está siendo desarrollado de manera conjunta entre Google y Mozilla, aunque la idea es lograr una API que pueda implementarse con varios navegadores, para lo que se está trabajando con organizaciones de internet como W3C, WHATWG o IETF.

Más información: WebRTC

Descarga WebRTC

Fuente visualbeta.es

06.- Curso de CSS3. Usar gráficos en bordes y fuentes Web.

2011-06-25T12:36:00.000+02:00

VideoTutorial número 6 del Curso de CSS3 en el que terminamos nuestro segundo proyecto, usando la propiedad border-size para añadir una imagen en el borde y la regla @font-face para añadir fuentes web.

VideoTutorial número 6 del Curso de CSS3 en el que terminamos nuestro segundo proyecto, usando la propiedad border-size para añadir una imagen en el borde. Usamos también background-clip para impedir que las imágenes de fondo aparezcan en el borde y le aplicamos una sombra al div con box-shadow. En la última parte del Videotutorial vemos en profundidad la regla @font-face, viendo como podemos incluir en nuestros diseños web fuentes independientemente de si se encuentran o no en el ordenador del usuario. Indicamos los formatos de fuente que debemos usar y como crearlos online.

Descargar en formato mp4
Descargar en formato m4v HD 720
Descargar vía iTunes
Feed Rss del Curso
Descargar en formato m4v(iPod, iPhone, iPad...).
Descargar archivos de prácticas
Suscríbete al Canal de Videotutoriales.com en YouTube

Fuente illasaron.com

08.- Curso de CSS3: pseudo-clases y Pseudo-elementos

2011-06-25T12:32:00.000+02:00

VideoTutorial Nº8 del Curso de CSS3. Vemos como apuntar a elementos específicos del documento sin usar IDs o Clases mediante el uso de Pseudo-clases y pseudo-elementos.

VideoTutorial Nº8 del Curso de CSS3. Vemos como apuntar a elementos específicos del documento sin usar IDs o Clases mediante el uso de Pseudo-clases y pseudo-elementos. Pseudo-clases estructurales en CSS3; El uso de nth-child( ); El DOM(Document Object Model); Ejemplo práctico: Aplicar a los comentarios estilos diferentes. 37 minutos.

Descargar en formato mp4
Descargar en formato m4v HD 720
Descargar vía iTunes
Feed Rss del Curso
Descargar en formato m4v(iPod, iPhone, iPad...).
Descargar archivos prácticas
Suscríbete al Canal de Videotutoriales.com en YouTube

Fuente illasaron.com

Adobe Edge para animación en HTML5 y CSS3

2011-06-25T12:28:00.001+02:00

Adobe Edge es un nuevo proyecto que permitirá a los diseñadores crear animaciones basadas en estándares como HTML5, CSS3 y JavaScript. Al ver la demo preliminar podemos darnos cuenta que ésta aplicación permitirá crear archivos desde cero o animar archivos ya existentes teniendo soporta para bitmaps y vectores los cuales se animan de una forma muy sencilla e intuitiva.

Algo realmente interesante sobre ésta aplicación es la posibilidad de abrir un archivo .html (o similar) y animar los divs. En éste proceso el código html y CSS no es modificado pues las animaciones se crean mediante JavaScript (específicamente con JSON).

Adobe dice que en poco tiempo tendremos posibilidad de jugar con una beta de Edge la cual estará disponible en el sitio labs.adobe.com.

Fuente cristalab.com

02.- Curso de CSS3. Crear efectos gráficos sin gráficos.

2011-05-15T16:33:00.001+02:00

VideoTutorial Número 2 del Curso de CSS3. Empezamos con proyectos prácticos, desarrollando un sistema de bocadillos para comentarios de un blog

VideoTutorial Número 2 del Curso de CSS3. Empezamos con proyectos prácticos, desarrollando un sistema de bocadillos para comentarios de un blog, lo que nos permitirá profundizar en la versión 3 del lenguaje de hojas de estilo en cascada. Empezaremos creando una página base, compatible con todos los navegadores, siguiendo el principio de mejoras progresivas. A continuación usaremos la propiedad word-wrap para impedir que los textos se salgan de los bordes de un elemento html; Usaremos border-radius para dar esquinas redondeadas al cuerpo de nuestro comentario y añadiremos una cola al bocadillo que apunte al avatar del usuario sin usar ninguna imagen. Algo más de una hora.

01.- Curso de CSS3. ¿Qué hay de nuevo?

2011-05-15T16:28:00.002+02:00

Primer videotutorial del nuevo Curso dedicado a CSS3, en el que vemos las novedades que ofrece, la situación actual de desarrollo y lo que podemos esperar de los distintos módulos que forman este nuevo nivel del lenguaje de Hojas de Estilo en Cascada.

VideoTutorial Nº 1 del Curso de CSS3 en el que vemos las novedades que ofrece. ;¿Qué es CSS3? Situación actual de desarrollo; Las nuevas funcionalidades de los módulos CSS3; ejemplos concretos; Sitios web donde informarse del estado de desarrollo de los nuevos estándares; explicación de los distintos niveles de desarrollo y de los prefijos usados por los motores de renderizado para las propiedades que aún no son estándares; Sistema de trabajo basado en 'Progressive enhancement.' 32 minutos

Links for 2010-11-10 [del.icio.us]

2010-11-11T00:00:00-08:00

Links for 2010-11-08 [del.icio.us]

2010-11-09T00:00:00-08:00

Links for 2010-11-07 [del.icio.us]

2010-11-07T23:00:00-08:00

01. Videotutorial de Jquery

Links for 2010-11-04 [del.icio.us]

2010-11-05T00:00:00-07:00

Videotutorial Jquery plugin Validation

Links for 2010-11-03 [del.icio.us]

2010-11-04T00:00:00-07:00

Links for 2010-11-02 [del.icio.us]

2010-11-03T00:00:00-07:00

Consejos para crear una ficha de empresa gratuitamente en Google Places: títulos de las fichas de empresa

Links for 2010-10-28 [del.icio.us]

2010-10-29T00:00:00-07:00

Desarrollar un sitio multilingüe en Drupal 6.x

Desarrollador Senior

20 Pantillas Web en HTML5 & CSS3

1 OWMX-1

2 SilverBlog

3 Clean Red

4 Serenity

5 Minimalism

6 Simple Style 7

7 Small Business

8 Cooking Site

9 VividPhoto

10 ElegantPress

11 FreshIdeas

12 Restaurant

13 Lifebook

14 Kroft

15 Business Project

16 Studio One

17 Shinra

18 One Page Portfolio

19 HTML5 Starter Pack

20 HTML5 Admin Template