Flat Margaret apartment website case study

A Flat Margaret is a 60 m² apartment in Budapest near Margit Boulevard and Margaret Bridge. The project's first version started as a bilingual, one-page introduction, then evolved into a complete, multi-page HU/EN accommodation website after analysing its content, user journeys and search opportunities.

The work went well beyond the visual design: the structure, mobile image crops, gallery and reviews, clean URLs, local SEO, performance and custom PHP-based contact and email workflow were all refined in several rounds.

The brief: a premium, independent accommodation website for direct enquiries

The goal was not another generic apartment listing. It was a dedicated online space that would show the apartment's atmosphere, amenities, neighbourhood benefits and house rules that matter to guests. The site needed to build trust while guiding visitors towards an enquiry.

Hungarian and English versions were important from the outset because the audience for accommodation in Budapest is international. Instead of swapping one layer of text with JavaScript, the languages therefore have their own URLs and search focus.

From a one-page site to a multi-page SEO website

The first working version was a focused one-page landing page: hero, amenities, gallery, guest reviews, host introduction, house rules and direct contact all appeared on a single page. It was a quick, clear introduction, but as the content grew, different search intents emerged.

The next step was therefore not simply to add more text but to rethink the entire information architecture. Separate Hungarian and English pages were created for bookings and contact, amenities, the neighbourhood and local guides — including Margaret Bridge, Margaret Island, Buda Castle and “Budapest in two days”.

The homepage still gives visitors a quick overview, while specific questions and local searches are addressed on dedicated pages. This was the project's key SEO and UX decision.

The real project challenges

• Bilingual structure: Hungarian and English content, metadata, internal links and navigation had to work together without either language being merely a copy of the other.
• A lot of information in limited space: amenities, gallery, guest reviews, house rules, host introduction, attractions and contact all needed to fit without overwhelming the homepage.
• Photo-led mobile design: simply centring the hero image and portraits produced poor crops on several screen sizes, so separate mobile positions and safe areas were introduced.
• Stabilising interactive elements: the gallery and guest reviews were given a simpler, more predictable navigation system in place of their previous autoplay and cloning logic.
• Contact forms with clean URLs: the extensionless URL rewrite rule initially redirected the PHP form handler as well, causing submissions to return a 404 error.
• Local SEO: search topics such as “Budapest apartment”, “apartment near Margaret Bridge”, “Margit Boulevard apartment” and “Budapest apartment near Margaret Bridge” had to connect naturally.

Information architecture and the bilingual user journey

The main journey follows the same logic in both languages: atmosphere and key benefits → detailed information → building trust → contact. The aim of language switching was to take visitors to the corresponding page in the other language whenever possible, rather than always sending them to the top of the homepage.

The booking and contact area uses native date fields, a country selector and a clear field structure. The country list was moved to a separate JavaScript file so hundreds of country-name options would not unnecessarily burden the main HTML content.

Internal links from homepage sections and local guides help visitors explore further, while the individual pages have their own titles, descriptions, H1s and search focus.

Mobile UX and visual refinement

The design was inspired by the apartment's elegant blue accents. Photography takes centre stage, but creating a good mobile experience required more than shrinking the desktop layout.

Across several rounds we refined the hero background positioning, upper and lower safe areas, host Levente's portrait, date fields and the six-image mobile gallery. The gallery's opening and closing JavaScript was rewritten separately for reliable touch interaction.

In the guest-review carousel, automatic cloning and infinite autoplay caused unpredictable jumps. These were removed, leaving more reliable swipe, arrow and dot navigation. It is a good example of how a flashier technique does not necessarily deliver a better user experience.

Technical issues and solutions

When clean URLs were introduced, the global rewrite rule also redirected the contact-send.php form handler to an extensionless address. Visitors saw a 404 error even though the PHP code itself worked. The fix was to exempt the form handler explicitly and correct the order of rewrite rules.

The contact form uses a custom PHP and PHPMailer workflow. It includes server-side field validation, CSRF protection, a honeypot, a 20-second rate limit and duplicate-submission protection. Enquiries are emailed to the host and can be copied to another recipient, while the visitor receives an automatic confirmation.

Static assets use versioned CSS and JavaScript URLs so hosting and browser caches do not preserve earlier broken layouts. This was particularly important during the many rounds of mobile refinement.

SEO, performance and early results

The Hungarian homepage's main search focus was “Flat Margaret Budapest – 60 m² apartment near Margaret Bridge”, while the English version focused on „Budapest apartment near Margaret Bridge” search terms. The pages have unique titles, meta descriptions, H1s, canonical URLs, structured data and internal links; the full website is also discoverable through its sitemap.

Images were delivered in WebP format with responsive sizes and appropriate alt text. After optimising the hero, CSS and loading order, the tests showed a desktop performance score of 100 also appeared.

After the new multi-page structure went live, 30 Google impressions and 2 clicks between June 22 and 24, 2026 were recorded. The new Hungarian and English homepages, booking page and several local guides received early visibility around the first page of search results. This is still a small sample, but it suggested Google recognised the new topical structure quickly.

The outcome

Flat Margaret became more than a simple apartment landing page: it is an independent, bilingual accommodation website with room to grow. Its visual presentation, local content, technical SEO and direct contact process serve one purpose: helping visitors quickly understand the accommodation and get in touch. For similar projects, see my portfolio; before planning your own, the article on website design pricing may also be useful.

This project is a particularly useful reference for me because it shows the entire process: creating a first working version, fixing mobile and technical issues uncovered in real use, and then developing the website further from both business and SEO perspectives.

View the live Flat Margaret website

Frequently asked questions

Why is an independent website useful for an accommodation provider?

It can provide a more complete picture of the property, build an independent brand, present detailed local information and offer guests a direct way to get in touch.

Why were Hungarian and English versions created?

Budapest accommodation attracts an international audience. Two languages on separate URLs, with their own metadata, internal links and search terms, help both Hungarian and international guests find the information they need.

What does local SEO mean for an apartment website?

It means naturally connecting the type of accommodation with its neighbourhood, nearby transport links and attractions, supported by a technically sound site structure, internal links and structured data.

Does the website include a booking system?

The project's primary purpose is to introduce the apartment and support direct enquiries. The contact form sends a message to the host, and the visitor receives an automatic confirmation.