Airport websites. They have to be better than airport food, right?

Ben and I have been working on a Marketing/Advertising RFP for the Wilmington International Airport and as part of my research, I looked at local “competing” airport websites. I was very surprised (and disappointed) at some of them because of their overall lack of attractiveness and functionality.

It got me thinking… I wonder how the most traveled airports in the WORLD measure up when it comes to designing a proper home page that is attractive, easy to navigate and includes the essential tasks that a user might want to accomplish (arrival departure, book a flight, transportation (to and from), parking, etc.) Some of them have some pretty unique features…like a mobile app!

I hopped over to Wikipedia and found a handy list of the busiest airports and set off to see how they all stacked up.

1. Hartsfield-Jackson – Atlanta International Airport, Atlanta, GA

The airport with the most passengers in 2012 was the Atlanta International Airport. But is their website also the best? Nah, but it’s not the worst either. Atlanta’s site is one of the better sites as far as providing essential information like arrival/departure, parking and security wait times (there are only a few sites that do this) in a way thats easy to find.  I will say their “Passenger Information” drop-down menu is a bit overwhelming and would be more effective if better categorized. Icons would be helpful too since most users don’t want to have to read.

The visual design is not bad, but it certainly does not elevate the site either. They also have a mobile website for travelers on the go.

2. Beijing Capital International Airport, Beijing, China

 Beijing has the second highest number of passengers in the World…and they are making those passengers go to a second page on their website to find basic airport info. Once you click on “Flight Info” in the menu or “Flight Search” on the left, it takes you to a much more user friend page for travelers just wanting to access the essential info.

3. London Heathrow Airport, UK

 

I never like it when an advertisement is across the top of a homepage, but once I get past that, London is doing a lot of things right. For example, the Arrivals and Departures are front and center (you can refresh for up to date status) and you can reserve parking on the homepage.

I’m not crazy about the gray and purple and the very “serious” tone of the site. I enjoy sites like the Charlotte Douglas Airport that have more vibrant and energetic colors.  London is 2 of 3 of the top 3 sites that has a mobile app.

4. O’Hare International Airport, Chicago, IL

 

The Chicago Airport homepage is another favorite. I feel like the designer of this site put a lot of thought in the design of the site and providing a good user experience. It has a sleek, simple, modern design with photos, images and large text to direct the users eye where it needs to go.  Instead of everything being squeezed “above the fold” you just scroll down to see directions to/from, modes of transportation and parking details.

It has the feel of a parallax scrolling (although it is not) website as the background shifts from clouds to the city’s silhouette.

They do have a mobile site, but not a mobile app.

5. Tokyo International Airport, Tokyo, Japan

 

You really need to click on this website for the full effect. It’s pretty funny to see all the elements “fly” in from off the screen.  They Tokyo International Airport or Big Bird uses the homepage only as a filter page to get to the essential info like flight info, directions and a terminal map.

6. Los Angeles International Airport, Los Angeles, CA

This homepage does a good job serving as a filter page. I really like how LAX separated all the essential sections using text and images. It’s ok to not have all the info right on the homepage as long as you can easily get users where they want to be and LAX does a good job of that.

7. Paris Charles de Gaulle Airport, Roissy-en-France, France

This is a well-designed site that has all the necessary features of an airport website. Plus, it’s pretty. 😀 They use icons well and the information is easy to find. High five, Paris!

They also have a mobile website AND mobile app that. There is even and app created specifically for Chinese travelers.

8. Dallas Fort Worth International Airport

Dallas has a good thing going and is one of the better sites at displaying their content in a way that is easy to find and use.  The site layout is very easy to navigate and find the information you need on flights, parking and terminals. I’d like to see some better images or icons that help the user know they are in the right place. I don’t know…maybe an airplane?

It could be the best site if there was some sprucing up in the visual design department. Replacing some of the gray and white with color and introducing some design elements could go a long way.

The are in good company with other Airports that cater to mobile users by launching their own Mobile app.

9. Frankfurt Airport, Germany

 

Ugh, I hate that they have an ad as the first thing on the site. Especially since the ad at the top and right side are flashing at me.

The visual design feels outdated, but it’a a good airport website in that it addresses all the essential information needed on a homepage.

10. Soekarno-Hatta International Airport, Indonesia

 

The biggest thing to me about this site is that I’m not sure if it’s the real website for the airport. Google makes me think so, and after digging around, it turns out that I am, but with the title “Jakarta Airport Guide”, I halfway believe this is a fan site, or some other kind of non-official site.

It doesn’t help that the site doesn’t feel official at all. It looks like a wordpress theme and it is covered in ads (you can’t see them all in the pic). It’s nice to have a few photos so that users know they are in the right place, but not when the photos are taking the place of important information that should be easy to find on the homepage…such as flight arrivals & departures. Come on Soekarno-Hatta Intl. Airport, You are #10 in passengers in the WORLD!

