Skip to main content

How to build a captive portal - a guide for hospitality venues

compliance
(Image credit: Image Credit: Docstockmedia / Shutterstock)

In 2020, hospitality venues achieved six years of digitization in the space of six months in a bid to reopen safely. Traditional country pubs were collecting customer data for the first time as a means of supporting test and trace, while some venues went further, using QR codes, creating apps to encourage customers to order and pay at their table, or even digital loyalty programs (a modern spin on traditional loyalty stamp cards).

Speaking to hospitality business owners, it is clear that this technology drive will be a legacy of Covid-19 and will remain long after the pandemic. The industry has embraced digital tools like never before and the benefits they bring for communicating with customers, increasing sales and improving the in-venue experience. However, a key challenge for venue owners now will be collecting and securing customer details for their own purposes beyond track and trace.

Most of these venues will offer guest Wi-Fi of some description, which is the most popular mechanism for collecting customer information (80 percent of all data collected by hospitality comes from public Wi-Fi). However, creating a captive portal for collecting customer data isn’t as easy as it looks, it’s not just another web form. Many captive self-builds irritate customers, act as a barrier to customers getting online, and some even breach GDPR rules.

I am loathed to admit that most captive portals are still extremely poor. This needn’t be the case, but I think there are three main contributing factors – which lay at the door of techies, customers and the venue owners themselves.

  1. Technical people believe the problem has been solved, because the technology exists to make good captive portals. This ignores the fact that most captive portals in the real world are poorly configured
  2. Customers get frustrated at the user experience, but they don’t know much better. It’s much easier to vent frustration because an online delivery is late. If a pub has a painful registration process, it may be intermittent or limited to certain devices and circumstances, and customers may not even raise the problem with staff
  3. Pre-Covid, most hospitality businesses didn’t care much about the Wi-Fi, nor the old captive portal and registration process someone developed for them years ago. Only with increased digitization and more customers trying to log on will venues really sit up and take notice, as the poor user experience starts to disrupt business and cost money

Here’s an overview of important tech considerations, common mistakes and tips for how to build captive portals the right way.

Putting up a walled garden

Most people have seen a walled garden, even if they are not familiar with the term. It’s usually the first site a customer sees when attempting to join Wi-Fi eg. “Welcome to Starbucks – please register your details”. It appears to be online, but it’s actually the only bit of the internet the user can see until they’ve logged into the captive portal. This is also the first roadblock on a customer’s journey to get online. It needs to be quick and easy for users, and they may give up if it does not work smoothly.

Do not let customers sign in via their Gmail or Facebook account. Ever. This may be a good approach for online businesses that want to make the sign in process easy, while also profile customers. However, this does work for hospitality venues since everything work differently behind a walled garden. The walled garden has no way of speaking with social apps natively, and because the browser sessions in the walled garden are cookie-free, the user will be taken to a mobile version of the social site. It requires all of a customer’s endpoints being in the walled garden, and for them to enter their username and password. Worse still, a staggering percentage of people do not know their social media username or password – 95%. Unless a venue has native SDK access (Apple Sign In), trying to register customers via social media will do more harm than good.

The customer only has access to a single domain, which in most cases will be propped up by a sub-standard DNS (Domain Name System) service and a static IP (DNS is vital part of how the internet works, allowing devices to identify and connect with each other). It is important to make setup as straight forward as possible and to minimize the number of IPs used. The best way to achieve this is by running traffic through a proxy with SSL (Secure Sockets Layer). This is a protocol for web browsers and servers that allows for the authentication, encryption and decryption of data sent over the Internet.

Optimizing page load

It’s important to make every kilobyte count. Venues cannot expect a guaranteed level of connectivity, and must be aware of capped Wi-Fi networks. Meanwhile, every item on the landing page should defer from loading unless it is absolutely critical to the user getting online. Always use some form of an analyzer during the development process, and make sure everything outside the core-bundle is asynchronous. This will ensure it doesn't impact interaction time and transfer size.

Everyone wants a beautiful, well designed website, but be careful not to let design impede on functionality. For instance, do not import complete font sets. Customers don’t care about loading 500 beautiful SVG icons. Likewise, avoid importing big design libraries and 100kb+ sized CSS files. It’s best to define which elements are needed and just import those. As for images, compress and rescale them aggressively. If a customer is using a 375x812 screen, do not make them download a 5MB ultra HD image file – SD will look fine on a small screen anyway. Instead, use the known device attributes to serve an image that's exactly the right size. This will reduce image file size by ~95% in most cases.

