Igual que los gobiernos desclasifican información con el tiempo, hay cosas que ya no se pueden considerar ventaja competitiva y sin embargo siguen pudiendo considerarse interesantes para la comunidad. En enero de 2012 introdujimos un análisis de tendencias de navegación como parte de una propuesta integral para un banco. En aquel momento integramos un compendio de estudios reflejando por qué los dispositivos móviles deberían ser el foco de atención en el desarrollo de una estrategia de presencia en Internet. Una cosa es saber que todas las empresas están orientándose al móvil, otra es saber por qué.

Algunas partes de este informe ya han quedado antiguas pero otras son todavía aplicables: informes de Morgan Stanley, Google e IDC, extractos del Chief Design Architect de Yahoo! y un largo etcétera que pueden servir como punto de partida para que otros redacten sus propios informes.

Welcome to ExtremaLeaks.

Además de ser una oportunidad excitante para nosotros, también fue la prueba de fuego para la última versión del curso. Todo el material ha sido portado a HTML. Así que estamos usando HTML5 y CSS3 en toda su gloria para enseñar HTML5 y CSS3 (¡ajá! se cierra el círculo), lo que nos permite usar ejemplos de código en vivo que se pueden manipular con las dev tools. El número de capturas de pantalla se ha desplomado: ¡ya no nos hacen falta!

Esta adaptación no ha sido solo un cambio de formato, sino que además hemos abierto el material en GitHub  para toda la comunidad, como parte de la plataforma de instructormatters.com. Estamos muy satisfechos con su calidad, y creemos que podemos aportar más aún compartiendolo a la vez que formando instructores.

La respuesta de Ginebra al curso fue muy positiva. El ambiente y el trato con el equipo fueron inmejorables, nos hicieron una visita guiada a la sede de las Naciones Unidas, ¡hasta nos regalaron chocolate! (ignorantes de la vida, que no sabíamos que Lindt tuviera ediciones limitadas). El momento cumbre del curso fue cuando nos enteramos de que durante el módulo de optimización de CSS uno de los asistentes estaba cambiando en caliente el website de la ONU con el contenido de los labs. Agilismo A Muerte.

En definitiva, volvimos muy contentos con la experiencia y con ganas de repetir. Cosa que parece que va a suceder, porque cuando nos bajamos del avión ya teníamos un correo pidiendo un segundo round.

Toca desembarcar en Ginebra…

Un aparte: si tienes que elegir un sólo evento nacional al que ir para todo el año, que sea este. La Barcamp Spain ha encontrado su propia alma, con una experiencia de cerveza más networking muy divertida. ¡Solo la comida justifica el viaje!

La gente nos preguntó por una transcripción de la tercera parte de la charla, nuestro propio conjunto de trucos para potenciar Sublime Text Editor en el desarrollo web. Así que aquí está:

Ponte cómodo

Es posible que Sublime Text Editor no sea tu primer editor. Problablemente en una vida pasada ya eras eficiente con algún otro como Eclipse, Bean, TextMate,… el que sea. Esto se trata de meter las manos en la masa, por lo que es recomendable configurar Sublime con los atajos típicos que ya estén hard-coded en tu cerebro. En Extrema estamos acostumbrados a los atajos de Eclipse.

La idea es estar cómodo, así que haz lo necesario para que Sublime se adapte a ti tan bien como tu editor previo. Ahora puede comenzar lo bueno.

Maximiza el espacio

No soy un gran fan del modo distraction-free de Sublime, pero sí me interesa maximizar el espacio que uso en pantalla (el data-ink ratio, para fans de Tufte). De modo que aquí teneis:

• Activar/desactivar la barra lateral: Ctrl + K, Ctrl + B. Esto es útil si raramente la usas.
• Mostrar varios archivos a la vez: Shift + Alt + [1234589] (a elegir uno). Puedes compararlos uno al lado del otro, uno encima y otro debajo, etc. Una vez que termines, Shift + Alt + 1 te devuelve al modo normal.

Rodear con un tag: Shift + Ctrl + W

Este es un atajo útil para tags inline (b, em, a), y no tanto para tags de elementos de tipo bloque (divs, p, etc.). Pruébalo:

• Escribe un texto cualquiera.
• Selecciona una palabra, presiona Shift + Ctrl + W y después b.

Seleccionar bloque: Shift + Clic derecho arrastrando

Esto es genial cuando necesitas insertar tags al principio de cada línea (p, li).