11. Dubai International Airport, UAE

 

The Dubai airport site looks nice at first. It seems clean and modern. But once you get past the first impression, the site starts to struggle (as demonstrated by the screen shot below). Once you get past what is above the fold, the site looks incomplete.

 

I do have to say, I’m a fan of their Call-to-Action for feedback.

12. Hong Kong International Airport, Hong Kong, China

 

This is a website I can get behind. It does a good job of showing one of the stand out visual pieces of the airport and makes it easy for users to get at all essential information. The CSS menu panels that “drop up” instead of “drop down” are a nice touch.

13. Suvarnabhumi Airport, Turkey

 

Turkey’s airport website at first glance has nice visual aesthetic. Once you start using the site, that good feeling goes quickly away and turns to frustration. It’s not that the information isn’t there, it’s that the visual design changes are abrupt enough to be head scratching. The homepage addresses the day’s arrivals and departures but fails to provide easy access to the other most crucial information:  address parking, transportation or directions to/from. It’s true this information is on the “Passenger” page, but in my opinion, this harms findability. If you’re traveling, be sure to give their mobile app a try.

14. Denver International Airport, USA

 

I love the website for the Denver Airport. Its easy to find what you are looking for and it’s pretty. The header image scrolls to show news and updates. One of the best things is the green column in the screenshot. It’s all of the most important airport stuff there at a glance: estimated wait time at security, parking lot availability, and road conditions (important for a place that gets snow regularly). Totally cool.

15. Changi Airport Singapore

 

This site has a lot of things going for it. Attractive visually, has necessary elements, and I like their use of visual indicators. And oh yeah… a mobile app! They are also one of the few with sites with a video on the homepage. The video (which is actually on a separate page) does a good job of making me want to visit the airport. I can’t believe I just wrote that last sentence.

16. Amsterdam Schiphol Airport

 

The Amsterdam Airport reminds of the Atlanta Airport website mixed with a Yellow Pages website. I’m torn about it. On the one hand, you can get to arrivals, departures, parking, taxis, shopping, and airport news right from the front page. But there’s something about the yellow and the creepy baby in the image (seriously, wtf?) that I don’t get. It feels like this website crash landed in an IKEA. Notable: If you’re in an IKEA (or anywhere else mobile) and want to hook up with the airport, there’s an app for that.

17. John F. Kennedy International Airport, NY

 

While the JFK site is pretty bland in design compared to other sites. It is heavy on the use of icons with no use of real photography. At first glance, you might wonder if you are in the right place since there are no people or airplanes and the first thing your eye goes to is a digital map of the AirTran. But I imagine that if you’re a local and used to navigating The City via map, this is more intuitive. But to folks from other parts of the country (and world), a little photographic contextualization would be nice. They use FlySmart integration for their Mobile App.

18. Guangzhou Baiyun International Airport, China

This website is an exercise in confusion. And I’m willing to chalk it up to a difference in cultures. Unlike most other places, this website seems to “respect” the airport more than the others. Maybe it’s the line of workers in the main image, flanked by the building. Maybe it’s the fact that you can view the airport magazine or airport videos in the sidebar images but in order to access flights, you have to hit the plane icon (highlighted in the image above) that’s on a moving slider.

The airport seems to have an English version by the looks of it (in the upper right hand corner) but that button doesn’t work. To get the English version, you’ll need Google Translate.

19. Madrid Barajas Airport, Spain