To understand how the site is performing, plug it into Google’s lighthouse tool. A score above 80 is good. Anything lower, review the steps above again and consider how improvements can be made.

Compatibility

Hospitality venues must cater to everyone. Unfortunately, some people still use 2012’s favorite internet browser, IE10 – even though it supports 0% of modern web standards. Make sure to use a tool like BrowserStack to run pages through every browser possible. When compiling code, also be sure to use EcmaScript modules (ESM) builds. This effectively means creating two versions, one that will work on legacy devices and one that will work on new shiny devices without taking a performance hit on backwards compatibility.

Accessibility

Venues must accommodate differently abled customers in person, and these considerations now extend to the smartphone screen too. As the industry digitizes, creating accessible apps and web pages is essential. Always consider visitors that require a screen reader, and even those color-blind customers (roughly 10% of men). It’s good to test that users can fully navigate the page without using a touch or cursor input. For more information, resource hubs like Stanford University’s have a lot of good content on web accessibility.

Location

For venues in tourism hotspots, it’s important that apps and webpages are developed for a global userbase. Make sure compatibility and accessibility is addressed for multiple currencies, formatting, time and language. At the most basic level, try to avoid asking customers for their preferred language, since this information exists within the user's device. It creates a great first impression to have a localized/native language page as soon as they log in. 

Data collection

One of the main aims of creating captive portal is to better understand returning customers, so that you can improve communications, share promotions that are relevant to them and create a better experience. With that in mind, do not keep asking customers for the same information each time they visit – just the once. It’s annoying and may prevent them from logging in. It’s also a missed business opportunity. Rather than asking for their date of birth for the fifth time, draw attention to an upcoming event, social media content or special promotions based on their profile. 

GDPR and when to add an opt-out

With the introduction of the GDPR, it’s vital that venues are crystal clear about what data is being collected and why. It is also illegal to unknowingly exchange personal data for a free service – an area of the GDPR routinely ignored by the hospitality sector. Venues must always give people the option to skip the whole registration process and connect to the Wi-Fi regardless. Letting them opt out after they have registered is not enough.

Having a modern, seamless captive portal is a golden opportunity to connect and engage with customers. However, also remember not to push people too far. This isn't a trick for making customers spill all their secrets just to get online. Try to get further information (if needed) over time, and always give customers the option to opt out.

Validation

It’s good to validate customer inputs as they use the site, to avoid them having to go back and submit details/form. Try to use Regex to make form filling faster, but of course there will be some fields that need server-side validation eg. email and phone numbers. Meanwhile, don’t validate a client’s email by sending them an email to confirm before letting them online. It’s an unnecessary extra step that will frustrate customers and delay their efforts to get online (which you want them to be). Don’t be so fussy about sharing a free resource.

Hardware vendor support

There is no one prominent vendor of Wi-Fi access points. For venues with multiple sites or ambitions to open more sites in future, it’s important that their captive portal supports the majority of vendors. Otherwise, things will start to break as new locations open or new access points are installed. Every vendor has its own take on authentication, and unfortunately documentation is often lacking.

The best way to achieve multi-vendor support is simple; get the hardware and test it.

Integration

Access points are not the only technical consideration, especially as hospitality digitizes and businesses use more tech vendors for more services. For the best user experience, captive portals should integrate seamlessly with everything e.g. applications for placing orders, making payments, reserving a table or leaving reviews.

A note of caution. Sending personal registration data over FTP or by email is not an adequate integration method. This is dangerous.

Final thoughts

Ultimately, creating a good captive portal is a user experience challenge. User experience is hard to get right, and it requires continual monitoring and improvement. Captive portal self-builds that are put up once and never thought about again will always fall short. It’s a tool with the potential to transform hospitality venues, but it’s also a specialized task that takes a lot of 1. time, 2. effort and 3. expertise to get right. If a venue does not have all three to spare, it has no business building a captive portal in the first place.

Patrick Clover,founder and CEO, Stampede

Patrick Clover
Patrick Clover founded guest WiFi provider BLACKBX in 2015. The company provides businesses of all sizes with a level of customer insight previously only available to large corporations. www.blackbx.io