• Prepara tu lista de datos.
• Selecciona el código y pulsa Tab para identarlo un poco
• Presionando la tecla Shift, haz clic derecho y arrastra para seleccionar una sección rectangular del mismo.
• Ahora escribe el tag inicial para que se inserte al principio de cada línea.

Cursores múltiples

Los ejemplos previos son solo casos concretos del uso de cursores múltiples. Para entendernos, digamos que puedes tener diversas instancias de una clase SublimeCursor (no tengo ni idea del código fuente, pero me parece una manera sencilla de entenderlo). Esta es una lista condensada de las cosas que puedes hacer, elaborada a base de prueba y error:

• Ctrl + clic: crear un nuevo cursor
• Ctrl + doble clic: crear un nuevo cursor con la palabra cliqueada ya seleccionada
• Shift + clic: seleccionar usando el último cursor (así que ctrl + clic y después shift + clic para añadir la selección al conjunto de cursores)
• Cualquier input del teclado: actuar en todos los cursores a la vez. Las combinaciones de teclas como Ctrl + V funcionarán, así como la escritura normal (como pulsar para escribir el tag de cierre en cada línea).

Esto se entiende mejor con una serie de ejemplos:

• Escribe un texto cualquiera.
• Ctrl+clic al principio de cada línea.
• Escribe <p> o <li>

¿Olvidaste entrecomillar los atributos de un tag?

• Ctrl + doble clic en cada atributo
• Pulsa “

• Ctrl + doble clic en palabras que quieras poner en negrita.
• Si quieres seleccionar más de una, Ctrl+Clic al principio y después Shift+Clic al final.
• Pulsa Shift + Alt + W y después b.

Hay una tonelada de posibles aplicaciones, y lo cierto es que nos descubrimos a nosotros mismos haciendo cosas muy funkies. ¿Qué trucos utilizás tú?

En Koliseo Checkpoint Charlie soportamos 6 proveedores de OAuth. En Android esto solo es posible integrando un WebView encargado de manejar todo el flujo de OAuth, con el efecto práctico de que hemos embebido un navegador completo en nuestra aplicación nativa.

Lo importante aquí es, ¿Como podemos sacar el máximo provecho a este WebView? ¿Dónde podemos meter nuestro código para que trabaje junto con este widget?

Para quien nunca lo haya utilizado, lo primero es declarar el WebView en nuestro layout. En este caso, vamos a declararlo en un fichero xml (que es lo recomendado para los layouts, aunque puede hacerse también con Java):

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    style="@style/CodeFont"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <WebView android:id="@+id/web_view" android:layout_width="fill_parent" android:layout_height="fill_parent"/>

</RelativeLayout>

En solo 4 líneas de código tenemos disponible una vista para mostrar páginas webs con Webkit como motor de render. Este componente requiere solicitar al usuario permiso para acceder a Internet desde el MANIFEST:

<uses-permission android:name="android.permission.INTERNET" />

Ya dentro de nuestra Activity será donde tendremos que recuperar el widget y trabajar con él.

private WebView webView;

@Override
protected void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   webView = findViewById(R.id.web_view);
}

Introducimos un layout que nos dará la posibilidad de mostrar un spinner mientras se está cargando una url:

<LinearLayout
    android:id="@+id/loading_oauth_layout"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true" android:layout_alignParentRight="true"
    android:layout_margin="10dip">

    <ImageView
        android:id="@+id/loading_oauth_service"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|center_horizontal"
        android:layout_marginRight="@dimen/oauth_margin"
        android:contentDescription="@string/oauth_loading" 
    />

    <ProgressBar
        android:layout_width="@dimen/oauth_height" 
        android:layout_height="@dimen/oauth_height"
        android:layout_gravity="center_vertical"
        android:layout_marginRight="@dimen/oauth_margin" 
    />
</LinearLayout>

La parte más importante para poder interferir en el funcionamiento del WebView consiste en declarar una clase que extienda de WebViewClient. Ésta será la que nos dará los callbacks:

• onLoadResource(WebView view, String url): Notifica a la aplicación de que un recurso especificado por la página va a ser cargado.
• onPageFinished(WebView view, String url): Notifica que la carga de una url ha sido completada.
• onPageStarted(WebView view, String url, Bitmap favicon): Notifica que la carga de una url va a comenzar.
• onReceivedError(WebView view, int errorCode, String description, String failingUrl): Notifica un error de conexión con una “failingUrl”.
• onReceivedSslError(WebView view, SslErrorHandler handler, SslError error): Notifica un error de SSL.
• shouldOverrideUrlLoading (WebView view, String url): Nos permite modificar el comportamiento de carga de una URL devolviendo false.

