RSS : Articles / Comments


galeria de fotografias web en photoshop

miércoles, junio 02, 2010, Posted by Xabier Pérez, 2 Comments

Una galería de fotografías Web es un sitio Web con una página principal con imágenes en miniatura y páginas de galería con imágenes en tamaño completo. Cada página contiene enlaces que permiten al visitante navegar por el sitio.



Básicamente, lo que obtendremos al crear una galeria web, es una página en la que el visitante al hacer clic en una imagen en miniatura de nuestra página principal, la imagen en tamaño completo asociada se cargue en la página de la galería. Será entonces útil el comando Galería de fotografíasWeb para generar automáticamente una galería de fotografías Web a partir de un conjunto de imágenes.Photoshop proporciona una variedad de estilos para la galería que pueden seleccionarse mediante el comando Galería de fotografíasWeb.


Empezaremos por ir a Archivo>Automatizar>Galería de fotografías Web.


Se nos abrirá entonces una ventana con todas las opciones disponibles para la creación de nuestra galería Web. Lo primero que llamará nuestra atención es el menú emergente de Estilos, donde encontraremos diferentes plantillas de página Web que podremos aplicar a la galería. Deberemos fijarnos también que, cada vez que seleccionamos una plantilla de estilo diferente, en la parte derecha de nuestra ventana aparecerá una vista previa en miniatura de cómo quedera la galería. Deberemos tener en cuenta que cada plantilla de estilos de galería incluye varias opciones. Si utilizas un estilo preestablecido, algunas opciones pueden aparecer atenuadas o no disponibles para ese estilo concreto.

Si eres un usuario avanzado de HTML, puedes crear un nuevo estilo o personalizar uno editando un conjunto de archivos de plantilla HTML. Cada archivo de plantilla contiene código HTML y distintivos.Un distintivo es una cadena de texto que Photoshop sustituye cuando se define su opción correspondiente en el cuadro de diálogo Galería de fotografíasWeb. Para entender mejor un estilo existente, puede abrir y estudiar sus archivos de plantilla HTML mediante un editor HTML como Dreamweaver.


Una vez elegido el estilo definitivo que deseamos darle a nuestra galería Web, tendremos que seleccionar la carpeta que contiene las fotografías que utilizaremos. Para ello en la opción Imágenes de origen, haremos clic en Explorar. Se nos abrirá entonces una ventana emergente que redireccionaremos hasta nuestra carpeta de imágenes en nuestro ordenador.


Deberemos ahora, en la misma sección, darle una carpeta de destino para los archivos que se crearán una vez creemos la galería Web. Le daremos por tanto un clic al botón Destino y elegiremos la ruta de nuestra carpeta de destino. Photoshop nos ofrece también la opción de crear una nueva carpeta y otorgarle un nombre (opción que es conveniente).


A partir de aquí todo lo que haremos consistirá en personalizar nuestra galería web. Photoshop nos ofrecerá diferentes opciones de personalización en el menú desplegable de Opciones. Veamos todas sus opciones por separado según el manual oficial de Adobe Photoshop:

General: Opciones de extensiones de archivo, codificación y metadatos.
  • Extensión Utiliza .htm o .html como extensión del nombre de archivo.
  • Utilizar codificación UTF 8 para URL Utiliza codificación UTF 8.
  • Añadir atributos de altura y anchura para las imágenes Especifica las dimensiones, reduciéndose así el tiempo de descarga.
  • Conservar todos los metadatos Conserva la información sobre metadatos.
 
Titular: Opciones de texto correspondientes al titular que aparece en cada página de la galería. Escriba texto en cada uno de los campos siguientes:
  • Nombre del sitio Nombre de la galería.
  • Fotógrafo Nombre de la persona u organización propietaria de las fotografías de la galería.
  • Información de contacto Información de contacto de la galería, como por ejemplo el número de teléfono o el domicilio social.
  • Fecha Fecha que aparece en cada página de la galería. Por defecto, Photoshop utiliza la fecha actual.
  • Fuente y Tamaño de fuente (Disponible para algunos estilos de sitio) Opciones correspondientes al texto del titular.
 
