Si bien es cierto que cuando diseñas para web, existen ciertos elementos comunes en cada diseño, cada tipo de sitio web tiene una serie de requerimientos propios y únicos, por ejemplo, la cesta de compras de las tiendas online. Esto es único de aquellos sitios donde puedes adquirir productos en línea o donde puedes comprar entradas a eventos, etc.
Si es la primera vez que realizas un sitio que tiene ciertos requerimientos especiales, es mucho más sencillo diseñar si investigas primero. Y qué mejor que ver sitios que compartan esas características para conocer cómo diseñarlos. Realmente es uno de los mejores caminos que puedes tomar cuando te enfrentas a cualquier proyecto de diseño web.
En este artículo compartimos algunos ejemplos de paginas web de zoológicos y acuarios. Esperamos que te sean de utilidad si alguna vez quieres desarrollar un proyecto de este estilo.
National Aquarium
Este sitio presenta un slider de imágenes que muestra alguna de las atracciones del lugar. El menú se encuentra centrado, aunque posee un menú extra en la parte superior derecha donde se puede ingresar a la tienda de regalos y obtener información sobre venta de tickets y horario de atención. En este menú adicional también podemos encontrar una útil barra de búsqueda.
Bajo el slider se destacan 3 noticias, cada una tiene una imagen, un título y una breve reseña, así como un botón de llamada a la acción. En el pie de página podemos encontrar los botones de redes sociales y un sencillo formulario de suscripción. Es un sitio sencillo, pero elegante.
Point Defiance Zoo & Aquarium
Este sitio pose un slider que se ubica en el centro. Todas las imágenes del slider se caracterizan por ser coloridas. De hecho, todo el sitio es bastante colorido y tiene un aspecto más familiar e infantil. El fondo presenta varias tonalidades de amarillo y se han colocado hojas y ramas alrededor del slider, un elemento que refuerza la idea de un zoológico y el hábitat natural de estos animales.
Bajo el slider podemos ver tres botones de diferentes colores, cada uno con una promoción distinta. Otro elemento que ayuda a dirigirse al público objetivo es la tipografía que es de bastones gruesos y el puntaje es mayor que el usual.
El menú se ubica en la parte superior sobre el slider. Tiene también una barra de búsqueda y un sencillo formulario de suscripción.
Nashville Zoo
Este sitio hace uso de las fotografías en gran tamaño y coloca un slider en todo lo ancho de su pantalla. Las fotografías muestran las especies que se encuentran en el zoológico así como el ambiente en el que lo niños pueden interactuar. Posee una barra de búsqueda en la parte superior derecha. En este lugar también se ubican los iconos de redes sociales. Bajo estos, se encuentra el menú alineado a la derecha.
El slider cuenta con 2 botones de llamada a la acción y siempre presenta la misma frase que se emplea como medio para posicionarse. Las fotografías son de gran calidad, pero el efecto que se ha logrado con el texto, en el que éste parece interactuar con la fotografía, realmente es una gran adición.
Si nos desplazamos podemos ir descubriendo mayor información sobre el zoológico: las actividades diarias, el calendario de evento y las últimas noticias del blog. Posee efecto parallax que funciona bastante bien debido a las imágenes que han añadido.
Wild Life Sidney Zoo
Este sitio posee dos zonas de menú, una debajo de otra. La primera se halla en la parte superior, en el centro y podemos ubicar información básica del zoológico como el horario de atención así como un botón para dirigirnos a la lista de eventos próximos. El otro menú es el principal y se coloca tras el logo, que se ubica en la parte superior izquierda. Tras este menú podemos ver un slider de imágenes con algunas de las especies que este zoológico alberga, así como un vistoso botón de llamada a la acción que nos invita a reservar un día de visita.
El layout se divide en 3 columnas de igual tamaño. Bajo el slider se ubican dos banners del mismo tamaño que promocionan otros eventos del zoológico. En la última columna se ubica un formulario donde podemos añadir las atracciones a visitar así como el número de personas con las que iremos para calcular el precio de la visita. Lo bueno es que este es un servicio especial que ofrece descuentos.
Shedd Aquarium
Este sitio ubica su barra de menú en el centro. Esta barra de menú tiene dos niveles, el segundo cobra más importancia debido al tamaño que ocupa. Lo interesante de este menú es que se encierra en una forma irregular, que se asemeja a la olas del mar. Este detalle ayuda a reforzar la identidad del acuario y le da más movimiento al página. Posee un slider de imágenes que muestra vistas exteriores del acuario, así como las especies que posee y las actividades que realizan.
Si nos desplazamos hacia abajo tenemos acceso a una serie de imágenes, cada una se corresponde con una noticia o un evento relacionado al acuario. El pie de página contiene los elementos usuales (formulario de suscripción, enlaces para contactarse, preguntas frecuentes, etc.)
Chester Zoo
Este sitio es bastante colorido y parece dirigido a los niños por su tipografía irregular y los mensajes que se ubican en su slider. El logo se ubica en el centro y bajo éste se ha colocado el menú, también en el centro. Cada sección del menú está separada por una pequeña línea bastante irregular. Bajo la barra de menú ( que también tiene una forma irregular) podemos ver un slider con imágenes, cada una de ellas presenta un animal, un mensaje y un botón de llamada a la acción. En la parte derecha de este slider se ubica un cuadro con diferentes enlaces donde podemos reservar entradas, ver horarios de atención, explorar el mapa completo del zoológico, etc.
Al bajar tenemos acceso a algunos eventos destacados, así como una completa sección para planificar todos los detalles de la visita a este zoológico. También podemos ver las últimas noticias y los últimos comentarios de Twitter y las imágenes de Instagram. Todos ellos se presentan en una cuadrícula donde las imágenes no se alinean de manera usual. Todo acerca de este sitio posee un aspecto bastante lúdico, de esta manera intenta acercarse a padres e hijos.
Houston Zoo
Este sitio tiene un diseño bastante limpio y sencillo. Su layout se ubica en el centro y posee dos menús, uno es adicional y sirve para enlazar a información sobre entradas y membresía. En la parte superior izquierda podemos ver el logo, y al lado de este se ubica el horario de atención. El menú se ubica bajo el logo, en una barra de color verde. Al posar el cursor en una sección, vemos que el menú se extiende para poder ver todos los elementos que incluye esa sección.
Bajo el menú vemos diferentes imágenes, cada una de ellas se enlaza a un evento y página particular del sitio web. También sirve como modo de promocionar, pues muchas de estas imágenes hacen referencia a actividades que puedes realizar en el zoológico.
San Diego Zoo Safari Park
Este sitio, al igual que muchos de los presentados, posee dos niveles de menú. En el primero podemos encontrar información adicional de la institución. En la parte derecha se ubican tres botones donde podemos adquirir entradas, ver los requisitos de membresía o colaborar con una donación. El segundo nivel de menú contiene información sobre los tours, los animales y la vegetación, etc. Todo el menú posee una textura de madera que refuerza la idea de vida salvaje.
Bajo el menú, localizamos un breve video que promociona un evento destacado. El botón de llamada a la acción se ha incorporado al diseño y se encuentra en el centro. Si nos desplazamos hacia abajo vemos, ordenada en una cuadrícula, los diferentes safaris que ofrece el zoológico. También podemos tener acceso a videos y cámaras en vivo para disfrutar un poco de la experiencia de este zoológico. Todo esto se presenta de manera ordenada bajo un peculiar fondo que tiene manchas que se asemejan a las de una jirafa.
Parken Zoo
Este sitio es un poco más tradicional, pero no por ello deja de ser un gran diseño. Posee un menú sencillo que se ubica en la parte superior izquierda, en el lado derecho se ubica el logo. La barra de menú posee una textura que se complementa con la textura que se emplea como fondo en el resto del sitio.
Bajo el menú podemos ver un slider, cada imagen posee un mensaje distinto. El layput se asemeja al de un blog pues se divide en varias columnas y se aprovecha el espacio para colocar imágenes de animales que se enlazan con información y videos del mismo. También tenemos acceso a noticias y entradas de blog, calendarios de eventos, últimas fotografías en Instagram, etc.
Zoo New England
Este sitio tiene un diseño más elegante, pero se destaca el hecho de que los niños son bienvenidos al emplear imágenes de niños observando animales, botones de colores y tipografía de bastones irregulares. Otro punto a su favor es que ponen en énfasis a los animales en peligros de extinción y las acciones que debemos hacer para sumarnos a la lucha, de ese modo demuestran que en realidad se preocupan por los animales.
El menú posee letras con un puntaje mayor al usual para poder llamar más la atención. Bajo el slider podemos ver banners que publicitan las dos diferentes ubicaciones de este zoológico. También podemos tener acceso a los eventos generales y en el pie de página tenemos acceso a los eventos particulares de cada zoológico.
