HOME  ≫  Online Ordering Portals: Must-Have Elements For An Optimal User Experience

Online Ordering Portals: Must-Have Elements For An Optimal User Experience

by | Apr 12, 2019

The faster pace of modern living is certainly changing the way we eat. Online food ordering continues to outpace traditional brick-and-mortar dining across the board, and while that may sound daunting to restaurants with a heavy physical footprint (and subsequent rent to pay), there is a correlation worth noting that benefits a restaurants overall bottom line. 67% of customers who have placed an order online will visit the restaurant more frequently versus those who have not according to PMQ

 Additionally, online ordering systems give brands a fantastic opportunity to up their marketing game. How? By providing them a vehicle to deliver an optimal user experience to their customers.

With that in mind, it would be wise to invest in your online presence early if you are looking for a wholistic approach to keeping your brand relevant both online and offline.  Sound agreeable? check out this list of must-have elements for an optimal user experience via online ordering.

Baked-In Branding

While branding is often overlooked in the UX/CX world, its impact on the way that diners consume content (and food) shouldn’t be understated. When users browse an online portal, each element should capture their attention. Successful branding is all about using holistically branded elements to nurture users along the buyer’s journey. Did you know that branding will overtake price and product considerations by 2020? In light of this: Brand today. Win tomorrow.

Here are some things to think about when you’re branding for your restaurant online ordering system.

  • Your colors matter! The colors that represent your brand should be complementary in nature. Make sure that they act as a whole, rather than a set of fractured pieces. In fact, your signature color choices can increase brand recognition levels by 80%! Still unsure about the power of color to persuade? Try this on for size: When making a purchasing decision, a whopping 93% of consumers focus on visual appearance as a consideration.
  • Videos can also help drive profits. 64% of diners make a purchase after viewing a branded video! Additionally, customers are 4x more likely to watch a video than read about your products. Think about creating some branded videos for your portal.
  • Create a seamless experience. Putting up your logo and splashing some brand colors on it is so yesterday. For 21st century marketing, consider how the entire website leverages branding. 49% of customers will heavily engage with brands that provide a seamless and inter-connected experience. Meanwhile, 83% rank seamlessness as a “very important” feature in online ordering.


What’s more annoying than waiting for a website to load? Not much. Your customers think so, too. 94% of customers don’t trust websites that aren’t responsive. In fact, 39% of them will leave and never return, if your website has loading issues. In other words, your site needs to load fast, easily guide customers to the appropriate screens, and efficiently take orders.

Let’s look at some quick responsiveness hacks that can boost your sales.

  • Always think mobile first. Period. Google is a mobile-first indexer, and 85-90% of all consumers shop on smartphones. Did you know that more people own smartphones than toothbrushes? There’s power in mobile. Tap into that power. What’s more: 60% of consumers use mobile exclusively to make purchase decisions. A mobile-first mentality is no longer a luxury; it’s the holy grail of UX strategy today.
  • Speed is king. A 1-second delay in loading reduces the number of people viewing your page by 11%! You’ll want to bake speed into the architecture of your ordering portal. Don’t let customers crawl out of your pipeline because your site has loading issues.

Easily Explorable

Does your online portal need a robust search option? Sure, many portals include fancy features like online sliders to compensate for their lack of searchability. Guess what? Only 1% of customers actually click on those sliders. You need to give diners a quick-and-easy way to find exactly what they’re looking for. Ease of navigation (or the lack thereof) is a major pain point in the online delivery industry. Many 3rd party apps give customers gorgeous menus, but they forget to add a search button. Think about your own experiences. How often do you use the search function? Exactly. Your customers use it, too.

(Example of 9Fold’s search functionality – you can see the choices start to narrow down below as a user types, in this instance trying to search “BURGERS” and the menu auto-narrows all relevant results with each letter and “BUR” is probably all they needed to get the job done!)

Desktop View

Easy to search online ordering menu

Mobile (responsive) View

Mobile Responsive Search Bar for Online Ordering Menu


So, what’s a restaurant to do?

  • Make sure your portal has a search bar. This is crucial. Try a full-length search bar or search bar with magnifying-glass icon for desktop interfaces. We recommend an icon-only search for mobile, if possible. If your customers can’t find the search feature quickly, they’ll leave. 74% of people will switch brands if they experience difficulty finding what they’re looking for.
  • Structure your website to promote ease-of-search. We’ve all run into search bars that end up sending us far away from our goal. Use tags wisely and structure your menu well. Is your customer looking for hamburgers? Refrain from tagging french fries as hamburgers.

