Generadores de menús de navegación basados en CSS

En BLOG AND WEB encuentro un artículo escrito por Francisco, de los que a mi me gustan, sobre los menús de navegación, uno de los elementos principales de un sitio web, su buen funcionamiento y diseño influyen directamente en la forma en que el lector encuentra la información. Un factor a considerar en los menús es la compatibilidad entre navegadores, siendo los basados en CSS, los que tienen menos problemas. A continuación nos presenta un listamos de varios sitios conocidos que pueden ayudarte en la elección perfecto para tu blog o web:

• CCSPlay. Ofrece una gran cantidad de menús en CSS, están clasificados por: textos, pestañas, botones, bordes, esquinas redondeadas, con listas de definición y en múltiples capas, en todos los casos se te brinda el código HTML y CSS.

• CSS Menú Maker. Ya comentado en CSS Menu Maker, generador de menús. Es una opción bastante interesante, pues te da la opción de descargar las imágenes, el código HTML y CSS (Download Source Code) de cada menú para que lo personalices por tu cuenta o puedes usar su asistente (Customize) y crearlo totalmente en linea, para después descargarlo e implementarlo directamente en tu blog o web.

• Listamatic (de MaxDesign). Ya comentado en Listamatic, casi todos los menús de navegación mediante CSS. Provee de una gran cantidad de menús basados en listas de elementos, puedes encontrar menús verticales, horizontales y experimentales (poco comunes pero interesantes) con sus respectivos códigos para implementarlos. También encontraras algunos artículos para aprender a crear los tuyos o aplicarlos a tu sitio. Aquí tienes los enlaces: Listamatic 1, Listamatic 2

• Exploding-boy. Una bonita galería de menús basados en pestañas, hay gran variedad de diseños pero hay que ver el código fuente para sacar el código del menú.

• List-O-Matic (de Accessify.com). Es un generador de menús CSS bastante práctico y sencillo de usar con el que puedes crear tanto menús verticales como horizontales para aplicarlos directamente en tu sitio.

• Free Menu Designs (de e-lusion.com). Tienen un total de 9 bonitos menús verticales para descargar en zip bajo licencia Creative Commons.

• Alsacreations. Tiene una galería con menús bastante peculiares, el único “inconveniente” es que tienes que obtener el código desde las páginas de ejemplo.

Mi pequeña aportación a la lista de Blog and Web:

• Quick menú  Los menús son muy fáciles de crearlos con esta aplicación en linea que te permite crear este tipo de menús de forma relativamente rápida, personalizada y con grandes resultados. Más información en: Quickmenu, útil generador en línea de menús desplegables.

Entre todos ellos seguro que encuentras alguno que te sea útil. Pero si con todo ellos no te basta, puedes darle un vistazo a los siguientes enlaces:

• Lista completa de menús realizados con CSS

• Selección de menús de navegación con CSS

• Colección de algunas barras de navegación mediante CSS

CSS Menu Maker, generador de menús

En la página CSS Menu Maker, tenemos un generador de menús CSS, que nos proporcionan una serie de menús tanto horizontales (7) como verticales (5), que pueden ser adaptados a nuestras necesidades para luego descargar su código.

Algunos menús horizontales con efecto rollover

En XIBERNETICOS tenemos una selección de menús del sitio Cssplay que siempre es un lugar a tener en cuenta a la hora de buscar recursos para nuestros proyectos web, aquí tenemos una pequeña lista de bonitos menús que podrás usar en tus proyectos:

• Professional drop-down using images: Descarga y Demo.

• Professional horizontal series (10 diferentes menús): Cada una de ellas tiene una descarga diferente puedes verlas en la Demo.

• Professional drop-down using images and text: Descarga – Demo.

• Professional centered sliding doors dropline menu (con 3 variaciones): Cada una tiene asociada una descarga diferente, puedes ver la Demo

NetworkBar Generator, para generar una barra de navegación

En el blog VAGABUNDIA nos enseña que con NetworkBar Generator podemos crear una barra de navegación personal, al estilo de la barra de Blogger, con menús desplegables. Pero antes tienes que registrarte.

Tutorial para crear una barra de navegación estilo Vista con CSS

En BLOG VECINDAD… nos dan el enlace a Creating a vista style nav bar in css, un tutorial para crear una barra de navegación con CSS, al puro estilo Vista. Como la imagen que tienes a continuación:

• Puedes ver el resultado en la siguiente demo .

• Puedes efectuar la descarga  en formato zip.

Fancy Sliding Tab Menu, menús con estilo con javascript

En el blog ANIETO2K nos presenta a Fancy Sliding Tab Menu, donde podemos disfrutar de unos menús en javascript cargados de movimientos gracias a script.aculo.us. [Demo] [Descarga].

• Actualización: En Xiberneticos tenemos el artículo Fancy Sliding Tab Menu V2, con todos los detalles del código empleado.

Nueve menús horizontales de calidad profesional

Los de CSSPLAY se superar día a día, en esta ocasión mediante una serie de menús horizontales de la calidad profesional usando las técnicas de las “sliding doors”, en el artículo Professional horizontal series, tienes la muestra y descarga a cada uno de ellos.

• Actualización (29/agosto/2007): Otro menú para añadir a la lista puede ser Professional drop-down (CSSPlay).

Quickmenu, útil generador en línea de menús desplegables

