GET INSIGHTS & TIPS LIKE THIS DIRECTLY TO YOUR INBOX.

March 21, 2017 12 Restaurant Website Design Trends to Know

restaurant website

Haven’t updated your website in a few years? Now is the time to hit refresh. To guide you, we’ve put together a list of the 12 hottest restaurant website trends. Simplicity reigns supreme in 2018. It’s all about clean layouts, very few photos, and even less text. The minimalist trend isn’t “just for looks.” Discover the bottom line benefits of designing your website in line with today’s top trends.

The Essentials: Top 5 Must-Know Trends in 2018 Restaurant Website Design

1) Mobile First: The Golden Rule of Restaurant Website Design

What’s behind almost every 2018 website design trend?

A smartphone. You know, the mobile device that 77% of Americans now own according to a 2017 Pew Research study. Those little devices have made a big impact in the world of restaurant website design.

Up until the last 4-5 years, a restaurant website was built for large, horizontal desktop and laptop screens. How websites appeared on small, vertical mobile devices was an afterthought.

Now it’s a first thought.

That’s why “mobile first” is THE buzzword in restaurant website design. How your website looks and functions on a smartphone should be your #1 priority.

A mobile-first website isn’t just good design, it’s essential to get your business found on search engines.

Google announced they will soon use the mobile version of your website – not the desktop version – to index your content. Indexing is when Google’s “robots” scan your website for keywords that will help searchers find you (see trend #10).

If you have separate desktop and mobile version of your website, it’s time to merge the two. So, how can you do that? With a responsive website for restaurants.

2) Responsive Restaurant Website Design

A responsive website is a website that automatically changes its layout based on the screen it’s viewed on. Whether it’s an iPad or a 1920×1080 monitor, the website “responds” to give the viewer the best possible browsing experience:

  • Fonts automatically increase in size on mobile devices
  • Images that run horizontally across a page become vertical on mobile
  • You can set certain effects to be “hidden” on mobile to ensure fast mobile load time (see #4 regarding performance)

Yes, responsive restaurant website design sounds expensive. But it’s not. In fact, it’s downright affordable. Here’s how:

Build a WordPress website using a template.

Today, an astounding 28 percent of websites run on WordPress. There are millions of WordPress website templates that you or a designer can customize to your restaurant website design vision.
A great responsive restaurant website template – like the Avada café template – costs just $60.

3) UX/UI aka “Make Your Website User-Friendly”

Restaurant website designers love their acronyms. Especially UX and UI. UX stands for “user experience,” UI for “user interface.” These are fancy terms for a simple concept: your restaurant website should be easy for guests to use. Here’s how to do it:

Navigation

When guests walk into your restaurant, they know where to go: the hostess stand to be seated, or straight to the bar if it’s been one of those days. Your restaurant website design should be just as easy to navigate. Ensure your menu, directions, contact information, and hours are easy to find. Guests shouldn’t need to search for them. For example, guests should be able to go “home” no matter which page of your site they’re on – usually by clicking on your restaurant’s logo.

Sticky Menus

No, we’re not talking about the ones your busser forgot to wipe down. Sticky menus mean that your website’s main menu is always visible as guests navigate your site. The menu “sticks” to one place whether it’s the top of your website, the side, or the bottom.

Brevity

Your high school English teacher won’t like this 2018 restaurant website design trend…No one reads long paragraphs at websites anymore. We’re all scanners. We look for headlines and juicy bits of text.

Can’t stop yourself from writing long paragraphs? Hire a copywriter – if you’re not into the whole brevity thing. Yes, we’re quoting the Big Lebowski.

4) Performance Over Everything

Guests have a need for speed. How quickly your restaurant website loads matters. A lot. And no, you can’t always blame a bad connection.

Picture this: A big group is at a basketball game. At halftime, they Google restaurants. Yours pops up.

“Hey, I heard this place has great wings and craft beers.”
“Show me the beer list.”
“I can’t. Their website is still loading.”
“Then look up that other place, I think it’s called…”

You know how it ends. So, what causes websites to load slowly? Here are the main culprits and how to fix them on your restaurant website:

Pictures. Lots of pictures. Big pictures.

Just say no to excessive photos. Photos can significantly slow down the load time of your website. Of course, a few photos are fine. But, photo file size should be between 60 and 100 KB. That 5 MB professional photo of your restaurant’s interior? It needs to be re-sized before including it in your restaurant website design.

Fancy Slideshows

Slideshows of multiple photos rotating on the homepage were trending 3-4 years ago. Now, slideshows are old news in restaurant website design. Skip the slideshow and stick with one properly sized beauty shot.

