There is no love sincerer than the love of food – I very love these words once written by Bernard Show. Food we need, food we love, and while ones eat for leaving, others are passionate about eating. You must have guessed, that food is what this article is all about.

Here you will get to know how food related websites should be build, how it is possible to make them a real business and how to catch users’ attention.

Food and drink website design is a trendy field. Restaurant websites, culinary sites and food related blogs appear every day and in a big amount; I would say they are in demand. Where do you think housewives find new recipes to try? Or where do you usually go for the contact information of a newly-opened bar? And don’t lie that you have never ordered food online, I won’t believe!

Website building is a hard work. I am not talking about coding alone, but about the design too. The design of a website has to reflect the identity of a place it is dedicated too, if it is an online restaurant business. Any other food related design has to expose the passion that its owner feels to food too. I would like you to be more aware of what is good and what is just horrible about food related web designs. Please, read all the points I have written here for you, I don’t want you to let slip through fingers something very important!

Do’s

Appealing First Image

Website Design with Full-screen Pizza Image

A customer in your restaurant will look at your interior design, estimate the atmosphere of your place, while an online client will stare down at your website design. There will be no smiling hostess to welcome guests to the restaurant, seat them at the best place and make a positive first impression on them. It will be a homepage design to greet your guests, so take care of it and create a catchy visual page with a mouthwatering photograph at a large format. Why large? – Because it will take the most of the page space to amaze users. Why mouthwatering? – Because hungry customers will eat more and with a greater pleasure.

Contacts on the Front Page and Every Page

Restaurant keepers know how important online presence is in the society of the Internet addicted users. That is why more and more restaurant businesses are getting online, where clients can find them. It follows thence contact information should be clear for clients to find you easily. I recommend you to place your address, phone number and hours somewhere on the front page, where it is the most visible – probably in the Header. I am sure just a Contacts page won’t be enough for busy customers with no time to wander around your site, so build a large informative Footer for them. Think about your audience, prioritize things they will be looking for, and make your website not trendy or feature-rich, but user-friendly.

Use Various Typography

Website Design with Creative Typography

Typography is a cornerstone to food website design. You ask why and I will tell you why: visuals are good, but text is a bigger part of any website. Visual hierarchy of the text is generated by means of typography. Headlines, when are bigger and colored differently than the main text, grab attention. The trick of making focus on some parts of the text makes a website eye-popping. Moreover, you definitely want to build a strong strategy on how to influence on users and make them read what you have written. This is the power of typography to make your content significant. Plus, your website will have a more creative appeal, if you apply a few different fonts to it.

Big, Colorful Photography

The technique of using large scale images is a new trend in web design. It became widely used at the end of 2013 and now it strengthens its presence. Images, especially large and vivid, make a great impact on the overall website design: they turn a simple page into a memorable picture. Plus, we need to remember, that human brain is much more likely to perceive visual content than text.

Culinary Website with Large Photos

Image background is worthy to mention in this section too. It looks really imposing when a design is based on a picture background rather than on a monochrome or multi-colored pattern. A Steak House website will look great with a tasty steak picture on the background; as well as a bakery site can’t be complete without delicious cakes and pies depicted on full-sized images.

But be attentive and don’t make mistakes with applying too heavy images to your web project. You don’t need your website to be slow, right? Optimize your site well, besides of bringing it to the high level of beauty!

Illustrate the Menu

“I don’t like food that’s too carefully arranged; it makes me think that the chef is spending too much time arranging and not enough time cooking. If I wanted a picture I’d buy a painting.” I disagree with this statement by Andy Rooney. I consider culinary to be a kind of art. It is not just taste and smell that make us addicted to good meal, but look too.

Food Website with Photographic Menu Entrees

Being a food esthete, I like to see beforehand what I am going to eat. I am not the only one customer, who likes it. An illustrated menu is a must for a good restaurant and its website. Finally, how do I know that the chef hasn’t saved on a certain ingredient of my dinner or a waiter hasn’t confused my meal with another one, if I have no idea how it should look like?

