Aún siendo una de las deficiencias mas comunes en el diseño web en lo que a la accesibilidad se refiere, existen todavía profesionales empeñados en seguir maquetando sus páginas mediante tablas.

En general, no se permite su uso para maquetar a menos que cuando se alinea una tabla, los contenidos de las celdas se convierten en series de párrafos (es decir, de arriba hacia abajo) uno tras otro. Las celdas deben tener sentido cuando se leen en orden horizontal y deben incluir elementos estructurales (que creen párrafos, encabezamientos, listas, etc.) de modo que la página tenga sentido al ser alineada (p.e cuando el usuario desabilite el uso de tablas en su navegador). ver mas aquí.

En realidad, transformar una maquetación realizada con tablas a capas no es tan complicado. Básicamente se trata de  jugar con los estilos CSS “float” y “clear”, y una vez entendido nos puede resultar incluso más cómodo e intuitivo que hacerlo mediante tablas.

Float: Sirve para alinear un elemento, haciendo que los elementos que le rodean se alineen con respecto a él. Sus posibles valores son “left” (para alinear el elemento a la izquierda) y “right” (para alinearlo a la derecha).Un elemento con “float” debe tener definida su anchura.

Clear: Se utiliza conjuntamente con float. Utilizamos este estilo cuándo queremos que elementos que tienen cerca un elemento flotante (mediante “float”) dejen de alinearse junto a él. Sus posibles valores son left (el elemento no permite flotantes a su izquierda ), right (el elemento no permite flotantes a su derecha ) o both (el elemento no permite flotantes a ningún lado)

Vamos a comenzar con un ejemplo sencillo. Dos columnas.

<table>

<tr>

<td style=”width:40%”>Columna Izquierda</td>

<td style=”width:60%”>Columna Derecha</td>

</tr>

</table>

La transformación es muy sencilla y se va a repetir básicamente en todos los casos:

• Las etiquetas <table> y </table> las sustituremos por <div> y </div>.
• La etiqueta <tr> será eliminada
• Las etiquetas <td> y </td> serán sustituidas por un <div> flotante alineado a la izquierda: <div style=”float:left; width:xxx;”> y </div>
• La etiqueta </tr> será sustituida por un <div> que no permitirá flotantes a ningún lado: <div style=”clear:both; padding:0px; margin:0px;”></div>

Este sería el ejemplo completo:

<div>

<div style=”float:left; width:40%;”>Columna Izquierda</div>

<div style=”float:left; width:60%;”>Columna Derecha</div>

<div style=”clear:both; padding:0px; margin:0px;”></div>

</div>

En este otro ejemplo mostramos una página con cabecera, tres columnas y pie de página.

<table>

<!– Cabecera de Página –>

<tr>

<td colspan=”3″></td>

</tr>

<!– Cuerpo a 3 columnas –>

<tr>

<td>Izquierda</td>

<td>Centro</td>

<td>Derecha</td>

</tr>

<!– Pie de Página –>

<tr>

<td colspan=”3″></td>

</tr>

</table>

La transformación a capas …

<div>

<!– Cabecera de Página –>

<div>Cabecera</div>

<div style=”clear:both; padding:0px; margin:0px;”></div>

<!– Cuerpo a 3 columnas –>

<div style=”float:left; width:33%;”>Izquierda</div>

<div style=”float:left; width:33%;”>Centro</div>

<div style=”float:left; width:33%;”>Derecha</div>

<div style=”clear:both; padding:0px; margin:0px;”></div>

<!– Pie de Página –>

<div>Pie de Página</div>

<div style=”clear:both; padding:0px; margin:0px;”></div>

</div>

En este caso, nos ahorramos incluso la necesidad de añadir el atributo colspan de la celda que conforma la cabecera y el pie de página.

Los estilos han sido definidos en línea para que quede más claro. En vuestra mano está definirlos en un CSS externo mucho mas elegante.

Son muchos los ilustradores que nos envían sus portafolios al estudio. De entre todo ese montón de propuestas, se encuentran muchos ilustradores buenos y otros sobresalientes.

Entre los sobresalientes se encuentra, en mi opinión, el diseñador gráfico e ilustrador argentino Juan Carlos Federico.

aquí tenéis una muestra de sus trabajos.

juancarlosfederico.com.ar
masporquerias.blogspot.com

Tras la fiebre del Chiqui-chiqui, Bandai nos trae directamente desde el país nipón el Puchi Puchi.

