Los sitios web de restaurantes son con frecuencia desastres tanto de diseño como de usabilidad. Incluso los buenos diseñadores pueden equivocarse en esta tarea particularmente difícil.
Antes de intentar el diseño del sitio web de su próximo restaurante, consulte este artículo. Revisaremos algunos consejos súper prácticos para el éxito, además de algunos inconvenientes que evitar.
Una pregunta sabrosa
Joe Elias nos contactó a través de nuestra página de Dilema de diseño y nos hizo la siguiente pregunta:
? He recogido un puñado de restaurantes en las últimas semanas por referencia y estoy atascado en una cosa: mostrar sus menús en sus sitios web. Claro, podría ir el? Tirarlo en un PDF? Encamínelo y llámelo al día, pero me gusta sobresalir haciendo que mis clientes se destaquen. ¿Alguna idea para una forma única y limpia de presentar un menú estándar de restaurante de 4 páginas?
Este es un gran tema con el que creo que muchos diseñadores luchan. Creo que Joe tiene una idea clave aquí pero necesita ayuda para comenzar. Veamos qué podemos aprender de un vistazo rápido en la web en los sitios web de esta categoría.
Las pantallas y el papel son medios muy diferentes
En su pregunta, Joe mencionó "tirarlo en un PDF". Técnica utilizada por varios sitios web. La idea básica aquí es tomar su menú de impresión, cargarlo tal cual en la web para que los usuarios lo descarguen y lo llamen un día. Aunque un menú PDF descargable es un gran opción para proporcionar a los usuarios, definitivamente no es el camino a seguir como la principal forma para que los visitantes vean su menú.
Algunos diseñadores llevan esta idea un paso más allá y realmente se toman el tiempo para codificar un menú en línea que es esencialmente una réplica exacta de su menú impreso. Aunque aplaudo el intento de coherencia, esta es otra vez otra manera muy mala de hacer esta tarea.
Los diseñadores con un fondo impreso (como yo) tienden a enfocar el diseño web completamente equivocado. El supuesto es que el diseño digital es básicamente lo mismo que la impresión, por lo que todo lo que sabe sobre diseño, gráficos, etc. sigue siendo válido. Esto no podría estar más lejos de la verdad.
La impresión es un medio estático, pasivo. En su mayor parte, las oportunidades de interacción son mínimas y debe confiar principalmente en el atractivo gráfico y la solidez del diseño. Sin embargo, la web es una bestia completamente diferente, construida sobre la idea de una rica interactividad. Hacer clic, desplazarse y desplazarse por el mouse son solo algunas de las muchas acciones que ahora están disponibles. Además, ya no estás limitado por el tamaño de una hoja de papel física, lo que abre un millón de posibilidades.
El punto que trato de señalar es que al tratar la web como la impresión, usted deja pasar un montón de oportunidades para hacer que su diseño sea más fácil de usar, atractivo y atractivo.
Aburrido italiano de Carrabba
Como ejemplo, veamos el menú en línea de uno de mis restaurantes favoritos: Carrabba's Italian Grill. Esta es una cadena bastante grande en los EE. UU. Y debería tener muchos recursos para construir un gran sitio. Sin embargo, su menú es bastante mediocre.
El menú de navegación móvil de la izquierda es un buen toque, pero por lo demás es solo una página grande o un texto aburrido. ¡Ver esto no me da hambre en lo más mínimo!
Asegúrese de que pueda leerlo!
El menú del Carrabba definitivamente no es del todo malo. De hecho, ocupa un lugar muy alto en la lista de menús de restaurantes que verifiqué. A pesar de ser poco emocionante, el menú en línea del Carrabba es altamente legible. El diseño general del sitio es bastante atractivo, pero no permiten que el diseño impida la utilidad del menú. En caso de duda, claro es mejor. Prefiero ver un menú estático y aburrido del que los usuarios pueden obtener información rápidamente que algo ocupado e ilegible.
Para ver lo que quiero decir, eche un vistazo al menú de arriba del restaurante Twelve. En su mayor parte, este restaurante tiene un sitio de gran apariencia, sin embargo, a menudo permiten que el gráfico de fondo fluya lo suficiente como para hacer que el texto del sitio sea difícil de leer. La estética es importante, pero recuerda que el diseño es más que hacer las cosas bonitas. Se trata de organizar y diseñar la información de una manera que sea atractiva y utilizable.
Fotografía de comida
Lo que realmente hace un menú de restaurante para mí es una buena fotografía de comida. Como dije anteriormente, las palabras no me dan hambre, ¡la comida sí! Si tienes la suerte de estar trabajando para un cliente con increíbles recursos de fotografía de alimentos, asegúrate de aprovecharlos lo más posible.
Echa un vistazo a cómo se centran en la foto los dos menús a continuación. ¡Realmente tienes una idea de lo que vas a comer y la fotografía es lo suficientemente buena como para que simplemente mirarlo te dé hambre!
No todo artículo necesita una foto
Incluso si no tiene imágenes de todos los platos, y es probable que no los tenga, aún puede sacar una hermosa página de menú que aprovecha la fotografía. Echa un vistazo al impresionante menú de Ruby Tuesday a continuación, que utiliza un sistema único de acordeón que expande una sección del menú cuando haces clic en una foto.
Este sistema de acordeón funciona muy bien para navegar rápidamente por los diferentes tipos de alimentos que se ofrecen en el menú. Además, le da al espectador las fotos suficientes para que su apetito se despierte sin exagerar.
¿Fotos malas o faltantes?
Como diseñador web del restaurante, es probable que no tenga ningún control sobre los recursos que el cliente le brinda para el proyecto, si es que los hay. Honestamente, el cliente típico de un restaurante no le dará nada parecido a la calidad de lo que ve en California Pizza Kitchen y Ruby Tuesday. En cambio, es probable que sea nada o algo casi inutilizable.
La fotografía de alimentos es complicada y se necesita un verdadero profesional para lograrlo con éxito. En el caso de que el cliente te de fotos tan malas que realmente perjudiquen las posibilidades de que alguien venga al restaurante, tendrás que encontrar una manera de convencerlas de que no las usen. Confíe en mí, el texto simple es mejor que una página llena de imágenes que provocan mordaza.
En estos casos, solo tendrá que aprovechar al máximo el diseño de solo texto. La porción del menú del sitio web de Marie Catrib hace un trabajo bastante decente en esto. Observe lo bien organizado que está todo el contenido y cuánto espacio en blanco hay entre los elementos.
En el caso de que tenga imágenes perfectamente buenas, pero una colección bastante extraña de ellas, puede ser difícil descubrir cómo integrarlas todas en su diseño. El menú de Chez Gerard a continuación resuelve este problema muy bien al ofrecer fotos ocultas que aparecen cuando se pasa sobre ciertos elementos del menú.
Tipografía
Muchos restaurantes quieren aparecer refinados y de clase alta, por lo que el movimiento instintivo para los diseñadores es usar muchos guiones fluidos. Recomiendo encarecidamente evitar una página llena de tipografía de script, simplemente se vuelve demasiado difícil de leer. Está bien usarlo de forma selectiva, pero tenga en cuenta que es fácil ir demasiado lejos.
Además, no hace falta decirlo, manténgase alejado de Comic Sans y de cualquier otra fuente que su cliente crea que se vea divertida. Si quieres que tu restaurante se vea de clase alta, encuentra un serif fuerte y antiguo. Si realmente quieres que se vea divertido, considera llevar esto a través de los gráficos y apegarte a un buen sans-serif moderno para la mayoría del tipo.
Sin embargo, si realmente quieres hacer todo lo posible con fuentes divertidas, definitivamente puedes darle una oportunidad. Muchos diseñadores pueden lograr esto sin problemas, otros se estrellan y queman inmediatamente. Un sitio que creo que hizo un buen trabajo es The Little Cake Parlor. Aunque no estoy loco por el diseño de columna alineado en el centro, las fuentes utilizadas en este sitio se ven muy bien juntas.
Medios de comunicación social
¿Quieres que los clientes corran la voz sobre tu restaurante? ¿Por qué no trabajar en una integración de redes sociales única? Las mejores implementaciones de esto que he visto permiten a los visitantes compartir elementos de menú específicos que les gustan.
Por ejemplo, el menú Giraffe tiene un botón de "Me gusta" de Facebook al lado de cada elemento del menú para que los usuarios puedan recomendar fácilmente platos específicos a sus amigos.
Conclusión
Los menús en línea pueden ser un verdadero dolor para desarrollar. Es difícil organizar tanta información en un formato atractivo y utilizable, pero espero que los consejos y ejemplos anteriores sean suficientes para que su proyecto comience en la dirección correcta.
Si ha diseñado algún menú de restaurante en línea últimamente, deje un comentario a continuación con un enlace para que podamos verlo.
Imagen del título de la publicación tomada por clspeace.