Intuitive Navigation

Figuring out how to guide users through your website requires some finesse. You want your ordering system to be intuitive. Diners should naturally know where to go. If you start hiding a ton of elements behind sliders (remember, only 1% of consumers actually use these) or unnecessary tabs, your users may get frustrated and leave.

The UX Collective’s 2017 yearly report states:

“The right amount of technology is the minimum needed to solve the problem.”

To be clear, this isn’t the minimalism you see tucked away in Danish design catalogs next to a $10,000 plank of wood masquerading as a chair. We’re talking about keeping your website simple enough for users to understand and use correctly. [All things considered], a frictionless user experience can raise conversions by as much as 400%.

We’ve all been on websites that look good but do little else, especially in terms of functionality. Confusing navigation labels and CTAs are undoubtedly a pain. Give your users the freedom to dash in and out of your ordering portal without getting bogged down in meaningless minutiae. Minimalist websites are on the rise for a reason. They load faster, browse easier, and usually look better. In 2012, Google reported that users rated simpler versions of visually complex websites as “much more attractive.” In the long run, the trend of minimalist websites shows no signs of abating.

The Beauty Conundrum

Of course, your website needs to look good. Here’s the thing. It doesn’t matter if you have the fastest site in the west. Additionally, it doesn’t matter if your website is easy to navigate and branded incredibly. If it isn’t attractive by popular standards, raising revenue takings could be next to impossible. Sure, beauty is in the “eye of the beholder.” However, you’re not aiming for avant garde art (however compelling it is). Instead, you want something that’ll draw the majority of diners to your restaurant…and keep them coming back.

How important is beauty when it comes to online ordering portals? Let’s take a look at some statistics.

  • If customers are given 15 minutes to read content, 66% of them would rather read something on a beautiful website than an “ugly” one.
  • 33% of customers will completely stop engaging with a brand if a website is “unattractive.”
  • First brand impressions are 94% design-related.

Humans are implicitly visual creatures. So, design your portal with aesthetics in mind.

5 Bonus Quick-Hacks

We’ve gone over the core tenets of creating an online ordering system that delivers great UX. However, here are some actionable tips that can help you boost conversions immediately.

  • Make sure that you list contact info44% of customers will leave a site that’s missing contact info. Correspondingly, 51% think its the most important website element.
  • Your logo should redirect to the homepage36% of visitors click your logo to take them to your homepage.
  • Drop the password. Not surprisingly, 30% of customers abandon their orders when asked to register for an account. You’ll lose your customers if you require password-protected logins for each order.
  • Give customers clear progress indicators. Don’t keep your customers guessing: Keep them updated about the status of their order at each step of the process.
  • Make your system image-centric. People love images. In fact, 32% of marketers say that images are the most important element in their digital marketing campaigns. Images convey information fast. Not to mention, restaurants exist in a space where visuals are pivotal in the effective presentation of food. In other words, the “picture-superiority effect” is real. In fact, this interesting theory originated from Allan Paivio (a professor of psychology), whose dual-coding theory maintains that memory is better facilitated by images than words. So, leverage those images to drive conversions!

Final Thoughts

Restaurants that want to stay agile in the digital world need to implement in-house online ordering systems. Complete reliance on high-priced 3rd-party delivery apps is no longer a financially viable option. Instead, you need a robust in-house solution that leverages superior functionality and responsive design to attract new customers and keep existing ones. It’s time to embrace the online food ordering craze and leverage it to your advantage!

How 9Fold Can Help

Does building an entire in-house system seem cost-prohibitive and complicated? It is! However, with 9Fold at your side, you can have a hyper-branded website (filled with best-of-breed UX and UI elements) for a fraction of the cost of building one from scratch.

We put the power back into your hands: All of our solutions can be customized to fit your restaurant’s business philosophy and objectives. Stop giving UberEats 25 – 30% of your order takings. Pay a small monthly fee instead, and achieve great UX effortlessly all while keeping your brand top-of-mind for consumers.

Want to learn more about what 9Fold can do for you? If you’re ready to increase your profits, contact us today.

Own a restaurant? Let’s chat.

Learn how 9Fold can help streamline your takeout operations and get you more commission-free orders!