Apply Textures to the Background

Culinary Blog Website with Cloth Textured Background

You are wrong if think that the main aim of textures in web designs is to make a ‘Wow’ effect on viewers. There is something bigger behind this technique. Textures are used for a multitude of reasons: they can turn a design into something comfortable and homelike (an example I give you below demonstrates it greatly); textures are used to make accents and highlight particular design elements or content items; textures create your identity, your personality and unique style.

Add Social Buttons

Social media buttons are helpful in content marketing campaign. When you have social sharing buttons on your website, your content will go viral and spread quickly. Users like to share worthy content with their friends, and why don’t you make use of it? Don’t add too many of them, Facebook and Twitter icons will be enough to get started.

Responsive Design

Online restaurant business is nothing if a website design is not responsive. Do you go anywhere without your cell phone or tablet? I don’t, as well as all friends of mine. And I don’t know the better and quicker way to figure out the nearest place to it, if I’m out of the town.

Culinary blogs work on the same principle. They need to be on hand of their readers all the time.

You should know your target audience and match it. You should know that youth don’t use computers a lot (adults too), but they use all the modern gadgets and you should either correspond to this trend or give out the online society.

If I haven’t persuaded you, then think about SEO, about that Google recommends having a responsive design.

Don’ts

Don’t Create a Splash Page

Splash page is a dead-wood for a website, especially food related website. People will be irritated with foolish animations and effects, when they go to a restaurant website for contact information. The same feelings will bring a messy cooking blog with a splash page for users who just need a recipe of a favorite apple pie. A loud sound video starting without visitors’ input can set their teeth on edge. This is all about splash page designs. We should agree, that splash page includes no important information, usually there are some visual details or welcoming text to the website. Splash page is what prevents users from getting the information they need and finally reaching the website. I really wonder which percentage of visitors will go further and how many of them will turn you off at the very first minute of site browsing.

Don’t Use Background Music without Turn off Option

Websites with music seem to be user-friendly, because they set a pleasing tone for the site, but it just seems to be so. Reality is that many people hate sound websites and find them eerie. For example, it doesn’t mean that I like ‘O Sole Mio’ by Claudio Villa if I am crazy on Italian traditional cuisine. And if I accidently open a pub website, why should I listen to hard rock music?

This feature may be used for a food web design, but with one simple condition: there should be a Turn Off button. Give your visitors a choice!

Don’t Embed Slow Loading Video

We have already talked about images, which can steal your website speed. If you don’t want to make your website loading at snail’s pace, then you shouldn’t embed heavy videos too. They suck, and they are not of a big interest for the Internet users. You know, too much of a good thing is good for nothing.

Don’t Make Season Menu, if You Are not Going to Update it

Many restaurants offer seasonal menus. I don’t criticize it, but are you sure you want to rearrange your online menu fully for a summer? If yes, then don’t forget to update it when the season is over. It makes users nothing but furious and kills their wish to eat at your place. I say it, because I have seen loads of such disused websites. They don’t make profit for owners and they are boring for visitors.

Don’t Neglect the Color Rules

The first rule of the color theory is to abide the proportions. If it is a dominant color, use it the most; if it a secondary color, use it a bit less; but the accent color is just for accents.

The second rule of the color use is the contrast. Contrast reduces the eyestrain and focuses users on needed sections, blocks, texts. Imagine light blue typefaces on a blue background, or light beige buttons on a white background – will you like to harm your customers’ eyes?

Don’t Go Too Far with Hover and Sensor Effects

Functionality is appreciated by online users a lot, but functionality and extravagant dynamism of a website are two absolutely different things. Food images won’t look well if they will be jumping on people out of their screens, as well as too much hover effects will make a food business site cluttered and messy.

How do you like these 14 ideas I have given you? I will be glad to talk to you, if you have another thought on the topic. I’m waiting for your feedback in the comments section.