El Puchi Puchi, es un juguetito o Gadget [wiki] bastante tonto consistente en ocho botones que simulan el sonido y la irresistible sensación de explotar las burbujas del papel de embalar. Cada vez que el usuario realiza cien estallidos, el Puchi Puchi reproduce un sonido sorpresa: el ladrido de un perro, una puerta abriéndose, un pequeño jingle…. Cuidado porque este artilugio amenaza con convertirse en imprescindible para todos los humanos estresados que pueblan el planeta, y es que en Japón se han vendido ya más de un millón de puchi puchis.

Los internautas adictos al puchi puchi ya tienen a su disposición el canal Youtube http://es.youtube.com/hazpuchipuchi para colgar sus videos puchicheando. El vídeo más original, divertido o atrevido se puede llevar una cámara de vídeo digital.

Fuente: marketingnews.es

Como viene siendo habitual, Google hace uso de su logo para conmemorar, recordar o participar de cualquier momento histórico. Este es el logo con el que Google españa (google.es) ha homenajeado al flamante ganador de la Eurocopa 2008.

Firefox lo ha conseguido. Según Spread Firefox se ha superado la cifra de 8 millones de descargas de Firefox3 en 24 horas y a pesar de haber finalizado, la cantidad de descargas por minuto se mantiene entre las 4000 y 5000 por minuto.

Y todo esto a pesar de que el invento no empezó del todo bien ya que faltando pocos minutos para su comienzo, (a las 17 horas UTC del 17 de Junio), sus servidores se colapsaron.

España, ha quedado en un honroso 5º puesto, con 346.398 descargas, por delante de países como Francia o Canadá y por debajo de Estados Unidos, Alemania, Japón y Reino Unido.

Aquí os dejo el TOP TEN de países con mayor número de descargas según Spread Firefox.

Ya llevan unos meses difundiendo el mensaje, pero no todos corremos a la misma velocidad y algunos llegamos siempre un poquito mas tarde.

De todos modos, nunca es tarde si la dicha es buena … así que aquí os dejo mi humilde contribución a la causa.

Tras unos meses en fase Beta, los internautas ya podemos disfrutar de la versión definitiva del nuevo Firefox 3.

Para celebrarlo, han convocado a todos los usuarios ha participar de lo que han llamado el “dia de la descarga” Download Day. Se trata de conseguir el Record Guinness al software mas descargado en 24 horas. Para ayudar a conseguirlo, descarga Firefox 3 antes de las 18:16 UTC del 18 de junio de 2008. Eso son las 11:16 en Mountain View, 14:16 en Toronto, 15:16 en Río de Janeiro, 20:16 en París, Madrid, Roma y Varsovia, 22:16 en Moscú y el 19 de junio de 2008 a las 2:16 en Pekín y a las 3:16 en Tokio.

En España, cuando escribo son las 8:30 de la mañana, se han realizado 121.830 descargas. Yo, por supuesto, ya me lo he descargado. Aquí os muestro el documento que así lo acredita y que también podeis conseguir en www.spreadfirefox.com/es-ES/worldrecord/certificate_form

Heroku es un servicio gratuito, con todo lo necesario, incluido el hosting con un url amigable, para crear un sitio web con Ruby On Rails.

Nos ofrece, entre otras cosas, una consola para comandos como generate, rake, test … y un editor con marcado de sintaxis y depuración. Todo esto a través del navegador. También nos ofrece, y esto es interesante, la posibilidad de permitir a otros programadores participar de nuestro proyecto y publicarlo en forma pública o privada.

Heroku está en fase beta y sólo está disponible a través de invitaciones. Si queréis probarlo podéis enviarme un mensaje con vuestro correo para hacérosla llegar a rumailster@gmail.com.

http://www.heroku.com

Desde Ruby fácil nos ofrecen otras alternativas a Rails para programar en Ruby.

http://rubyfacil-dg.blogspot.com/2008/06/alternativas-rails.html

No cabe duda de que la accesabilidad es un tema indispensable para todo desarrollador web. Y dentro de todo lo que abarca el conseguir diseñar un sitio web accesible, la usabilidad del mismo juega un papel fundamental.

Un modo de introducirse en este tema es a través de este manual repartido en la ponencia Como crear sitios web de exito,usabilidad web en la practica, celebrada en el Parque Tecnológico de Alava el dia 26 de mayo de 2008, y organizada por Araba Enpresa Digitala.

Los autores; Miguel Sanchez y Javier Eguiluz.

http://www.enpresadigitala.net/euskera/biblioteca/mostrar_fichero.jsp?id=1127