Web Development

Inspiring food-related website designs

Ryan Boudreaux highlights some of the web design features in this collection of food-related websites.

Let's face it; we all enjoy a great meal out every once in awhile, from the fancy, white-tablecloth, fine dining restaurants that cater to the pampered gourmet, to the local hole-in-the-wall deli that makes the best pastrami melt in town. There are plenty of great food-related web sites that skillfully blend colorful designs and creative photography that will provide you with inspiration for your own designs. Below are some of my picks for engaging web designs. Bon appétit!

L'Auberge de l'Ill

This French restaurant is located at the Hotel Des Berges, in Illhaeusern, France. The website features Flash for most of the content, and presentations include the culinary slideshow in a continuous loop of amazing menu selections in full-screen view.

Figure A

Easy Bistro and Bar

This restaurant located in Chattanooga, Tennessee offers one fine minimalist web design that utilizes style and sophistication. Menus are offered in PDF for online viewing and the online reservation system is provided through Open Table. The background images rotate using a combination of JavaScript and JQuery.

Figure B

Food Sense

Part blog, part online foodie community, Food Sense is a unique resource for thoughtful, food-loving eaters and home cooks who have a palate for plant-based eating. The web site uses HTML5 doctype, and elements including <nav>, <aside>, <section>, and <article>.

Figure C

G2 G2 Geogeske is a restaurant in El Paso, Texas, and its web site utilizes a combination of JQuery and JavaScript, which delivers creative design, and expert photography with full screen images. The menus are offered in PDF and the reservations system utilizes Open Table. Figure D

Gojee Create a free account and you can start searching for recipes; just tell Gojee what you are craving, and the website searches for images, creates a slideshow in full screen, and the images are linked to the original associated recipes. A recent search for "shrimp" found ninety-one recipes, including the Okonomiyaki shown in the screenshot. Figure E

Hélène Dujardin Photography

Featuring five separate JavaScripts, this food photographer website, features the work of Hélène Dujardin, and exhibits a minimalist approach along with the slideshow powered by a custom lightbox script, which features the individual portfolios. The website also provides a "full screen" toggle.

Figure F

Hoddows Gastwerx

This restaurant is located in Buxtehude, Germany, just outside of Hamburg, and its website presents another full screen presentation of culinary inspired and restaurant background images, it also includes a short video presentation overview of the restaurant.

Figure G

Le Pain Quotidien

This bakery with several locations in the U.S. and other countries offers another full screen layout, along with sliding navigation that features menus and sub-menus. Each subsection includes a fading image slideshow.

Figure H

Leaf Tea Shop and Bar

The tea shop is located in Liverpool, England. Its website utilizes eight separate JavaScript files and three CSS files to create the pages, including news, events, tickets, and menus -- also available in PDF format. The gallery page offers photography in full-screen presentation.

Figure I

Harding Market

The website for this restaurant, located in Morristown, New Jersey, features a combination of JavaScript, JQuery, and CSS, as well as an automatic cross-slider image slideshow presentation. Left side navigation opens to a new set of navigation sections with links to PDF menus and descriptions including various events, restaurant facts, and press releases.

Figure J

About

Ryan has performed in a broad range of technology support roles for electric-generation utilities, including nuclear power plants, and for the telecommunications industry. He has worked in web development for the restaurant industry and the Federal g...

0 comments

Editor's Picks