Armonía | En definitiva...

El script para activar los contenidos embebidos de un documento Web que mi amigo David Muñoz me pidió que publicara por aquí ya tiene página propia.

Pasaos por allí y echad un vistazo, no tiene desperdicio, un script muy útil. ¡Gracias David!

Blog con comentarios cerrados gracias al spam. Lo siento.

El señor David Muñoz, (no dispone de página web), me ha pedido que suba y publique este pequeño Javascript que ha preparado, y yo, encantado por la petición y por la calidad de lo que ha hecho, lo hago encantado

El script en cuestión sirve para, cito textualmente:

"JS Embedded Content" es una pequeña aplicación Javascript que permite la activación automática de los elementos OBJECT, EMBED y APPLET incrustados en un documento HTML (películas Flash, applets de Java, archivos de video, etc.); de esta manera se evita que estos elementos deban ser activados manualmente por el usuario, porcedimiento necesario para que pueda interactuar con ellos en Internet Explorer 7, algunas actualizaciones de Internet Explorer 6 y en algunas versiones de Opera 9.

Así se llama el último disco de Muse, Black Holes & Revelations, y como no podía ser de otra forma, tengo que hacer algunos comentarios al respecto.

Según mi opinión, es el peor disco de todos los que han sacado. Lo cual no tiene por qué ser malo, pero es lo que opino después de ver cómo se han alejado del estilo que me cautivó en Showbiz. Aquel estilo rabioso y triste al mismo tiempo se ha transformado en algo mucho más melódico, y lo que es peor, con muchos tintes electrónicos, (que no eléctricos).

Hay varias cosas del disco que no me convencen, entre las que destacan cosas como canciones que parecen sacadas de la banda sonora de Kill Bill, el uso de trompetas, o que Mathew Bellamy, (el vocalista del grupo), cante en "modo suave" durante la mayor parte del disco. Esto último me hace preguntarme si está perdiendo la capacidad vocal de la que ha hecho gala en los albumes anteriores... Esperemos que no.

Otra de las cosas que más me ha chocado ha sido el grandísimo parecido entre el sonido general de la canción Supermassive Black Hole y una canción de Britney Spears. Sí... no estoy loco, intentad escuchadlo. La canción de Britney es algo así como ^{My prerrogative}.

Si tengo que destacar algunas canciones del disco, me quedo con Assassin, Exo-Politics y la parte final de Knights of Cydonia.

Esto es una traducción de un artículo escrito por Dave Shea.

Sin duda alguna seguro que te has encontrado con un montón de problemas extraños cuando has tratado de crear un sitio Web usando CSS. Habrás terminado dándote cabezazos contra la pared una y otra vez. Este documento es un intento de hacer el proceso de diseño más sencillo, y tener una referencia rápida para ojear cuando tengas algún problema.

Si tienes algo que añadir al texto, por favor coméntalo aquí.

Existen traducciones disponibles en los siguientes idiomas: Francés, Alemán, Holandés, Italiano, Húngaro, Finlandés, Ruso, Portugués, Japonés y Chino simplificado. Eres libre de traducirlo a otros idiomas.

Cuando dudes, valida.

Cuando hagas pruebas, puedes ahorrarte muchos dolores de cabeza simplemente validando tu código primero. Código XHTML/CSS mal escrito puede acabar en un montón de problemas con tu layout.

Crea y prueba tu CSS en el navegador disponible más avanzado antes de probarlo en otros, no después.

Si creas un sitio Web probando en un navegador "roto", tu código se basará en los problemas de ese navegador. Cuando sea hora de probarlo en un navegador mejor adaptado a los estándares, te frustrará ver que todo se dibuja de forma incorrecta. En lugar de eso, empieza desde la perfección de un buen navegador, y luego haz las mejoras para los navegadores menos capaces. Tu código será más estándar desde el principio, y no tendrás que hacer muchos "hacks" para soportar otros navegadores. Hoy día, los mejores navegadores son Mozilla, Safari u Opera.

