LightBox
Bien, como todos sabéis los popup hace tiempo que pasaron a la historia del diseño web.
Afortunadamente y debido a varios motivos (usabilidad, y popup killers en navegadores) esta práctica ha desaparecido y ha dejado paso a otro tipo de popups, menos agresivos y más vistosos.
Hoy, buscando un LightBox para un proyecto nuevo, me he dado cuenta de que no tenía material en el blog, así que aquí os dejo unas cuantas reseñas que seguramente os puedan ayudar.
HTML 5
Desde hace tiempo el diseño web ha tenido que ir sufriendo las diferentes lecturas de los navegadores respecto al lenguaje de etiquetas de hipertexto que se utiliza para crear y poder visualizar los contenidos de las páginas web.
El Explorer empezó llevándose mal con el Netscape y ahora lo hace con todos los demás, particularmente hace mucho tiempo que tomé la determinación de prescindir de él, sin embargo sigo comprobando que cada uno de mis diseños se vea igual en él, porque sigue siendo una gran mayoría la que lo usa (aunque no creo que los motivos sean por haberlo elegido frente a otros).
Así que maqueto para firefox, porque así me aseguro que también funcionará para los demás navegadores importantes (safari, chrome, ópera…), y luego hackeo para explorer cuando es necesario.
Con el desarrollo del nuevo HTML 5, se está tratando al parecer, de conseguir minimizar todas estas incompatibilidades. Todavía se trata de una versión beta, aunque portales de la relevancia de youtube, ya han desarrollado su versión en este lenguaje.
No intentéis acceder a este enlace con explorer, como siempre será el último en subirse al carro…
La nueva versión HTML 5, trata de añadir semántica y usabilidad implícitas en sus etiquetas, para así de este modo eliminar ambigüedad e incluso facilitar más si cabe la labor a los buscadores.
A la hora de maquetar una web, lo que hacemos hoy en día es dividir las zonas de contenido con divs, estas etiquetas son siempre la misma y las diferenciamos a través de la CSS.
HTML 5 crea nuevas etiquetas para diferenciar los «divs» más usados en el desarrollo de una página web, veamos algunas de las más importantes: (más…)
Espectacular jQuery
«Diseño web con jQuery, cada vez más y más utilidades para hacer un sitio bueno usable y vistoso», esto es lo que una y otra vez vemos en todos los post relacionados con el jQuery.
Sigo recopilando utilidades para el diseño web, y sigo sorprendiéndome. No existe límite, las distintas librerías Ajax, como el jQuery o Mootools, nos proporcionan herramientas suficientes para poder construir un sitio web usable y vistoso.
Hoy vamos a ver, desde cómo hacer la galería de productos de Apple, hasta un modo impresionante de ocultar y mostrar información.
Carrito de la compra con Ajax
El diseño web se ha rendido definitivamente a las funcionalidades de AJAX, no sólo porque nos permite actualizar nuestra página sin refrescar la pantalla, si no también por la gran ayuda que supone para el diseñador a la hora de diseñar un sitio usable.
Existen cientos de ejemplos que respaldan su uso, en este blog ya hemos hablado en varias ocasiones de ejemplos muy útiles realizados con Ajax. En esta ocasión, vamos a ver un ejemplo en el que la usabilidad de una tienda online se hace infinitamente más clara y visual para el usuario.
Pixel Art
Mientras todos hablan mal del pixel, hoy en este blog de diseño web, vamos a hablar de verdaderas «obras de arte» realizadas sólamente con pixels.
El protagonista es pixel, y un escaparate de obras realizadas en pixelart, que seguro que alguno de vosotros ya habrá visto, pero que no deja indiferente a nadie.
Existen muchas galerías en Internet en las que poder consultar este tipo de obras, hoy, quiero aconsejaros bugpixel, web en la que podréis contemplar algunos trabajos muy buenos realizados con esta técnica (alguno incluso con movimiento en forma de gif animado. De verdad que merece la pena contemplarlo.
Diseño Web Horizontal
Hace ya tiempo que tenía ganas de hablar del diseño web horizontal.
Lejos de las creencias de los llamados «gurús» de la usabilidad, han ido proliferando muchas web relacionadas con el diseño, fotografía, revistas,… En las que en lugar de tener que desplazarse verticalmente por el sitio web, el desplazamiento se hace de modo horizontal.
En este tipo de webs nos encontramos con algún problemilla. El primero es que lo normal es que nuestro ratón sólo tenga scroll vertical, por lo que tendremos que ir desplazando manualmente el scroll de la barra del navegador, pero vamos a ver algún ejemplo en el que esto se soluciona de un modo perfecto.
El segundo y quizás el más importante, es que debemos de indicar de algún modo al usuario, que se encuentra en una web distinta, que si quiere más contenido tendrá que desplazarse horizontalmente.
Una solución, sería hacer un corte en la página, de modo que se dejase ver que hay más contenido hacia la derecha, por ejemplo, con un contenido cortado por la resolución de pantalla, pero tendríamos que tener presente las distintas resoluciones de pantalla para que esto funcionase. Así que lo normal es encontrarnos con unas flechas dibujadas que nos indican el desplazamiento.
En estos ejemplos podréis ir viendo cómo ha ido evolucionando este tipo de webs, desde el Html con tablas, hasta el uso de CSS.
