How to design a hotel? Work in this order: write the brief, check the site and the rules, design one guest room and repeat it, shape the shared spaces, choose materials that last, plan the photos, design the website, then test before you open. Each step comes with the checks that save money later, the accessible-room counts that apply to US hotels, and seven real hotels, campsites and apartments whose home pages scroll inside a desktop screen and a phone.
The 8 steps to design a hotel, in order
The order matters more than the style. A look chosen before the brief gets redrawn, and a website started after the photo shoot has to live with whatever the photographer found. Whether you run a villa, a gîte (a self-catering holiday house in France), a bed and breakfast, a campsite or a spa hotel, the sequence is the same; only the size of each step changes.
- Write the brief. Who sleeps here, why they chose you, and which room types you will sell.
- Check the site and the rules. Planning, accessibility, fire and energy come before the look.
- Design one guest room, then repeat it. The room is the product; get it right once.
- Shape the shared spaces. Arrival, breakfast, bar, spa and meeting rooms, drawn around how guests move.
- Choose materials, light and energy for the long run. And decide now what you will claim about them.
- Plan the photos and the names. Room names, shot list and story are fixed while the building is still a site.
- Design the website and the booking path. Guests judge the building on a screen before they see it.
- Test, open softly, then measure. Sleep in every room type and book it from a phone.
Architects give the whole process its own vocabulary. In the United Kingdom, for example, the RIBA Plan of Work splits the process of briefing, designing, constructing and operating a building into eight stages. The eight steps above are not those stages: they are the owner’s checklist for the same road, what you must decide and when.
Step 1: Write the brief before anyone draws
A one-page brief is the cheapest document in the whole project and the one that is most often skipped. It answers six questions. The table below gives each one, why it matters, and how a real property answers it on its home page.
| Question | Why it matters | Seen on the sites |
|---|---|---|
| Who sleeps here, and why this place? | Room size, noise and food all follow from the guest, not from a mood board. | Treehotel states one idea in its headline: come and stay in the trees. |
| Which room types, and how many of each? | Rooms are what you sell. Their names and sizes must exist before the photos and the booking pages do. | Mama Shelter offers room types spanning S to XXL. |
| What does the building already give you? | A strong façade or an odd floor plan is cheaper to celebrate than to hide. | The Hoxton in Brussels occupies a brutalist tower that used to be IBM’s European headquarters. |
| Which spaces are open to people who do not sleep here? | A bar, restaurant or spa is a second audience, with its own opening hours and booking path. | Mama Shelter’s booking panel has separate tabs for a room and for a table. |
| What will you claim about energy, materials and food? | A claim has to be built in; it cannot be added to the brochure later. | Henriette Stadthotel Vienna builds a “Circular Living” room around certified materials. |
| How will guests book? | The booking path decides where the buttons, the phone number and the policies go. | Augustins 1261 has one booking button for each of its two houses. |
Step 2: Check the site and the rules before the look
Zoning, fire safety, energy codes and accessibility differ by country, by state and often by town, and they shape the plan far more than finishes do. Ask the local planning office what applies, and put the answers in the brief. Accessibility deserves a closer look, because its room counts and door widths are set on the drawings.
How many accessible rooms does a US hotel need?
For transient lodging in the United States, the 2010 ADA Standards for Accessible Design set the minimum number of guest rooms with mobility features by the total number of rooms (Table 224.2), and of guest rooms with communication features such as visual alarms (Table 224.4). The first rows of both tables are below, as published on ada.gov.
| Total guest rooms | Mobility, no roll-in shower | Mobility, roll-in shower | Mobility, total | Communication features |
|---|---|---|---|---|
| 1 to 25 | 1 | 0 | 1 | 2 (for 2 to 25 rooms) |
| 26 to 50 | 2 | 0 | 2 | 4 |
| 51 to 75 | 3 | 1 | 4 | 7 |
| 76 to 100 | 4 | 1 | 5 | 9 |
| 101 to 150 | 5 | 2 | 7 | 12 |
Two more provisions change the drawings:
- Dispersion (section 224.5). Rooms with mobility features and rooms with communication features must be spread across the room classes, so a guest who needs them has choices of room type, bed count and amenities comparable to other guests. The advisory text lists room size, bed size, cost and view among the factors, which means they cannot all be the cheapest category.
- Doors (section 224.1.2). Even a guest room that is not one of the accessible rooms needs entrances, doors and doorways that meet the clear-width requirement of section 404.2.3, bathroom doors included. Shower and sauna doors are excepted.
Step 3: How to design a hotel room, then repeat it
The guest room is the product, so it is the one space worth drawing full size before anything else. Design a single room until it works, then repeat it, and add variations only where the brief calls for them. Treehotel takes the opposite road: every room is a different design, credited to an architect or design studio (Bjarke Ingels Group, Snøhetta and Tham & Videgård among them), and the home page presents them one by one. That suits a signature property. Most owners are better served by a few well-resolved room types, the way Mama Shelter offers sizes from S to XXL.
Walk the plan with a checklist rather than a style guide:
- Move through it twice. Once with two open suitcases, once in the dark on the way to the bathroom. Every collision you find on paper costs nothing.
- Zone the room before you place the furniture. Sleeping, washing, storing and, if guests will work there, a desk with a real chair and a socket. Draw the four zones and the path between them.
- Give luggage a place. A bench, a rack or open floor, but somewhere that is not the bed.
- Put a light switch and a power socket within reach of each side of the bed. Guests notice when they are missing, and rarely mention them when they are there.
- Plan sound on the drawing. Door seals, the wall between room and corridor, and plumbing that does not run beside a headboard are far cheaper before the walls close.
- Choose darkness and warm light. Real blackout curtains and one warm reading light per guest.
- Design the bathroom for wet towels and open toiletry bags. A place to hang, a shelf at hand height, and ventilation that actually clears steam.
- Design for the housekeeper. Surfaces that clean in one pass and furniture that does not trap dust: cleaning time is a running cost.
- Make room types differ in ways a guest can see. Space, view, bathroom or terrace: a difference that shows in the photos is easy to sell, and one that only shows on the rate card is not.
- Find the photo. Every room type needs at least one angle that sells it. If you cannot find it on the plan, the guest will not find it on the screen.
Step 4: Shape the shared spaces around how guests move
Draw the guest’s day, not the floor plan: arrival, luggage, check-in, breakfast, going out, coming back. Then ask which spaces non-guests will also use, because those need their own entrance logic, hours and booking path.
Ace Hotel states the idea in its home-page introduction: considered, contemporary design and, it adds, good restaurants, public art and lobby parties. The same page lists events and stories from venues that go with its hotels, such as Kiln in Sydney, Alder in Toronto and Mr. Maurice’s Italian in Kyoto. Mama Shelter makes the same point with three sections on its home page: Stay, Eat & Drink, Work & Celebrate. Henriette Stadthotel Vienna lists conference rooms for up to 42 people, a car park in the secure inner courtyard, and a bicycle garage with an e-bike charging station. Each of those is a decision made on the plan, long before a website can advertise it.
For a small property the same logic scales down. A gîte with a hot tub, a bed and breakfast with a breakfast room open to walk-ins, a campsite with a café counter: decide whether the space serves guests only or the neighborhood, and give it the entrance, the opening hours and the toilets that decision requires.
Step 5: Choose materials, light and energy for the long run
Finishes are bought once and cleaned for years. Choose them for how they age under real use, how fast they clean and what they say about the place. If you plan to make an environmental claim, such as an ecolabel or a carbon figure, say so at this step: certifications ask for records, meters and supplier documents that are easy to set up in the design stage and painful to rebuild afterward.
Henriette Stadthotel Vienna shows what that looks like on a family-run property. Its “Circular Living” rooms are inspired by the Cradle to Cradle approach, with C2C-certified tiles and wall paint. The hotel says its blankets and pillows are made of linen, cotton and maize with no polyester, that rooms are cleaned with steam rather than chemical products, and that it holds the Austrian Ecolabel and the EU Ecolabel. It also publishes a carbon figure of 1.28 kg CO₂e for each night, for scopes 1 and 2 in reporting year 2022. Those are the hotel’s own statements, and they work as marketing because each one traces back to a decision in the building. Whatever label you aim for, read its published criteria while the plans can still change.
Step 6: Plan the photos and the names while the building is still a site
Names, photos and the story of the place are design work too, and they are cheapest to decide before the building is finished.
- Fix the room names and types now. The website, the booking engine and the photo shoot all need the same list.
- Write the shot list from the plans. Exterior at dusk, each room type in daylight, the bathroom, each shared space, and details such as a door handle or a view.
- Keep the story that comes with the building. The Hoxton writes a line about each building: 11 restored Georgian townhouses in Edinburgh, a 17th-century residence in Paris, a 1950s building in Vienna. The buildings already had the story, and the home page simply tells it.
- Credit the designers if they are worth crediting. Treehotel credits an architect or design studio for each of the nine rooms its home page lists, and the credit reads as part of the product.
Step 7: Design the hotel website and the booking path
Guests meet your design on a screen first. The website therefore has to carry what you just built: the rooms, the atmosphere and the way to book. Start it when the room types are fixed, so that it can be tested and indexed before opening. The seven sites further down show each decision at work; this is the short list.
- Give each room type its own page. Photos, size, beds, capacity, facilities and a booking button. Treehotel gives each room a “View room” button; Huttopia explains its ready-to-camp lodgings (beds, a deck, a kitchen corner, a bathroom in some cases) before a visitor searches.
- Make the first screen do three jobs. Show the place, say what kind of property it is and where, and offer a way to book without scrolling. The Hoxton puts location, dates, guests and a promo code on the cover photo; Henriette puts “Enquire” and “Book” in a bar along the bottom of the first screen.
- Design for the phone first. Google indexes and ranks a site from its mobile version and recommends that the mobile pages carry the same content as the desktop ones, so a room description that exists only on desktop may not be indexed.
- Keep it fast. By the Core Web Vitals thresholds on web.dev, a page is good when its largest content appears within 2.5 seconds (LCP), it answers a tap within 200 milliseconds (INP) and its layout shifts by no more than 0.1 (CLS), measured at the 75th percentile of page loads.
- Offer the languages your guests speak, fully translated. Treehotel’s page is in English; Augustins 1261 offers English, French and German; The Hoxton, six languages. Google explains how to tell search engines about localized versions.
- Take bookings on your own site. A booking made on your own site is not subject to a platform’s commission. Bookings taken with Booky, the booking engine of Hotel Web Design, carry 0% commission; Booky is part of the website itself rather than a third-party service, and it suits small hotels, guest houses, gîtes and holiday rentals. Platforms still bring guests who do not know you yet, so many properties keep both: the site’s job is to win the guest who already has your name, and to answer the questions that make people hesitate.
Hotel Web Design is listed in the official Google Hotels connectivity partner directory.
If you are specifically designing a hotel website, our French-language guide covers the nine steps of site design in detail: Conception d’un site web d’hôtel. The seven examples below show the same decisions on live sites.
Step 8: Test, open softly, then measure
Before the first paying guest, run three tests:
- Sleep in every room type. One night each, with the person who will clean it. Note the noise, the light at 6 a.m., the shower and the nearest socket.
- Book it yourself, on a phone, as a stranger. From a search result to a confirmed reservation, on the cellular connection of a mid-range phone. Count the taps and write down every moment you hesitated.
- Read the site aloud. If a sentence could describe any hotel in the country, replace it with a fact about this one.
After opening, look at where guests drop off in the booking path, which pages are visited before a booking, and what the reviews mention without being asked. Those three sources tell you what to redesign next. Keep measurements to what you can act on, and keep visitor counting simple and respectful of guests’ privacy.
Seven hotels, campsites and apartments to learn from
Each example below was opened on October 24, 2026, and what is described is what the page showed that day. Cookie banners and seasonal offers are hidden from the captures, which scroll a home page inside a desktop screen and a phone, so you can see how the design is sold on each. They run from a signature treehouse hotel to a campsite network and a pair of apartment houses in Avignon, and they are not ranked. The last one is a site that we built.
Treehotel
Hotel of designer treehouse rooms · Harads, Sweden
The first screen is a slideshow of rooms, not of facilities. The headline reads “Come and stay in the trees”, and each slide shows one treehouse room by name, with a “View room” link and arrows. The names do the marketing (Mirrorcube, The Cabin, Biosphere, Bird’s nest, Dragonfly), and the page credits the architect or studio of each room it lists, such as Bjarke Ingels Group for Biosphere, Snøhetta for the 7th room and Tham & Videgård for Mirrorcube.
Every room has its own page behind the link, and the “Book now” buttons lead to an external engine, Bookvisit. On desktop an orange “Book now” button sits in the header. On a phone the slide fills the whole first screen and the menu shrinks to one icon, so the room comes first and the booking path after: there is no booking button in that first screen.
Key takeaways
- Rooms sold by name, with the architect credited.
- One page per room behind a “View room” link.
- On a phone the first screen carries no booking button: the room comes first.
- Type
- Hotel of designer treehouse rooms
- Location
- Harads, Sweden
- Booking
- Bookvisit
- Languages
- English
The Hoxton
Neighborhood hotels · Europe and the United States
A booking bar sits at the bottom of the cover photo: location, check-in and check-out, guests and a “Got a code?” field, with a “Find a Room” button. The same button stays in the header. On a phone the bar becomes a short stack of fields under the photo and the button moves to the top corner.
The home page then lists the hotels, each with a sentence about its building: a brutalist tower that was IBM’s European headquarters in Brussels, a 17th-century residence in Paris, 11 restored Georgian townhouses in Edinburgh, a 1950s building in Vienna. A “Why book with us?” link in the main menu makes the case for booking direct, and the page says direct bookings unlock the group’s best rates.
Key takeaways
- A booking bar on the cover photo, with a promo-code field.
- One sentence of building history per hotel.
- A “Why book with us?” link in the main menu.
- Type
- Boutique hotel group
- Location
- 19 hotels listed, in 10 countries
- Booking
- Own booking pages (booking.thehoxton.com)
- Languages
- English, Spanish, German, Dutch, French, Italian
Mama Shelter
Design hotels with restaurants and rooftops · 22 locations listed
The home page opens on a slideshow of photos and one yellow button, “Choose destination”. The network lists 22 locations, three of them marked as opening at the end of 2026, so the first question is where, not which room. The top menu follows what a guest does: Sleep, Eat & Drink, Work & Celebrate, Offers. A “Book” button in the corner opens a panel with three tabs: a room, a table, and privatization and groups. The room search goes to the group’s own booking pages.
The writing is designed as carefully as the rooms. The line “Mama’s got it all going on!” leads into a short list of what a stay includes: bedding, rooftop drinks, generous dining, free movies. Three tabs (Stay, Eat & Drink, Work & Celebrate) give each part of the offer its own short text, and the rooms are sold in sizes from S to XXL. On a phone, a “Book” button and a phone icon float at the bottom of the screen.
Key takeaways
- A menu that follows the guest’s day: sleep, eat and drink, work and celebrate.
- One booking panel with separate tabs for a room, a table and a group.
- A tone of voice that matches the interior design.
- Type
- Hotel group with restaurants and bars
- Location
- 22 locations listed (3 opening at the end of 2026), from Paris to Singapore
- Booking
- Own booking pages (bookings.mamashelter.com)
- Languages
- English, French, Italian, Portuguese, German, Czech, Serbian, Arabic
Ace Hotel
Lifestyle hotels · North America, Japan, Australia and Greece
The home page starts with a full-screen video, a round pause button and “Welcome to Ace Hotel”, then one paragraph that states the whole design idea: respect for history beside contemporary design, restaurants, public art and lobby parties, in hotels that are globally minded but locally focused. A carousel of locations follows.
An orange “Book now” button sits in the header on desktop and phone and opens a form: location, dates, guests and an optional code (group, promo, coupon or corporate). The events listing and the journal on the same page name venues that go with the hotels, such as Kiln in Sydney, Alder in Toronto and Mr. Maurice’s Italian in Kyoto, so the restaurants and bars are promoted from the hotel’s own home page.
Key takeaways
- A pause button on the full-screen video.
- One paragraph that states the brand’s design idea.
- Restaurants and bars named on the home page, in its events listing and journal.
- Type
- Hotel group with restaurants and public art
- Location
- 8 hotels listed, from Seattle to Athens
- Booking
- Own reservations site (reservations.acehotel.com)
- Languages
- English, Japanese, Greek, Korean, Chinese
Henriette Stadthotel Vienna
Family-run 4-star city hotel · Vienna, Austria
Where the big groups sell a lifestyle, this family hotel sells its values. The headline starts “A good place in Vienna…” and an illustrated character walks through the photo. Under the first screen, four short arguments each end in an arrow to the page behind them: the central location, natural materials for sleeping, a certified organic breakfast and a best-price guarantee.
Two buttons, “Enquire” and “Book”, sit in a bar along the bottom of the first screen on desktop and phone. “Enquire” opens a non-binding enquiry form and “Book” opens the booking engine, so a guest who is not ready to commit still has a way to ask. The sustainability claims (ecolabels, a footprint figure per night) have their own pages in the menu.
Key takeaways
- Two buttons: a non-binding enquiry and a booking.
- Four arguments, each linked to the page that explains it.
- Sustainability claims published on the site’s own pages.
- Type
- 4-star city hotel with 68 rooms
- Location
- Vienna, Austria
- Booking
- OnePageBooking
- Languages
- English, German
Huttopia
Nature campsites · France and Europe
The first screen is an illustration, not a photo: cabins lit up at night under the stars, with the search panel sitting on the lower edge of the picture (destination, arrival, departure, “Search”) and a “See the map” link. A banner at the very top announces a discount code for 2027 stays, and a green “Book” button sits in the header.
Right below the panel, a list of five expandable items explains the offer before any search: campsites, city campsites and bivouacs; ready-to-camp lodgings (bedding, a deck, a kitchen corner, in some cases a bathroom); pitches for tents or motorhomes; private natural spots; activities and services. For a network of campsites, that explanation does the work that room pages do for a hotel, and each campsite is labeled Origin, Authentic or Iconic.
Key takeaways
- A search panel on the cover illustration: destination, dates, one button.
- Accommodation types explained before any search.
- Seven languages, with a banner when the browser’s language differs from the page’s.
- Type
- Campsite network
- Location
- France, Spain, Portugal, the Netherlands and Belgium; a separate site for the USA and Canada
- Booking
- Own checkout (checkout.huttopia.com)
- Languages
- English, French, Dutch, German, Italian, Portuguese, Spanish
Augustins 1261
Luxury apartments in two houses · Avignon
An agency project, so we can say what we chose. Two houses classified by Atout France, five and four stars, mean two booking paths: the home page offers “Book the Cloître” and “Book the house”, each opening the Reservit engine of that house, and a general “Booking” button sits in the header. The cover photo is the flowered patio, with both house names and their star ratings written on it.
The text under the photo does the positioning: a few apartments, a human scale, owners who live on site, and a spa area with a jacuzzi and fitness open to guests by reservation. The menu sorts pages by house and by apartment and adds Excursions, Art & Patio and Blog pages, so the site talks about the stay and not only the rooms.
Key takeaways
- One booking button for each house, tied to that house’s own engine.
- Both houses and their star ratings written on the cover photo.
- Pages on excursions, art and the patio beside the apartment pages.
- Type
- Furnished apartments, 5 and 4 stars
- Location
- Avignon, inside the ramparts
- Booking
- Reservit
- Languages
- English, French, German
The seven at a glance
| Website | Location | Type | Booking | Languages |
|---|---|---|---|---|
| Treehotel | Harads, Sweden | Hotel of designer treehouse rooms | Bookvisit | English |
| The Hoxton | 19 hotels listed, in 10 countries | Boutique hotel group | Own booking pages (booking.thehoxton.com) | English, Spanish, German, Dutch, French, Italian |
| Mama Shelter | 22 locations listed (3 opening at the end of 2026), from Paris to Singapore | Hotel group with restaurants and bars | Own booking pages (bookings.mamashelter.com) | English, French, Italian, Portuguese, German, Czech, Serbian, Arabic |
| Ace Hotel | 8 hotels listed, from Seattle to Athens | Hotel group with restaurants and public art | Own reservations site (reservations.acehotel.com) | English, Japanese, Greek, Korean, Chinese |
| Henriette Stadthotel Vienna | Vienna, Austria | 4-star city hotel with 68 rooms | OnePageBooking | English, German |
| Huttopia | France, Spain, Portugal, the Netherlands and Belgium; a separate site for the USA and Canada | Campsite network | Own checkout (checkout.huttopia.com) | English, French, Dutch, German, Italian, Portuguese, Spanish |
| Augustins 1261 | Avignon, inside the ramparts | Furnished apartments, 5 and 4 stars | Reservit | English, French, German |
The hotel design checklist: what to settle before the plans are final
- The brief fits on one page and says who the guest is.
- Room types are named, sized and counted.
- Accessibility counts and room dispersion are checked against the local rules.
- One guest room has been walked through on paper with luggage and in the dark.
- Sound, blackout and cleaning have been drawn, not assumed.
- Every space open to non-guests has its own entrance, hours and booking path.
- Any environmental claim has a record behind it from day one.
- The shot list exists and matches the plans.
- The website brief lists the pages, the languages and the booking engine.
- Someone has booked a room on a phone before opening.
Six mistakes that are expensive to fix later
- Choosing the look before the brief. The style then fights the use of the room.
- Treating accessible rooms as an afterthought. The counts, the doors and the dispersion rule can force a redraw once a plan is nearly final.
- Drawing the guest room once, in a render, and never walking it. A render has no luggage in it.
- Starting the website after opening. The first months are the ones when the property is new in search results and has the least to show.
- Designing for the opening photo only. A room that photographs well but is hard to clean, repair or sleep in ages fast.
- Making an environmental claim that the building cannot prove. It is the claim guests and journalists check first.
Questions about designing a hotel
How do you design a hotel step by step?
Eight steps, in this order: write the brief; check the site and the rules; design one guest room and repeat it; shape the shared spaces; choose materials, light and energy; plan the photos and the names; design the website and the booking path; test, open softly and measure. The order matters because each step fixes what the next one can change cheaply.
How do you design a hotel room?
Design one room until it works, then repeat it. Walk the plan twice, once with two open suitcases and once in the dark on the way to the bathroom; give luggage a place that is not the bed; put a switch and a socket within reach of each side of the bed; draw the door seals and the wall to the corridor for sound; plan real blackout curtains and one warm reading light per guest; and design surfaces that clean in one pass. Then find the one angle that sells each room type.
How many accessible rooms does a hotel need in the United States?
The 2010 ADA Standards for Accessible Design set it by the total number of guest rooms. A hotel of up to 25 rooms needs at least 1 room with mobility features; 26 to 50 rooms need 2; 51 to 75 need 4, one of them with a roll-in shower; 76 to 100 need 5, one with a roll-in shower; 101 to 150 need 7, two with roll-in showers. Rooms with communication features are counted separately, and accessible rooms must be spread across the room types. These are US federal minimums: state codes and other countries differ, so check with your local building authority.
What should a hotel website show on its first screen?
The place, what kind of property it is, and a way to book or ask without scrolling. On the seven examples above that means a booking bar on the cover photo (The Hoxton, Huttopia), a booking button in the header (Ace Hotel, Mama Shelter), or an enquiry and a booking button together (Henriette). Treehotel puts the room first (it has a “Book now” button in the header on desktop, none in the first screen of a phone), which suits one signature product but not a property with many room types.
How do you design a hotel website?
Give each room type its own page with photos, size, beds, capacity and a booking button; make the first screen show the place and a way to book; design for the phone first, because Google indexes and ranks a site from its mobile version; keep pages fast (Core Web Vitals: largest content in 2.5 seconds or less, interaction in 200 milliseconds or less, layout shift of 0.1 or less); offer the languages your guests speak, fully translated; and take bookings on your own site.
Can a hotel take bookings on its own website without paying commission?
Yes, with a booking engine on your own site. Bookings taken with Booky, the booking engine of Hotel Web Design, carry 0% commission. Booky is part of the website itself rather than a third-party service, and it suits small hotels, guest houses, gîtes and holiday rentals. Larger properties can keep an external engine such as Reservit, D-Edge or Availpro. Platforms still bring guests who do not know you yet, so many properties keep both, and use the website to win the guest who already has their name.
Does Hotel Web Design design hotels and rooms?
No. Hotel Web Design builds the website and the booking path of hotels, bed and breakfasts, gîtes, villas, campsites and restaurants. Buildings, rooms and interiors are the work of architects and designers. Hotel Web Design is listed in the official Google Hotels connectivity partner directory.