Anidaremos esta subclase dentro de nuestra Activity para tener acceso a todos los recursos (Views especialmente), y no tener que andar manejando handlers o intents para visualizar u ocultar una View:

private class LoginWebViewClient extends WebViewClient {

	@Override
	public void onPageFinished(WebView view, String url) {
		showLoadingImage(View.GONE);
	}

	@Override
	public void onPageStarted(WebView view, String url,
		android.graphics.Bitmap favicon) {
		showLoadingImage(View.VISIBLE);
	}

	@Override
	public void onReceivedError(WebView view, int errorCode,
		String description, String failingUrl) {
		showErrorMessage(getString(R.string.error_trying_to_connect) + ": " + description);
	}

}

Para que todo esto funcione solo nos queda realizar la petición a la URL que queramos:

webview.setWebViewClient(new CustomWebViewClient());
webview.loadUrl(url);

En este punto tenemos acceso completo al navegador: desde interceptar URLs para que no se descarguen, habilitar JavaScript o no, o recibir notificaciones con cada página descargada en el cliente. Los límites los pone el desarrollador.

Para los que sientan curiosidad por este tipo de cosas, la nueva web está basada en node, express, less, HTML5 y CSS3. Salvo node, todo lo demás son herramientas de las que hablaremos la semana que viene.

¿Qué tienes que hacer para ganar tu plaza? Pues algo muy sencillo: basta con responder en Twitter quién no tiene relación con la persona que aparece en su foto de perfil.

En nuestra nueva página del equipo hemos puesto nuestras fotos de cuando éramos niños pero hay alguien que puso una foto que no guarda relación. ¿Quién crees que es?

Manda tu respuesta y el lunes, entre todos los que han adivinado, sortearemos el ganador y lo anunciaremos en Twitter. ¡No dejes de intentarlo! El cierre del plazo es el Lunes 16 a las 12:00 (GMT+1, para los que se vean listos).

Durante los próximos tres días iremos descartando gente que no es en nuestro perfil de Twitter.

¡Buena suerte!

La vida es demasiado corta para estar actualizando tu navegador.

LiveReload es una aplicación que te permite actualizar tu navegador automáticamente cada vez que se modifica un archivo, incluso compilando desde Sass / Less / CoffeeScript.

En pocas palabras, te ahorra el tedioso a muerte “Alt-Tab F5″.

Instalación y configuración

La instalación en Mac OS o Windows es bastante sencilla, aunque la situación se vuelve un poco más delicada con Linux (¡sorpresa, sorpresa!), donde se hace necesario utilizar la versión 1.9 de Ruby:

sudo apt-get install ruby1.9.1 ruby1.9.1-dev

Ya puedes utilizar RubyGems para obtener la aplicación. Dentro de tu carpeta de proyecto, ejecuta:

sudo gem install bundle

sudo gem install guard

sudo gem install guard-livereload

bundle init

Ahora edita el recién creado Gemfile y añade las siguientes dos líneas:

gem guard

gem guard-livereload

bundle exec guard init livereload

Monitorización de ficheros y extensiones del navegador

Tu Guardfile generado incluye algunas carpetas predefinidas a través de expresiones regulares que podrías tener que modificar si lo tuyo no es un proyecto Rails.

Arranca el servidor Guard:

$ bundle exec guard

Guard uses NotifySend to send notifications.

Guard is now watching at '/home/me/workspace/project'

LiveReload 1.6 is waiting for a browser to connect.

>

En este punto nadie te impide crujir nudillos y empezar a probarlo…

Descarga la extension LiveReload para tu navegador (Chrome, Firefox) y entra en la configuración (click con el botón derecho -> opciones) para especificar el hostname y puerto utilizado por el servidor Guard (por defecto localhost:35729).

Una vez habilitado, el servidor guard-livereload se conectará:

> Browser connected.

Browser URL: http://mymachine:myport/

¡Disco!

Si has llegado hasta aquí, todas modificaciones de los archivos monitorizados (CSS stylesheets, imágenes) serán notificadas y aplicadas inmediatamente en el navegador, sin necesidad de refrescar.

Guard viene con muchos sabores diferentes para automatizar tareas en distintos entornos.

Configura el tuyo o sigue este interesante screencast de los creadores de la herramienta.

