Design View | Articles and opinion on design professionalism, technique and culture by Andy Rutledge

Hungry For a Better Menu?

October 18, 2011

Go to the average restaurant website and you’ll find a crappy menu page. In fact, it might not even be a page. It’s probably just one big image or a huge PDF file that you can download. Perfect for those times when you’re in the car on your iPhone simply trying to see what fare a restaurant offers, right?

Cut to the chase and see the Clear Menu exercise »

Even in those instances where the restaurant has an otherwise beautifully designed site, the menu page is usually a total failure of usefulness and usability. The PDF file, big image, or flash presentation too often offers an unusable object or one that is unnecessarily hard to penetrate. The problem is that none of these options are appropriate for many or even most visitors to your website, and they all ignore at least one important point:

There’s no reason not to have a well-designed, brand-consistent menu page that delivers actual content in a format that works well on a screen of any size.

Why not serve up actual content on the menu page? Plain ol’ HTML and CSS can do wonders, and any competent designer can create a beautiful menu very quickly and easily. Add a dash of JavaScript and some delightful experiences can await site visitors on the menu page. It’s easy, and yet so few restaurants (and their web teams) care to deliver.

Here’s a thought

My friends and I at Unit Interactive thought it’d be nice to do a fun little exercise showing some examples of how restaurant website menus can be done better. These menu examples show how with just HTML, CSS, and some JavaScript it’s easy to create a brand-consistent menu page that works well from desktop to handheld screens and even provides a little delight in the user experience.

These are just examples meant to demonstrate the principles and, we hope, inspire better efforts from restaurants and the folks who make their websites. I hope you enjoy our little exericise.

You can follow me on twitter

Archives

Archive

Practice