Diseño web Colombia Macromedios

1. Flip! A jQuery plugin

2. jQuery Quicksand plugin

3. ImageFlow

4. Building an interactive map with jQuery instead of Flash

5. Slideout Tips With jQuery & CSS3

6. Zoomer Gallery

7. jQuery Circulate

How HTML5 is Going to Completely Change your Web App from Carsonified on Vimeo.

This infographic exhibits pioneers in the field of programming, along with the history and current statistics of various programming languages. Also included are some random facts and algorithm diagrams to make the infographic more visually appealing.

Via: http://www.smashingmagazine.com/2010/06/06/designing-the-world-of-programming-infographic/

El equipo de desarrollo de XHTML parece que va a trabajar hasta este año 2009 según esta noticia: XHTML 2 working group is expected to stop work y van a centrar sus esfuerzos en el desarrollo de html5.

El siguiente es un archivo pdf muy útil en el cual se pueden ver las descripciones, atributos y etiquetas soportadas por el html5, lo pueden descargar en el siguiente vínculo: http://www.smashingmagazine.com/2009/07/06/html-5-cheat-sheet-pdf/

¿Es hora de empezar a incluir el html5 en nuestros proyectos?, todos los navegadores no lo soportan todavía, inlcuso ie7 no lo soporta, falta esperar un tiempo, obviamente la cochinada de explorer6 no soporta nada, es más no soporto yo al ie6.

jQuery TOOLS es una muy útil librería escrita en jquery para realizar fácilmente:

• Menús basados en pestañas
• Tooltips
• Destacar elementos de la pantalla
• Ventanas modales, como lightbox, thickbox, multibox
• Galerías de fotos con diferentes tipos de scroll (barra de desplazamiento)
• Sencillas formas de incluir archivos de flash
• jQuery TOOLS con Flowplayer, un interesante skin para videos

Interesante artículo sobre un tema bien importante en el diseño web y es la utilización de elementos de programación para la organización del contenido.

Estas son las 8 soluciones últimamente utilizadas para organizar el diseño de su sitio web:

• Sliders, deslizan el contenido hacia los lados, arriba o abajo
• Menús de navegación basados en pestañas
• Ventanas modales (La modalidad de una ventana es como mantiene el foco respecto a las demás ventanas del sistema), las más usadas son el thickbox o el lightbox
• Elementos rollover o de intercambio,  elementos que se muestran cuando el usuario ubica el puntero del ratón sobre un área determinada
• Tooltip, elementos de ayuda
• Diseños progresivos, diseños que se van moviendo en un orden específico, hacia los lados, arriba o abajo, moviendo el contenido secuencialmente en nuestra pantalla
• Retículas, puede encontrar más información sobre que son en La retícula en el diseño gráfico
• Acordeones, se basan en la funcionalidad de los sliders y pestañas, mostrando grandes cantidades de contenido en un área reducida de la pantalla.
• Mega Drop Down Menu, menús similares a los rollover,  pero van más allá son una forma de mostrar información detallada sobre un producto.

Para lograr estos efectos se puede utilizar javascript,  jquery, prototype o mootools, en el artículo hay vínculos a los sitios en donde se puede conseguir el código e implementarlo.

Ver el artículo completo en inglés en Smashing Magazine

Dos excelentes alternativas para no utilizar flash, con las que podemos generar efectos de cambios de página con jquery, es decir como si estuvieramos pasando una página de un libro.

1. Efecto para tener un banner en la esquina de la ventana

Cuando ubicamos el cursor encima de la esquina del navegador se despliega el banner como si halaramos la página.

Demo

Como implementar el código

2. Efecto libro jquery

Efecto que permite cambiar las páginas como las de un libro en jquery

Demo e implementación

Hola, quiero compartir un truco para WordPress, por defecto tenemos urls en WordPress de la siguiente forma index.php/nombre de la página, para evitar esto si tenemos nuestro sitio web en un hosting que tenga servidor Apache, debemos incluir el siguiente código en el archivo .htaccess en la raíz de nuestro sitio.En caso de no tener este este archivo lo podemos crear con el bloc de notas y lo grabamos como .htacces

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]

¿Qué es el .htaccess?

El .htaccess es un archivo de texto oculto que contiene una serie de directivas para el servidor Apache. Cuando un cliente solicita un archivo al servidor, este busca desde el directorio raíz hasta el subdirectorio que contiene el archivo solicitado el archivo .htaccess y tiene en cuenta estas reglas antes de proceder con la petición, es decir, se aplican las normas especificadas al directorio en el que se encuentre .htaccess y los directorios por debajo de él.

Me encontré este script realmente útil al momento de necesitar cargar iframes en una misma página con altura variable, aunque usar iframes no es una práctica muy estandar a veces nos topamos con sitios que los usan.

¿Cómo usarlo?: Sólo se debe copiar este código entro de la etiqueta <head></head> del documento y cambiar en el código la variable: var iframeids=["elnombredemiframe"] y reemplazar "elnombredemiframe" por nombre del iframe que queramos que sea variable.

Este es el código html con el id del iframe: