It seems this pattern is quite common in mobile apps, but not so common on the web.
(Assuming that most people use their right hand to control the mouse)
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.Sign up to join this community
Airbnb is a US-based company. Most of its revenue generated in the US itself. Statistics shows that ios is the topmost OS used in the US where the close button is located at the top left. By placing a close button to left they have persistence and familiar UI across different devices which will reduce cognitive load for ios users.
There are several reasons working together that make this close button on the left side the optimal deicion in this case:
First - Why put close buttons on the left side in apps:
One of the most common uses of a close button is in the navigation bar of a screen in the app. It can be thought of as a 'back button' for screens or dialogues that come on top of the existing flow your user is currently in. This is why most of the back gestures work on screens with close buttons.
With apps there are always short on screen space. Almost always you have relevant buttons you need to put on the navigation bar, since they usually propagate the user forward (instead of backward like the close button) - such as save, share, comment, report etc. You want to have these on the right side because more people use their right thumbs to operate their decides. (Big exception here - forward and backward propagating flows with the close acting as a 'cancel flow' button)
This leaves the left side of the navigation bar as the most likely place you would want to have the close button (or back button), especially with large products. Why?
Second - Because consistency.
Even if you really want to have the close button on the right side, if you have a large product, you will inevitably have a couple of screens where it is on the left side. Since you don't want to confuse your user, you will likely fallback to the most common place where this button can be - the left side of the navigation bar.
Third - The specific case in your screenshot.
While it would be logical to deviate from your mobile design system in order to serve your desktop users better, you need to consider two additional arguments for sticking to the left side close in this case:
Since your web mobile version will probably follow the mobile app pattern, you have to do the exception just for desktop. And most of the developers I've worked with usually aren't very happy to support an exception if it doesn't have a large enough impact.
TL;DR: Because close is back; too much stuff on mobile navigation bars; and product and platform consistency.
It may be a result of their design system consistency across platforms combined with a mobile-first approach.
In this article, you can see that although the main navigation are different across platforms (adjusting for conventions), page navigation is consistent.
Using the same design system, we can see how it applies to iOS, Android and Responsive website:
And here it is applied across languages as well, since Airbnb has to account for global usage of their app.
But there is nothing to say that the close button cannot be in the right, as shown during their React Conference.
Finally, it seems that the consensus agrees the button should be on the right side due to familiarity. The definitive answer might change per product and what the target audience is used to. Whether someone grew up with Mac or Windows, how OS instincts translate to web, the types of website they frequent, etc.
The action button has always been put at the right corner, like 'SAVE' or 'ACCEPT', people are familiar with this. For most people read from left to right, the next step is always at the right side. Thus the designer put the cancel button and back button at the left, and this make sense.
And if you make a rule like this in your design system. All pages should follow the rule for consistency.