Vidablog

Me había prometido no volver a utilizar themes para WordPress que no fuesen de mi autoría (no tienen nada de malo, sólo algo personal), pero es que este nuevo theme me está haciendo pensar. Illacrimo es un nuevo theme para WordPress a tres columnas, y sin duda es el mejor theme para WordPress que he visto en meses.

Tiene algunos detalles, pero en general está muy cuidado. El diseño está a cargo de Design Disease y LifeSpy. Gran trabajo.

Mientras jugaba con CSS y curioseaba con la propiedad opacity, logré un efecto que había visto en algunos sitios pero creí que se hacía con Javascript. Se trata de reducir la opacidad de las imágenes en un mouseover con la propiedad :hover, creando así un curioso efecto:

En lo personal me parece un efecto bastante agradable, para implementarlo sólo hay que agregar a la hoja de estilos algo como esto: img:hover { opacity: .90; filter:alpha(opacity=90); }.

“filter:alpha” es un filtro para que la opacidad funcione en IE, y aclarar que la propiedad opacity no es una propiedad CSS válida.

Mi anterior theme, Anvys, lanzado hace dos semanas, ya son más que sólo algunos blogs usándolo (simplus también va bastante bien), eso me impulsa a seguir publicando themes para WordPress.

Estila es mi cuarto theme para WordPress. Características:

• Diseño limpio en dos columnas
• Soporte para Gravatar.
• XHTML & CSS válido.
• Probado en Firefox 2, Internet Explorer 6-7, Opera, Safari.
• Licenciado bajo Creative Commons Attribution-ShareAlike.

Descarga | Download: Estila v1.0
Demo online: Estila Demo

Personalmente este diseño me ha gustado mucho. Dudas, problemas encontrados o lo que sea, los comentarios abiertos .

Los chicos de N.Desin publican CSS Dock Menu, un menú en CSS y JS estilo el Dock de Mac OS X, el cual combina perfecto con iTheme.

Eso sí, habrá que añadir poco más de 30KB de los JS, más el peso de los íconos que nada ligeros son. Sacrificar peso por estética.

Leyendo esta anotación en Minid (si alguien me enseñara diseño web, tendría que ser un profesor que explique así) desubrí un truco CSS que no conocía, y sirve para eliminar el… borde punteado (dotted border) que sale cuando alguien clickea en un enlace, el cual se ve aún más feo al usar imágenes para reemplazar enlaces de texto.

Todo el truco está en: a:focus{ outline:none; }. Aplicando esto en nuestra hoja de estilos, eliminamos el feo borde punteado.

En ALT1040 me encuentro con un diseño no oficial para Google Reader que publica Leigh Hicks, y lo podemos adaptar fácilmente para el navegador que usemos. A mi me ha gustado bastante.

El diseño mejora mucho y lo hace algo más sencillo, pero que Google Reader siga siendo terriblemente lento nadie se lo quita.

No había comentado nada ya que aún lo estaba modificando y además no decidía si lo iba a dejar. Al final me ha gustado el resultado y éste es el nuevo diseño de Vidablog. El nuevo diseño es a dos columnas (aunque más bien es a tres), ligero, y basado en el theme Mill, prácticamente lo que se toma es la estructura, hay muchos cambios en la sidebar, los comentarios y la hoja de estilos.

Por otro lado, valida en XHTML/CSS, y estoy entre si dejar la alineación del texto justificado o a la izquierda. Si por ahí encuentran algún error o algo raro, agradecería lo comentaran .

Uno de los problemas con los que nos encontramos quienes hemos desarollado algún diseño Web, es ese Internet Explorer. CSS Vista es una aplicación que nos permite editar nuestro CSS mientas vemos los cambios en Internet Explorer y Firefox. De esta manera podemos ir maquetando el CSS y tratar de que en los dos navegadores el diseño se vea bien, o ir creando hacks para IE.

Una maravilla de programa, desde que lo uso mis diseños en Internet Explorer se acercan más a lo que realmente son. Otra buena recomendación es instalarse el pack de Multiples IE.

Desde willmayo publican “CSS Speech Bubbles” (no sé cómo traducir esto), pero básicamente sería algo asi como comidillas con CSS, que servirían por ejemplo para adaptar a nuestros comentarios para darles una mejor apariencia. Se ven bastante bien, y los bordes redondeados de las comidillas son con JS.

Tomaré en cuenta, por que para los bordes de los comentarios de Pandibia estoy usando un cutre-inválido -moz-border-radius .

Comentando sobre las joyitas que se consiguen con CSS y JS, una recopiación de 25 recursos para usar en diseños Web.