Ulzurrun de Asanza i Sàez

Month: July 2009

Un diseño gratuito para portafolios: Creative by Nature

Ayer liberaron en Smashing Magazine los links para descargar un theme para WordPress gratuito: Creative by Nature.

Creative by Nature está especialmente pensado para portafolios, aunque también permite usar las funciones de blog de WordPress, combinándolas con algunas páginas especiales para mostrar los últimos proyectos en los que el usuario ha trabajado.

Podéis ver una demostración del theme aquí­, o descargarlo desde aquí­.

Rota texto usando sólo CSS

Vía Anieto2k descubro un método muy sencillo para rotar texto usando CSS. Básicamente debemos usar las propiedades “-webkit-transform“, “-moz-transform“, “filter: progid:DXImageTransform.Microsoft.BasicImage()” para Webkit (y Safari), Firefox 3.5 (o posterior) e Internet Explorer, respectivamente.

Lamentablemente no son propiedades que forman parte del estándar de CSS 2, así que éste método sólo funcionará en navegadores que usen Webkit (como Safari o Google Chrome), Firefox 3.5 e Internet Explorer.

Finalmente el código que usaríamos sería el siguiente:

[html]
<div class="example-date">
<span class="day">31</span>
<span class="month">July</span>
<span class="year">2009</span>
</div>
[/html]