Imágenes grandes: Opciones correspondientes a las imágenes principales que aparecen en cada página de la galería.
  • Añadir enlaces numéricos (Disponible para algunos estilos de sitio) Coloca una secuencia numérica (que empieza por el número 1 y termina por el número total de páginas de la galería) en sentido horizontal en la parte superior de cada una de las páginas de la galería. Cada número es un enlace a la página correspondiente.
  • Redimensionar imágenes Redimensiona las imágenes de origen al colocarlas en las páginas de la galería. Seleccione un tamaño en el menú emergente o introduzca un tamaño en píxeles. En Restringir, elija las dimensiones de la imagen que desea limitar durante la redimensión. En Calidad JPEG, seleccione una opción del menú emergente, introduzca un valor entre 0 y 12 o arrastre el regulador. Cuanto mayor sea el valor, mejor será la calidad de la imagen y más grande el archivo.
  • Tamaño del borde Especifica la anchura, en píxeles, del borde que rodea la imagen.
  • Uso de títulos (Disponible para algunos estilos de sitio) Especifica las opciones para mostrar los pies de ilustración de las imágenes. Seleccione Nombre de archivo paramostrar el nombre de archivo, o seleccione Descripción, Créditos, Título y Copyright para mostrar el texto de descripción procedente del cuadro de diálogo Información de archivo.
  • Fuente y Tamaño de fuente (Disponible para algunos estilos de sitio) Especifica la fuente y el tamaño de los pies de ilustración.
  
Miniaturas: Opciones correspondientes a la página principal de la galería, que incluyen el tamaño de las imágenes en miniatura.
  • Tamaño Especifica el tamaño de la miniatura. Seleccione un valor en el menú emergente o introduzca uno en píxeles para especificar la anchura de cada miniatura.
  • Columnas y Filas Especifique el número de columnas y filas de miniaturas de la página principal. Esta opción no se aplica en galerías que utilizan el estilo de cuadro horizontal o vertical.
  • Tamaño del borde Especifica la anchura, en píxeles, del borde que rodea cada miniatura.
  • Uso de títulos (Disponible para algunos estilos de sitio) Especifica las opciones para mostrar los pies de ilustración de las miniaturas. Seleccione Nombre de archivo paramostrar el nombre de archivo, o seleccione Descripción, Créditos, Título y Copyright para mostrar el texto de descripción procedente del cuadro de diálogo Información de archivo.
  • Fuente y Tamaño de fuente (Disponible para algunos estilos de sitio) Especifica la fuente y el tamaño de los pies de ilustración.
Colores a medida: Opciones correspondientes a los colores de los elementos de la galería. Para cambiar el color de un elemento, haga clic en su muestra de color y, a continuación, seleccione un nuevo color mediante el Selector de color de Adobe. Puede cambiar el color de fondo de cada página (opción Fondo) y del titular (opción Titular). 
 
 

Seguridad: Muestra texto sobre cada imagen como aviso disuasorio de robo.
  • Contenido Especifica el texto que se va a mostrar. Seleccione Texto personalizado para introducir texto personalizado. Seleccione Nombre de archivo, Descripción, Créditos, Título o Copyright para mostrar texto procedente del cuadro de diálogo Información de archivo.
  • Fuente, Color y Posición Especifique la fuente, el color y la alineación del pie de ilustración.
  • Opciones de rotación Coloque el texto sobre la imagen en un determinado ángulo.
 

Una vez dadas nuestras diferentes opciones de personalización solo nos faltará darle a OK y esperar a que Photoshop de manera automática genere nuestra galería Web (dependiendo del número de fotografías puede tardar más o menos tiempo). Un resultado podría ser uno similar a este:


En la carpeta de Destino que creamos anteriormente se generarán los siguientes archivos que deberemos subir a la Web. Si queremos volver a previsualizar nuestra galería Web bastará con hacer clic en el archivo llamado index.



2 Comments

bama730110 @ marzo 25, 2011

de este modo y asi como lo presentas me perece sencillo, gracias por tu aporte, si todo sale bien (jejejeje que eso espero) te mandare el linck para compartir lo elaborado con tu ayuda
gracias.

bama730110 @ marzo 28, 2011

hola soy yo de nuevo, ya cree mi galeria web en photoshop, lo de la subida al hostin sin problemas pero ahora como la enlazo en mi sitio web a quie es donde tengo dudas apoyame por favor, saludos