Responsive Web Design o, Diseño Web Sensible en la lengua de Cervantes, hace referencia a una metodología de diseño y desarrollo web en la que con una única versión de nuestro website abarcamos cualquier dispositivo donde podrá mostrarse sin tener que hacer versiones paralelas del mismo dependiendo del dispositivo en el que se vaya a visualizar tal y como pasaba hasta ahora.

Antes solíamos redirigir el tráfico de nuestro sitio en función del dispositivo de visualización, con esta metodología no será necesario hacer esto más ya que haremos todo ese trabajo utilizando propiedades CSS3.

El precursor de esta metodología es Ethan Marcotte, diseñador y desarrollador web con dilatada experiencia en este campo y colaborador habitual del blog A list apart entre otros.

No son pocas las ventajas que nos brinda el responsive web design, para empezar nos ahorramos desarrollar y mantener otro sitio para dispositivos móviles y tampoco será necesario hacer sniffing del user agent, técnica totalmente desaconsejada porque es relativamente fácil dejarse dispositivos y/o versiones de navegador por fuera y que luego nuestra web no se visualize correctamente si se producen cambios de versión o aparece un navegador nuevo.

Esta metodología se apoya básicamente en estos tres pilares:

• Fluid grids. Se usan porcentajes para las medidas de los contenedores en el layout, esto hace que nuestro diseño se vaya adaptando estirándose o encogiéndose según el tamaño de la ventana del navegador.
• Imágenes flexibles. Esta técnica se basa en utilizar porcentajes en vez de pixeles para determinar las medidas de las imágenes, de esta manera se consigue que estas escalen dependiendo del tamaño de su contenedor
• Media queries. Son introducidos en el estándar CSS3 y sirven para filtrar selectores css dependiendo de determinadas condiciones, en este caso ancho de la pantalla del dispositivo y/o ventana del navegador.

Para ilustrar todo esto vamos a definir una página sencilla que se adapte correctamente a diferentes tamaños de pantalla. La página contará con una cabecera, menú superior, contenido principal, lateral y pie. Su código html es este:

<!DOCTYPE html>
	<html lang="es">
	  <head>
	    <meta charset="utf-8">
	    <title>Responsive Design Test</title>
	    <link href="styles.css" rel="stylesheet">
	  </head>
	  <body>
	    <header>
	      <h1>Responsive Web Design</h1>
	    </header>
	    <nav>
	      <ul>
	        <li><a href="#">Inicio</a></li>
	        <li><a href="#">Sobre nosotros</a></li>
	        <li><a href="#">Qué hacemos</a></li>
	        <li><a href="#">Contacto</a></li>
	      </ul>
	    </nav>
	    <div >
	      <article>
	        <h1>Proin eu arcu</h1>
	        <img src="image.png" alt="" />
	        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla consequat auctor pretium. Curabitur eget lectus vitae leo dignissim sodales. Vivamus sit amet dui nunc. Duis dapibus ante ac dolor sodales malesuada. Nam varius nibh non lorem bibendum ut fringilla elit tincidunt. Suspendisse quis pellentesque leo. Duis dapibus ante ac dolor sodales malesuada.</p>
	        <p><a href="#">Ver más</a></p>
	      </article>
	      <article>
	        <h1>Ultricies ante</h1>
	        <img src="image.png" alt="" />
	        <p>Praesent pellentesque sem vel nulla lacinia in dignissim augue consequat. Suspendisse potenti. Sed non justo suscipit purus dapibus condimentum. Ut mi mauris, primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce auctor ante ut ante cursus mollis. Donec porttitor scelerisque tortor fringilla sodales. Pellentesque vel sem massa. Duis eget est vel leo sodales tristique nec at tortor.</p>
	        <p><a href="#">Ver más</a></p>
	      </article>
	    </div>
	    <aside>
	      <h1>Contenido relacionado</h1>
	      <ul>
	        <li><a href="#">Maecenas iaculis tempus</a></li>
	        <li><a href="#">Vestibulum quis justo eros</a></li>
	        <li><a href="#">Nullam ullamcorper vulputate</a></li>
	      </ul>
	    </aside>
	    <footer>
	      <p>© Sit amet consectetur nunc condimentum 2012</p>
	    </footer>
	  </body>
	</html>