Cuando uses float en tu layout, asegúrate de limpiarlos correctamente.

Los float son especiales, y no siempre se comportan como esperas. Si te encuentras con que un elemento flotado se sale del elemento contenedor, o simplemente no se comporta como esperas, asegúrate de que lo que quieres es correcto. Échale un ojo al tutorial de Eric Meyer acerca de este problema.

Márgenes colapsados; Aplica padding o un borde para evitarlo.

Puedes pelearte con un espacio en blanco de más donde no lo quieres, o con nada de espacio donde quieres que haya algo. Si estás usando márgenes para ello, su colapsamiento será probablemente el culpable. Andy Budd lo explica a la perfección.

Trata de evitar darle padding o bordes y un ancho fijo a un elemento.

IE5 interpreta incorrectamente el modelo de cajas de CSS, lo que acarrea un montón de problemas con muchas cosas. Hay muchos modos de "rodear" el problema, pero es mucho mejor evitarlo del todo dándole el padding al elemento padre en lugar de al hijo que tiene el ancho fijo.

Evita el "Flash of Unstyled Content" en Internet Explorer.

Si usas @import para tus hojas de estilo externas, más tarde o más tempranos notarás cómo IE muestra un "flash" de la página sin formato antes de aplicar el CSS. Esto puede evitarse.

No uses min-width en IE.

Este atributo no es soportado por IE. Pero sí que trata width como min-width hasta cierto punto, así que con un poco de filtrado, puedes obtener el mismo resultado.

Cuando dudes, disminuye el ancho

Algunas veces los errores en el redondeo causarán cosas como que 50% + 50% sea igual a 100.1%, lo que termina rompiendo la maquetación en algunos navegadores. Trata de cambiar 50% por 49%, o incluso 49.9%.

¿El contenido no se muestra correctamente en IE?

Puede que estés sufriendo el bug Peekaboo, especialmente si se muestra cuando pasamos por encima de un enlace con el ratón. Mira en Position is Everything para una solución.

Ten cuidado al estilizar los enlaces si usas anclas internas.

Si usas anclas internas en tu código, (<a name="ancla">), te darás cuenta de que le afectan las pseudoclases :hover y :active. Para evitar esto, lo mejor es que uses id para las anclas, o estilizar con otra sintaxis ligeramente distinta: :link:hover, :link:active

Asegúrate de que el efecto que deseas existe en realidad.

Hay algunas extensiones propietarias de CSS que no están en la especificación oficial. Si estás tratando de aplicar filter o estilos a las barras de desplazamiento, estarás trabajando con código propietario que no funcionará en ningún navegador salvo en IE. Si el validador te dice que el código que estás usando no está definido, lo más probable es que sea propietario, y no funcione de forma consistente entre navegadores.

Divide y conquista: usa los comentarios para desactivar grandes secciones de estilos.

Especialmente útil cuando trabajamos con grandes y desconocidas hojas de estilos. Comenta la mitad del código. Si el problema aún ocurre, significa que está en la otra mitad. Comenta lo que queda y prueba de nuevo. Si el problema deja de ocurrir, está en la sección comentada. Refina el ámbito de los comentarios y prueba de nuevo. Continua hasta que el problema haya sido identificado.

Recuerda “LoVe/HAte” en los enlaces.

