Galería o Visor de imágenes ¿Cómo crear un galeria de imágenes?

Crear una galería de imágenes o visor de imágenes sencillo y de buen diseño...

En busca de una buena galería de imágenes encontre esta opción que me pareció muy buena, haciendo cilck aquí puedes ver el siguiente ejemplo y así comprobar como funciona:

Lightbox:
Es una galería con lenguaje javascript y css muy sencilla y no hace falta tener mucho conocimiento al respecto, tal vez si un poco de css si se desea modificar el aspecto pero nada de programación. Les explico como hacerlo a utilizar es aplicación, paso a paso:

1. Ten lista la cantidad de imágenes en tamaño real y sus copias en miniatura que vayas a utilizar.
2. Crea una sencilla página web donde colocar las minaturas y establece un vínculos entre ellas y las tamaño real (originales). Te daré el siguiente ejemplo (verás que las incluí en una lista):
<ul>

<li>

<a herf="imagen01.jpg">

<img src="imagen01miniatura.jpg">

</a>

</li>

<li>

<a herf="imagen02.jpg">

<img src="imagen02miniatura.jpg">

</a>

</li>



</ul>

3. Ahora descarga los archivos necesarios de la última versión de lightbox en la página www.lokeshdhakar.com/projects/lightbox2/ donde dice Download

4. Colócalos en tu carpeta del sitio web, es decir en la misma carpeta donde tienes tu págian con las imágenes.
5. Ahora deberás seguir los siguientes tres pasos para que se active en tu página:


• Colocar este código en la etiqueta head de tu página para establecer un vínculo con los archivos de javascript externos (asegurate que la ruta indicada en src entre comillas se la de la carpeta en la que colocaste los archivos, si la colocaste en el mismo sitio donde está tu página no tendrás ningún problema):


<script type="text/javascript" src="js/prototype.js"></script>

<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>

<script type="text/javascript" src="js/lightbox.js"></script>


• También icluye en el encabezado, es decir, en la etiqueta head, el siguiente vínculo al archivo css:
• Ahora deberás agregar a la etiqueta
<a>

  donde colocaste el vínculo desde la imagen en miniatura la siguiente instrucción rel="lightbox[roadtrip]". Te daré un ejemplo siguiendo el modelo anterior:
  
<ul>

<li>

<a herf="imagen01.jpg" rel="lightbox[roadtrip]" >

<img src="imagen01miniatura.jpg">

</a>

</li>

<li>

<a herf="imagen02.jpg" rel="lightbox[roadtrip]">

<img src="imagen02miniatura.jpg">

</a>

</li>



</ul>
  
  
Bueno espero que te sea de ayuda, a mí personalmente me gustó mucho ...
Encotré otras opciones que ya colocaré en el blog también. Eso sí no tan fáciles de personalizar como esta...