html {
	background-color: #ccc;
}
body {
	width: 960px;
	margin: 0 auto;
	background-color: #fff;
}
header {
	margin-top: 10px;
	padding: 0 10px 5px 10px;
	font-size: 32px;
	color: #fff;
	background-color: #01477b;
}
header > h1 {
	margin: 0;
}
nav {
	background-color: #0d7cb4; 
}
nav ul {
	margin: 0;
	padding: 0;
}
nav li {
	margin: 3px 10px;
	display: inline-block;
}
nav li:first-child {
	margin-top: 0;
}
nav li:last-child {
	margin-bottom: 0;
}
nav a {
	color: #fff;
	font-size: 26px;
	text-decoration: none;
}
nav a:hover {
	text-decoration: underline;
}
#content {
	float: left;
	width: 70%;
	padding: 0 10px;
	background-color: #fafafa;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}
article {
	padding: 10px 0;
	border-bottom: 1px solid #ccc;
	overflow: hidden;
}
article h1 {
	margin: 0 0 10px 0;
	font-size: 22px;
}
article img {
	float: left;
	margin: 10px 20px 10px 0;
}
article a, aside a {
	color: #000;
	text-decoration: none;
}
article a:hover, aside a:hover {
	text-decoration: underline;
}
aside {
	float: right;
	width: 28%;
	padding: 10px;
	background-color: #edf2f6;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}
aside h1 {
	margin: 0;
}
aside ul {
	margin: 0;
	padding: 0 0 0 20px;
}
aside li {
	margin-top: 10px;
}
footer {
	clear: both;
	padding: 4px 10px;
	font-size: 18px;
	color: #fff;
	background-color: #000;
}
footer p {
	margin: 0;
}

<meta name="viewport" content="width=device-width, initial-scale=1.0">

html {
	-webkit-text-size-adjust: none;
}

@media only screen and (max-width: 940px), only screen and (max-device-width: 940px) {
	body {
		width: 100%;
	}
	header {
		font-size: 1.5em;
	}
	article img {
		width: 37%;
	}
	aside h1 {
		font-size: 1.2em;
	}
}

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
	header {
		margin-top: 0;
		font-size: 1.2em;
	}
	header h1 {
		text-align: center;
	}
	nav li {
		display: block;
		text-align: center;
		padding: 5px 0;
		border-bottom: 1px solid #fff;
	}
	nav li:last-child {
		border-bottom: none;
	}
	#content, aside {
		float: none;
		width: auto;
	}
	article img {
		margin-right: 10px;
		margin-bottom: 5px;
		width: 96px;
	}
	article a {
		display: inline-block;
		padding: 0 5px;
		text-align: center;
		font-size: 1.2em;
		color: #fff;
		background-color: #0d7cb4;
	}
	aside h1 {
		font-size: 2em;
	}
	aside li {
		padding: 10px 0;
		font-size: 1.2em;
	}
}

Nuestro curso HTML5 y CSS3 se impartirá dentro del plan de estudios de la Universidad de Alcalá de Henares a partir del mes de Marzo.

Extrema Sistemas y la UAH han llegado a un acuerdo mediante el cual se incluirá el curso HTML5 y CSS3 dentro del plan de estudios de la Universidad.

El curso formará parte de la oferta académica que tiene la universidad dentro de la modalidad de “Títulos Propios de la Universidad de Alcalá de Henares”. A partir del mes de Marzo habrá un estudio denominado “Formación en HTML5 y CSS3”.

El contenido del curso será proporcionado y actualizado constantemente por Extrema Sistemas e impartido por profesores de la UAH.

Los estudiantes de Ingeniería Superior en Informática de la UAH obtendrán 3 créditos en su currículo formativo por el estudio del curso.Estamos muy orgullosos de que nuestro curso esté empezando a ser valorado por varias entidades universitarias e incluido dentro del plan formativo de los alumnos.

Extrema Sistemas imparte desde hace ya dos años, de forma pública e in-house el curso HTML5 y CSS3, que está orientado a maquetadores de HTML y desarrolladores de código servidor (java, .NET, etc.) de capa web.

El curso tiene una duración de 24 horas e incluye 12 horas de ejercicios prácticos con múltiples herramientas, locales y remotas.

HTML5 y CSS3 presenta las mejores prácticas de desarrollo web desde una perspectiva de usabilidad y accesibilidad, con vistas a producir código más ligero y eficiente en la capa de presentación.

A lo largo del mismo se tratan las nuevas técnicas de desarrollo web basadas en los nuevos estándares del W3C, y al mismo tiempo se repasan las herramientas online para realizar desarrollos soportados en todos los navegadores.

Para conocer todas las convocatorias públicas del curso de HTML5 y CSS3 échale un vistazo a http://extrema-sistemas.com/es/formacion/html5-y-css3

Si estás interesado en contratar este curso en modalidad in-house para que se imparta en las instalaciones de tu empresa ponte en contacto con el Departamento de Formación a la dirección: training@extrema-sistemas.com