[css]
.year {
/* WebKit, Safari */
-webkit-transform: rotate(-90deg);

/* Firefox 3.5+*/
-moz-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
[/css]

Obteniendo este resultado:

Rotar textos

Se acabó WordPress 2.0.X

Ayer se anunció en el blog oficial de WordPress que la rama 2.0.x del conocido sistema de gestión de blog va a dejar de ser actualizada. Inicialmente la idea era descontinuarla en 2010, pero por varios motivos se ha decidido descontinuarla un poco antes.

Las razones que dan en el anuncio oficial es que muy pocos usuarios se quedaron en las versiones antiguas (teniendo en cuenta que actualizar WordPress es fácil y gratis, no veo motivo alguno para que un usuario se quede en una rama antigua, a no ser, claro, que tenga una instalación de WordPress muy modificada y no quiera volver a añadir los cambios en la nueva versión), además de que añadir algunas mejoras de seguridad sería una tarea “monumental” que podría acabar dando lugar a más errores de los que había antes.

Y vosotros, ¿vais a echar de menos la rama 2.0.x de WordPress? Yo sinceramente, no.


Consejos para diseñar los links "Sigue leyendo"

Ayer publicaron en Smashing Magazine una serie de ejemplos y consejos para diseñar bonitos links de “Sigue leyendo”, el típico link que encontraremos en cualquier blog. Podremos ver ejemplos de links simples y otros más complejos y bonitos, unos sin imágenes y otros con ellas.

Personalmente, me gustan mucho los links que utilizan imágenes, aunque prefiero ver el artículo entero sin necesidad de cargar una página más, como se puede hacer en casi todos los artículos de este blog.

Imágenes de cómo podría ser Firefox 4

Hoy han publicado en Genbeta imágenes de cómo podría ser la nueva interfaz de Firefox 4.

La nueva interfaz se caracterizaría por mezclar novedades de los diversos navegadores que hay actualmente, así uniría la barra de búsquedas y la de direcciones es una única barra, como hace Google Chrome. De Internet Explorer copiarían la idea de unir los botones de Ir, Recargar y Detener en un único botón, que cambiaría dependiendo del caso. Por último, de Safari copiarían el mostrar el proceso de la carga de la página en la misma barra de direcciones (que también sería de búsqueda).

Os dejo una par de imágenes a continuación.

Mockup Firefox 4Mockup Firefox 4

Reseteador de estilos CSS para HTML 5

Vía Anieto2k descubro un código CSS que resetea los estilos de HTML 5. Para los que no sepáis para qué sirve esto, cuando se diseña una web se suele comenzar poniendo unos aributos a todos los elementos para evitar que haya diferencias entre navegadores, ya que algunos muestran más separación entre párrafo, fuentes diferentes, tamañanos más grandes, etc.

Con la aparición de HTML 5, muchas etiquetas desaparecen y aparecen otras nuevas, con lo cual los antiguos reseteadores de estilo no nos servirán. Pues bien, éste que tenéis a continuación está totalmente pensado para HTML 5.

[css]/*
html5doctor.com Reset Stylesheet
v1.4
2009-07-27
Author: Richard Clark – http://richclarkdesign.com
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section, menu,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
display:block;
}

nav ul {
list-style:none;
}

blockquote, q {
quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content:”;
content:none;
}

a {
margin:0;
padding:0;
border:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}

mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}

del {
text-decoration: line-through;
}

abbr[title], dfn[title] {
border-bottom:1px dotted #000;
cursor:help;
}

table {
border-collapse:collapse;
border-spacing:0;
}

hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}

input, select {
vertical-align:middle;
}[/css]


Plugins en los foros: ¿Van por buen camino?

AddOns y Plugins, esos pequeños añadidos que ponemos en nuestros foros y que nos permiten tener nuevas funciones que no estaban por defecto en el foro. Algunos son más útiles y otros lo son menos, pero es cierto que prácticamente todos los foros usan algún que otro Plugin.

Los sistemas de foros gratuitos más conocidos (por ejemplo, phpBB y Simple Machines Forum) utilizan métodos similares para instalar los Plugins. El método que utilizan consiste en buscar un trozo de código en un archivo y reemplazarlo por otro. En phpBB esto se hace de forma manual (excepto utilizando otro Plugin) mientras que en SMF se hace de forma automática. Pero, ¿es esta una buena forma de instalar Plugins?

Bueno, ciertamente no es un método de instalar Plugins, sinó que es la forma de interactuar los Plugins con el foro. En este caso, no interactuan demasiado, modifican el código del foro y listo, nueva función añadida.

Puede que a simple vista parezca un buen método, pero si lo pensamos un poco veremos un gran problema: El código cambia y lo que en la versión 1.0 está en la línea 5 o tiene un aspecto A, en la versión 1.1 estará en la línea N y tendrá un aspecto totalmente diferente. Es decir, que la compatibilidad entre versiones no será más que casualidad.

Por otro lado, el segundo problema es que cuando actualizas la versión del foro eliminas los Plugins. Si un Plugin modifica el archivo a.php, y la siguiente versión incluye un nuevo archivo a.php, las modificaciones que hace el plugin se van al garete. Ambos problemas no se ven durante un primer uso del foro, sinó que van apareciendo cuando actualizas el foro.

Y bien, ¿entonces qué método usamos? Nosotros (los usuarios de los diversos sistemas de foros) no podemos hacer nada, son los desarrolladores de los foros los que quienen que hacer las modificaciones pertinentes en la forma de interactuar entre el foro y los Plugins.

¿Y qué método deberían incorporar? A mí el método que más me gusta es el que usa WordPress (y supongo que también bbPress, el sistema de foros creado por los mismos desarrolladores que el famoso sistema de gestión de blogs). Consiste en añadir filtros y acciones en diferentes puntos del foro. Los desarrolladores definen una serie de puntos en el foro, por ejemplo, el punto forumlistheader podría ser la cabecera del listado de foros (obviamente estoy hablando de Plugins que modifican el código interno del foro, no el aspecto, ése es un tema diferente), donde podríamos añadir un filtro que mostrase un recuento de todos las categorías que hay en el foro.

Este método permite una mayor compatibilidad entre versiones, ya que el punto forumlistheader lo definen los desarrolladores del foro y si en una versión se modifica el archivo donde está el punto forumlistheader, pueden recolocarlo en un lugar donde permite hacer las mismas cosas que antes.

También nos asegura que el Plugin no se borrará al actualizar, ya que éste añadirá filtros y acciones a los diversos puntos sin modificar el archivo original. En este método es el propio foro el que se encarga de buscar y añadir de forma dinámica y “sobre la marcha” las funciones correspondientes en los diversos puntos del foro. Así además se puede desinstalar un Plugin eliminando sólo el archivo que le corresponde, sin tener que deshacer las modificaciones que habría realizado en los archivos si hubiésemos usado el otro método.

Pero este método también nos permite tener interacción entre diversos Plugins. El programador de un Plugin puede añadir puntos en sus Plugins para que más adelante otro programador pueda usar el sistema de filtros y acciones con su Plugin y pueda crear añadidos para sus Plugins. Podría, por ejemplo, crear un Plugin para añadir vídeos en los mensajes del foro y un añadido para este plugin que permite insertar vídeos de Youtube.


Aprende a usar las carpetas inteligentes de Mac OS X

Hoy mirando el blog de un distribuidor de productos de Apple, K-tuin, descubro un interesante screencast que te vendrá como anillo al dedo si eres un nuevo usuario de Mac o no sabes cómo funcionan las carpetas inteligentes del Finder de Mac OS X.

A modo de resumen, el screencast explica cómo crear este tipo de carpetas que vienen a ser búsquedas avanzadas a las que se pueden acceder sin tener que volver a definir los parámetros de la búsqueda.

iGoogle se rediseña

Rediseño de iGoogle
Rediseño de iGoogle

Hoy me he encontrado una gran sorpresa al entrar en iGoogle y ver  que no estaban las pestañas en su sitio y que habían algunas diferencias más comparándolo con la versión que vi la última vez que entré.

A simple vista el mayor cambio es la nueva posición de la barra de pestañas, que ahora en lugar de estar en la parte superior está en el lateral izquierdo. Además ésta te muestra la lista de Widgets que usas en la pestaña que tienes abierta, permitiéndote ver sólo un Widget en la página o volver a ver todos los que tenías puestos.

También se ha integrado el chat que teníamos en Gmail en la barra de pestañas, con lo cual ahora podemos chatear directamente desde iGoogle.

Puedes ver las novedades comentadas más ampliamente en el tour guiado de iGoogle.


Descarga ya Thunderbird 3 Beta 3

Thunderbird
Thunderbird

Vía Genbeta descubro que ya está disponible la tercera Beta de Thunderbird, el conocido cliente de correo electrónico desarrollado por Mozilla.

En esta nueva versión podremos encontrar mejoras en la integración con Gmail y una interfaz mejorada, que ahora permite, entre otras cosas, abrir los mensajes en pestañas (como lo haríamos con un navegador), una nueva vista de resumen (que nos permite seleccionar diversos mensajes  y saber quién lo envía, el título, el tamaño y un par de líneas de los emails).

Se puede descargar la nueva Beta desde aquí.