Cuando especifiques las pseudoclases para los enlaces, siempre recuerda este orden: Link, Visited, Hover, Active. Otro orden no funcionará de forma consistente. Considera el uso de :focus también, y modifica el orden por LVHFA, (o “Lord Vader's Handle Formerly Anakin”, tal y como sugiere Matt Haughey)

Recuerda “TRouBLEd” para los bordes.

La forma corta, (shorthand), de aplicar los estilos para bordes, márgenes y padding tiene un orden específico: en el sentido de las agujas del reloj empezando por arriba, o Arriba, Derecha, Abajo, Izquierda. Por tanto, margin: 0 1px 3px 5px; resulta en que no hay márgen por arriba, 1 píxel de márgen a la derecha, etc.

Especifica unidades para todos los valores que no sean cero.

CSS requiere que especifiques unidades en todas los valores como fuentes, márgenes, tamaños, etc. (con la excepción de line-height, que da la posibilidad de no usarla). Cero es cero siempre, sean píxeles, em, o cualquier otra cosa, no hace falta especificarle la unidad. Ejemplo: padding: 0 2px 0 1em;

Prueba diferentes tamaños de fuente.

Navegadores avanzados, como Mozilla u Opera, permiten redimensionar el tamaño de la fuente, no importa la unidad que uses. Algunos usuarios tendrán el tamaño de fuente del navegador definido más grande o más pequeño que el que tengas tú. Intenta acomodar tu diseño al rango más amplio posible.

Haz que las mayúsculas y las minúsculas concuerden entre tu HTML y tu CSS

Algunos navegadores son sensibles al cambio entre minúsculas y mayúsculas. Usar una clase como homePage está bien, siempre que seas consistente en el uso de la notación especificada. Aplicarle estilos a homepage causará problemas en algunos agentes de usuario estrictos, (como Mozilla).

Prueba embebido; lanza importado.

Si trabajas con estilos embebidos en el código HTML eliminas cualquier potencial posibilidad de errores de cacheo mientras pruebas. Esto es muy importante cuando trabajamos con algunos navegadores de Mac. Pero asegúrate de que cambias los estilos a una hoja externa, importada con @import o colocada con link antes de lanzar la Web

Añade bordes obvios para ayudar a encontrar fallos en la maquetación.

Una regla universal como div {border: solid 1px #f00;} puede ser un camino largo para encontrar errores en la maquetación. Pero colocar un borde específico a un elemento en concreto ayudará a identificar posibles problemas que pueden no resultar obvios de ningún otro modo.

No uses comillas en las rutas de las imágenes.

Cuando uses una imagen de fondo, evita colocar la ruta entre comillas. No son necesarias, y IE5/Mac tiene problemas con ellas.

No enlaces a hojas de estilo vacías colocadas con vistas de futuro, (para estilos de impresión, etc.)

IE5/Mac tiene problemas con las hojas de estilo en blanco, y el tiempo de carga de la página será mayor. En su lugar, coloca al menos una regla, o incluso un comentario, en la hoja de estilos para que este navegador no de problemas.

Además, hay otros elementos que se aplican específicamente al lado funcional de las cosas, pero se deberían tener en cuenta cuando desarrollemos:

Organiza tus archivos CSS

Asegúrate de comentar tus bloques de CSS de manera apropiada, agrupando selectores relacionados, y estableciendo unas reglas a la hora de nombrar las clases y los identificadores, los espacios en blanco y el indentado, (recomendación: usa un espacio simple en lugar de tabulación para evitar problemas multiplataforma), y un orden en las propiedades.

Nombra las clases y los identificadores por su función y no por su aspecto

Si creas una clase .azulgrande, y más tarde te piden que cambies el texto por pequeño y rojo, esa clase deja de tener sentido. En su lugar usa clases descriptivas, como .copyright o .comentario.

Confía en los filtros CSS solo como última opción.

Los hacks y los filtros CSS pueden ayudarte a aplicar, o no aplicar, estilos CSS de forma selectiva a varios elementos. En lugar de usarlos cada vez que encuentres un problema, encuentra la forma de aplicar el mismo efecto de una manera más "cross-browser", (para todos los navegadores). Aquí hay una gran lista de filtros CSS.

Combina selectores.

Mantener tu CSS ligero es muy importante para minimizar el tiempo de descarga; siempre que puedas, trata de agrupar selectores , usar las herencias, y minimizar la redundancia usando métodos cortos, (shorthand).

Ten en cuenta la accesibilidad cuando uses el reemplazamiento por imágenes

La técnica FIR tiene algunos problemas con los lectores de pantalla, y con aquellos que tienen las imágenes desactivadas. Existen alternativas; usa la más adecuada.

El autor de este blog se encuentra secuestrado en Azeroth. Esperemos que pueda liberarse pronto...

Kings of Convenience está formado por los norugeos Erlend Øyes y Eirik, y la única palabra que se me viene a la mente para describir su música es suave.

Tienen 3 álbums en el mercado, más algunos singles, y en cada uno de ellos imprimen su sello de extrema suavidad y delicadeza. Los instrumentos que mas se escuchan son la guitarra y el piano, más la agradable voz de Eirik.

Si bien se les puede acusar de ser un grupo repetitivo en sus composiciones, ya que las canciones son todas del mismo estilo, se disfruta mucho teniendo su música de fondo. Se crea un ambiente muy tranquilo, con sus momentos alegres y sus momentos melancólicos. Y como toda buena música debe, no deja indiferente.

Los álbums que tienen son:

• Quiet is the New Loud
• Versus
• Riot on an Empty Street

No es mi grupo favorito, desde luego, pero esta mañana, camino del trabajo, me sonaron en el iPod Nano varias seguidas y recordé lo agradable que resulta oirles, y quería compartirlo con todos. Espero que os gusten igual que a mi.

Viendo hace un momento las estadísticas de acceso a este blog, me he dado cuenta que ha aparecido en CSS Mania, y a fecha de hoy, con una puntuación de 7.

La verdad es que me sorprende mucho haber aparecido ahí, ya que mis cualidades en lo que se refiere a diseño no son ni mucho menos del nivel de las páginas que suelen aparecer en CSS Mania. Pero bueno, sea como sea, lo agradezco enormemente.

También quisiera aprovechar la ocasión para comentar que estoy haciendo mis primeros pinitos con programas de edición gráfica, (concretamente Photoshop), y lo primero que estoy "creando" es un nuevo diseño para este blog. Estoy totalmente abierto a sugerencias, al fin y al cabo sois vosotros los que lo visitáis, y sois vosotros los que tenéis que estar a gusto.

Con un poco de retraso os comento las compras que he realizado este mes de Abril en eMusic, el sitio de venta de música digital que uso habitualmente para satisfacer mis necesidades consumistas musicales.

En primer lugar compré el disco Hokane, de Aki Tsuyuko. Un álbum con un sonido que me recuerda mucho al sonido de algunos videojuegos de PSX. Algo infantil tal vez, pero muy agradable, melancólico y, en ciertos tracks, muy "rayante".

No podía faltar algo de jazz, esta vez con Miles Davis en directo, con el Live Jazz, Vol. 1. Un directo muy bueno con 6 tracks de fantástica música. Además de jazz también tenía ganas de algo de blues, así que me decanté por Albert King y Stevie Ray Vaughan en un directo llamado In Session.

Pero sobre todo este mes ha sido el mes de la música new age y de meditación, entre la que me gustaría destacar algunos discos de música para dormir, según los autores, con ondas "delta" que te ayudan a conciliar el sueño y dormir y descansar mejor. Lo he probado pero aún no me ha hecho mucho efecto. Los discos son: Ultimate Sleep System y Guided Meditation For Sleep.

Aparte de los dedicados a dormir, también he comprado muchos otros, entre los cuales hay varios con sonidos de la naturaleza, como Forest Raindrops, muy agradables de colocar como sonido ambiental de fondo mientras haces otras cosillas. Pero sobre todo, uno que me ha llamado mucho la atención es Soundscapes - Music From The Rivers, de Hari Prasad Chaurasia, música ambiental con mucha percusión, merece la pena echarle un rato para oírlo.