Te resumimos los aspectos más importantes, ¡para animarte a ir!

Codemotion es un evento organizado por las comunidades, para las comunidades.

Este evento es una oportunidad única para mezclar en un mismo recinto comunidades como Java, Rails, JavaScript o Agile. Si estás esperando para conocer alguna tecnología que te saque de tu zona de confort, ¡éste puede ser tu día y Codemotion puede ser tu excusa!

En Extrema Sistemas, como partner certificado de SpringSource en Expaña e Italia tuvimos la oportunidad de patrocinar el Codemotion de Roma del año pasado. La experiencia fue tan increíble que, llenos de ilusión, no tuvimos ninguna duda en proponer la misma idea a las comunidades tecnológicas españolas. ¡Su respuesta ha sido un verdadero éxito! De hecho, ¡19 comunidades están ahora coorganizando el Codemotion de Madrid!

Este evento es único porque por primera vez reunirá en España a técnicos, desarrolladores y estudiantes de todas las comunidades y lenguajes.

Hay un call for papers público (que estará abierto hasta el 1 de Febrero así que si tienes algo interesante que contar, ¡envía tu propuesta ya!) donde las propuestas son recibidas y evaluadas por las propias comunidades. Estas confeccionarán el programa del evento con las charlas elegidas.

Codemotion tiene un precio de entrada de sólo 10 euros que incluye cafés, comida pero sobre todo la posibilidad de un ¡networking increíble! La inscripción oficial se abrirá a mediados de Febrero pero mientras tanto ve preinscribiéndote sin gasto alguno. ¡Esto ayudará a conocer el número de asistentes, su perfil técnico y a organizar mejor el evento!

Otro punto de innovación del Codemotion es el recruiting: cada asistente podrá dejar su CV a las empresas patrocinadoras, en el buzón que cada una de ella tendrá en su stand. Vista la situación laboral tan difícil que tenemos, ¿no te parece una muy buena idea?

¡Y no dura sólo un día! Durante toda la semana anterior las comunidades organizarán eventos locales, talleres, charlas y foros como adelanto del Codemotion. ¡Nos parece la ocasión ideal para profundizar argumentos e ir calentando motores para el evento!

Codemotion es además internacional: en Madrid y Roma el mismo día. Además para que no te pierdas las charlas más interesantes de ambos eventos, habrá streaming en directo con emisión de las charlas de los mejores ponentes internacionales en una sala dedicada.

Puedes apoyar al Codemotion patrocinándolo pero también puedes aportar tu granito de arena pasando la voz, ofreciéndote como voluntario para la organización y publicando un banner en tu web o blog.

Toda la información que necesites está en http://codemotion.es (y si no fuera suficiente, ¡escribe a info@codemotion.es !)

¿No serás el único en perdértelo?

Sigue Codemotion

• Twitter
• Linkedin

Hace aproximadamente un año que empezamos a impartir nuestro exitoso curso de html5+css3. Tras escuchar las críticas y mejoras propuestas por nuestros alumnos y trabajar en ellas, podemos, finalmente anunciar la versión 1.0 del mismo.

De las múltiples mejoras y características introducidas resumimos las siguientes:

• schemas.org. Examinamos a fondo el nuevo estándar creado por Google, Microsoft y Yahoo basado en microdata para incorporar semántica a nuestros contenidos. Sobre esto ya habíamos escrito una entrada en este mismo blog, puedes visitarla aquí.
• Slides del curso con iconos indicativos del grado de soporte de las diferentes características según el navegador y su versión.
• Etiquetas html condicionales para seleccionar las diferentes versiones de IE desde la css.
• Multiple image backgrounds, ahora podemos usar más de una imagen de fondo en un mismo elemento html.
• Background size, con esta propiedad podemos ajustar el tamaño de las imágenes de fondo.
• Border image, con esta propiedad es posible usar una imagen para el borde de un contenedor, así podemos simular marcos fotográficos por ejemplo.
• Degradados css3 actualizados para dar soporte a las nuevas versiones de webkit (Chrome y Safari).
• Resize, esta nueva característica nos posibilita redimensionar elementos html como las capas, etc.
• CSS3 Pie nos permite utilizar la mayoría de selectores css3 en IE.

Estas son sólo algunas de las mejoras introducidas en el curso. Si tienes ganas de aprender las mejores y más actualizadas prácticas para usarlas en tus desarollos web deberías inscribirte en el curso. ¡No te arrepentirás!.