Otra vez en BLOG AND WEB, que hoy esta muy productiva comenta sobre los menús desplegables, un elemento versátil, elegante y dinámico en la navegación de un sitio, pero con la dificultad para crearlos, te hace pensarlo antes de utilizarlo, mira este ejemplo para ver si estás de acuerdo o no. Pero con Quick menú lo tenemos más fácil, es una aplicación en linea que te permite crear este tipo de menús de forma relativamente rápida, personalizada y con grandes resultados.

El proceso general es el siguiente:

1. Selecciona el diseño. Ofrece varias opciones de diseño, selecciona el tuyo en base a la necesidades de espacio y la cantidad de opciones que necesitas, hay varios diseños horizontales y algunos verticales. Una vez seleccionado da click en el botón “Customize Menu”.
2. Personaliza tu menú. La interfaz para personalización es bastante completa, puedes explorarla para ver como funciona. Las opciones de estilo (colores, viñetas, espacios, etc.) las encuentras del lado derecho, opciones de configuración (html, script, etc) en los menús superiores y para cambiar los links y el texto en los menús solo tienes que dar doble clic en cada elemento. Pude llevar un rato conocer la aplicación, pero para necesidades básicas te darás cuenta que resulta muy intuitivo.
3. Exportación del código. Una vez que hallas completado tu menú, vas al menú “file” y luego a “save” para obtener todo el código necesario.
4. Aplicación. Para colocarlo en tu blog o web, solo hay que colocar cada parte de código en su lugar. Los estilos y scripts entre la etiquetas <head> y </head> y el html del menú justo donde quieras mostrarlo. La estructura misma del código exportado ya trae este orden y puedes usarlo como guía.

Esta aplicación en linea me ha sorprendido para bien, es la versión gratuita de un software de escritorio con más opciones y plantillas, aun así es un recurso muy útil para la creación de un menú de este tipo.

La Iglesia Anglicanas alquilará las agujas de sus parroquias para antenas de telefonía móvil

Según he leído en EL PAÍS, las parroquias de la Iglesia Anglicana han recibido luz verde de un tribunal eclesiástico para que alquilen sus agujas y torres a compañías de telefonía móvil que quieran instalar allí sus antenas. El máximo tribunal eclesiástico de Arches revocó una orden anterior por la que se prohibía a las parroquias alquilar sus edificios para ese fin con el argumento de que así se protegía a los menores de la pornografía que se difunde a veces por esos servicios de telefonía.

El tribunal justificó su veredicto, del que informa hoy el diario «The Daily Telegraph«, en el hecho de que ya existen restricciones destinadas a impedir que los niños puedan ver imágenes indecentes en las pantallas de sus portátiles.

Hace unos meses, el titular de la diócesis de Chelmsford, George Pulman, prohibió a la iglesia de los santos Pedro y Pablo, en Chingford (este de Londres) la colocación de una antena en ese edificio con el argumento de que «facilitaría la transmisión de pornografía«.

El tribunal de Arches, órgano con ocho siglos de antigüedad cuyas competencias se extienden a toda la provincia eclesiástica de Canterbury, ha dictaminado, sin embargo, ahora en sentido contrario. Según ese tribunal eclesiástico, aunque las antenas puedan facilitar el acceso de los adultos a ciertas imágenes pornográficas, hay que recordar que el ser humano es «imperfecto» y denegar permiso para la instalación de las antenas sólo sobre esa base no es correcto.

A partir de ese veredicto, numerosas parroquias británicas podrán aumentar sus ingresos, alquilando por miles de libras a las compañías de telefonía móvil sus agujas, donde las cruces dejarán de estar solas.

Como la Iglesia Católica los imiten, van a tener un filón de ingresos extras.

Selección de menús de navegación con CSS

Selección de 71 menús de navegación gratuitos realizados con CSS, en 71 Free CSS Menus (del blog A Blog you can use).

Barras de navegación ingeniosas utilizando CSS

En BLOG VECINDAD…, nos muestra en esta ocasión un buen tutorial Nifty Navigation Using CSS (de Rachel Andrew), que explica los paso para crear algunos métodos de navegación comunes utilizando técnicas en CSS: menús verticales, horizontales y con pestañas. Una buena opción para estudiar el código del CSS y entender como se logran.

Colección de algunas barras de navegación mediante CSS

Mediante un post de XIBERNETICOS, descubro una colección de algunas barras de navegación, de buen aspecto y de uso libre, que pueden utilizar en sus proyectos web o para inspirarte. Tienes unos 30 diferentes estilos en 30 Free CSS Based Navigation Menus.

¿Conoces otro menú de este tipo? ¿Cual agregarías a la lista?

8 versiones javascript del menú OSX

En el blog ANIETO2K comenta que si te gusta el dock OSX de MacOS y te gustaría integrarlo en tu página web, tienes unos cuantos de donde elegir:

1. CSS Dock Menu [Demo] Navegadores: IE 6, IE 7, Opera 9, Firefox 2 y Safari.
2. MacStyleDock [Demo] Navegadores: Firefox, IE6, IE7, Konqueror, Opera9,
3. iconDock [Demo] Navegadores: Firefox, IE6, IE7, Safari.
4. Dojo FishEye Widget [Demo] Navegadores: ??
5. MooTools FishEye [Demo] Navegadores: ??
6. iFishEye [Demo] Navegadores: IE, Firefox, Opera, Safari
7. euroDock [Demo] Navegadores: ??
8. Corner Dock [Demo] Navegadores: IE7, Firefox, Opera9, Safari.

Menu Square, sencillo y agradable

En el blog XYBERNETICOS, encuentro un menú increíblemente sencillo, pero a la ver con un diseño muy agradable.

Enlaces referentes a menú:

• Detalles del Css utilizado y el HTLM

• Demo