The Madrid Airport suffers from the same problem as Guangzhou Baiyun International Airport… the English version of the site doesn’t work! I mean, Google Translate. But damn! (If you have Chrome, the browser will helpfully ask if you want it to translate it, but this seems like a pretty big UX misstep to me. You can not offer a translation and that’s one thing. But to offer it and then not have it… that’s just plain irritating. The site itself isn’t terrible. It seems easy enough to navigate. But there’s nothing that makes me love it either. It is, as I imagine the airport to be: functional and that’s about it.

20. Shanghai Pudong International Airport, China

 I wonder if the folks at the Shanghai Pudong Intl. Airport have any sort of friendly rivalry with the Guangzhou Baiyun International Airport. If so, they win points for their website. Unlike Guangzhou, Shanghai Pudong’s website puts the important icons right out front. We could talk about how it might be nice to display some of that information directly on the front page but when the alternative is to hit the moving icon, like on the Guangzhou website, it makes it hard to complain.

The icons themselves look like they have enough spacing to be usable on tablets. A nice UX touch.

21. San Francisco International Airport, USA

 

Geeze! Another airport website in California that kinda sucks! Everything is squeezed into a box on the homepage with only small text to filter to the essential pages you would need. The info is there, but they got it backwards. They have photos and large text and buttons for non-essential pages like YouTube and Facebook.

22. Ataturk International Airport, Istanbul, Turkey

 

Istanbul’s airport site is doing a lot of things right. I like that all their elements are segmented off in blocks with brief text, images and photography. I do, however, think they could have done a better job of what they put in each block. For example instead of just “Airport Transportion” as the filter link, including metro, seabus, bus, taxi, etc as links on the homepages. But overall, the site is well done. They have a mobile app too!

23. McCarran International Airport, Las Vegas, USA

 

Vegas baby! It has a great look and feel that communicates what users would want from the Las Vegas Airport: Big, Bold, Flashy. The text is large, easy to read and understand. Their use of icons will help non-English travelers. Findability, desirability, usability all score really high in my opinion.

They also have a super cool, yet random feature. A children’s photo mosaic website.

 

24. Phoenix Sky Harbor International Airport, Phoenix, USA

 

I’m not loving this site. It feels backwards. It’s like they’re trying to address all the details without getting the major things out of the way. Want to know about arrivals and departures? Good luck. Want to travel with your pet? You’re in luck. It’s right there on the front page. Stuff like that.

On the downside, it makes it harder for me to find what I want. But on the plus side, I bet I could find answers to just about anything I could imagine having to do with the airport on this website if I look hard enough.

25. Charlotte Douglas Airport, NC, USA

 

Bravo Charlotte! This is one of my favorite sites. There is no questions what they are and what they offer. The site design is clean and modern and it is easy to find all the essential airport website tasks.

26. George Bush International Airport, Houston, USA

 

This website is dull, gray, boxy and doesn’t feel like a site I’d like to spend much time on. But, once you get over that, the website is pretty sweet. Like the Denver Airport, Houston has wait times for TSA right on the front page. They have a helpful bar graph for how full each parking deck is and dish you off to other parts of the site: departures, arrivals, or flight search in ways that are nice and obvious. Once you get used to the cubicle-esqe nature of this website, you’ll find a lot to like.

27. Miami International Airport, FL, USA

 

This website represents Miami reasonably well. Maybe it’s the moving clouds in the background (which are apparently moving at hurricane speed) or the blue and orange color scheme, but I’m feeling the tropical vibe. After that though, it feels like this website was originally designed by the people who do the inflight magazines. It’s all content boxed by large ads.

The website isn’t bad, it’s just meh when compared to Denver, Charlotte, or even Houston.

28. Kuala Lumpur International Airport, Selangor, Malaysia

 

This website reminds me a lot of the Guangzhou Baiyun International Airport in China (#18 in this list). It’s big on the company info. Front and center is Airport News. It’s not exactly “speaking the users language” but at least they were nice enough to link to everything in the first column. Though I am curious what the HAVE YOU SEE THIS CHILD? banner is about.

On the whole, this is a bit of a disappointing website. When contrasted against the websites that work really well, Malaysia could stand a serious update.

29. Seoul Incheon International Airport, Korea

 

I remember complaining not too many entries ago about the compact nature of the San Francisco Airport website so it’s going to sound funny for me to reverse course and say that I really like this website. It just goes to show you, it’s not the size of the web page, it’s how you use it. Remember that fellas. Just a tip.

This website does a masterful job of using the compact space they were designing for to provide important information in a clear manner. To start with, they ditched the ever-present main image. Or rather, they moved it to a panel on the left side of the screen. This opens up a lot of real estate for departures and arrivals. And they manage to do this without sacrificing prime real estate for Airport News.

See that Malaysia? That’s how it’s done.

Add to that a nice use of icons, and an effective main graphic and nav and it all ads up to an excellent website. Bravo. One of my favorites.

Oh, and hey, there’s an App too!

30. Munich Airport, Germany

The Munich Airport feels weird for one reason: the white space on the left hand side needs to be raised (along with the silhouette of the airport) about 20 pixels. That way it wouldn’t feel like a mistake. And how much do they love that capital M? This website lives up to its German stereotype: very logical with all the important parts pushed to the fore. The design follows function, and only minimally. It’s like a 3 series BMW with the tight leather seats. You like it but wish they’d loosen up just a bit.

They also have a mobile app. Download “MUC Airport” in the App Store.

Conclusion

As you’d expect, there’s a wide variability among all the websites. Some seem to carry the culture of the area (JFK, Charlotte, Vegas) in their presentation. Others push non-essential information first (Jakarta, Guangzhou Baiyun, Kuala Lumpur International, Phoenix). Some look beautiful (Chicago, Charlotte, Vegas, Seoul Incheon). Others are function over form (Munich, San Francisco, Miami, Houston) even if that functionality is awesome.

As a whole, the websites don’t seem to be indicative of the type of experience one is likely to have at the airport, although it’s obvious in some cases (Charlotte, Chicago, Vegas) that the designers had that in mind.

It will be interesting to see if these websites convert to a mobile-first strategy in the future. Since their market is almost exclusively mobile, this would seem like a smart idea. But as we’ve seen, less than a third of these websites currently offer a mobile option. This arena seems ripe for growth.

How about you? Do you visit an airport’s website before or during your travels? Tell us in the comments!