Flash Animation

Steve Jobs wrote a 1,700 word manifesto on why Apple iOS (Apple’s mobile operating system) would not support Flash animations and Flash videos. You can read it, or just trust us: Flash animation and mobile do not mix. If you have Flash animations on your website, remove them.

Downloadable PDF Menu

Putting a PDF of your menu on your restaurant website is a big no-no.

Guests should be able to scroll through your menu without having to download it. Many restaurants make the mistake of uploading the exact same menu that they send to the printer. Usually these files are high-resolution. That means they’re often 4-5 MB and take a while to open. Plus, if a guest isn’t on wi-fi, downloading large files eats into their data plan.

Too Many 3rd Party Applications

Also known as plugins on WordPress websites, 3rd party applications can slow down performance. For example, many websites want to connect a Facebook or Twitter app to their website.

However, when your website loads, it must “communicate” with Facebook and Twitter to pull the latest feed into your restaurant website design.

This may take a few seconds. And every second matters.

5) HTTPS Spells Security

HTTP used to be the standard in restaurant website design – now HTTPS is the gold standard. The “S” stands for security, and means that data – like credit card information – is encrypted before being sent from the guest to the website.

With HTTP, that information is sent in plain text which can be “read” by hackers, bots, and malware. Read up on this essential security aspect when working on your restaurant website.

50 Best Bar Promotions

The ultimate guide for owners & managers.

The Latest Restaurant Website Design Trends

6) Vertical Restaurant Website Design

So far, we’ve covered the basics of building a website in 2018, now let’s dive into the actual look, feel, and style – starting with vertical design.

It’s all about the scroll.

The auto industry was the first to adapt vertically oriented website design. Instead of clicking on a menu to access pages, web visitors could simply scroll down through a set of “pages.”

Vertical restaurant website design invites exploration and feels natural. Don’t worry about stuffing information “above the fold” (in the top section of your website).

Guests will naturally scroll on, and on, and on…

7) Flat Design

Yes, it’s good to fall flat when it comes to restaurant website design.

Flat design focuses on simple colors and shapes. Gradients, drop shadows, and other “fancy stuff” looks dated. For examples of flat design in action, check out this gallery of flat website designs.

As website design trends go, there’s already Flat 2.0 in the works thanks to Google. They recently introduced “material design.” It gives flat design a bit more personality.

Google provides a guidebook for utilizing their material design concept right here.

8) Be Iconic in Your Restaurant Website Design

As we mentioned before, photos can slow down your site’s performance – and may date your website. That’s where icons come in.

You can upload your own graphic icons to your website. Even better? Use code to generate pre-designed icons for even faster website performance.

Google provides hundreds of free icons you can use at your website. Or, you can use Font Awesome code as well.

9) Put Your Best Font Forward

The font you select for your restaurant website can provide personality amidst all these minimal trends. You can upload your own font used in your restaurant’s brand. Or, select one of Google’s open source fonts.

Your Restaurant Website Design Can Supercharge Your Marketing

10) Use SEO

SEO stands for search engine optimization. In a nutshell, SEO refers to deliberately putting certain words into your restaurant website design to help your restaurant be found on search engines like Google, Bing, and Yahoo.

If you’re a sports bar in Green Bay, you’d incorporate the phrase “Green Bay sports bar” into your restaurant website text. When guests go searching online for sports bars in Green Bay…you have a greater chance of showing up.

But don’t go overboard. Search engine robots that “crawl” websites penalize ones with too many keywords. To see which phrases and words people are searching for near you, use the Google Keyword tool.

11) Start a Blog

When planning your restaurant website, incorporate a blog. Not only will a blog help with SEO, 60 percent of guests feel more positive about restaurants after reading their blog. While we said earlier that brevity is important in the main sections of your website, that doesn’t apply to your blog. Guests expect to read lengthier articles on a blog. Use this simple 9-step plan for starting or improving a restaurant blog.

12) Automate Email Capture

One of the hottest trends in restaurant website design and marketing is automation. Looking to grow your email list? Let your website do it. Automatically.

When guests visit your restaurant’s website, a simple line of text can pop up inquiring if they’d like to join your email list. Always incentivize. Give guests a reason to sign up like a free appetizer or $5 coupon – automatically sent to their email, of course.

Change is the only constant in the digital world. If you paid $20,000 for Flash restaurant website design a decade ago, you know this already. The good news is that 2018 website design trends are decidedly simple. But don’t confuse that with simple-minded. Put thought into creating the best UX for your guests. Let these 12 restaurant website design trends be your guide.