Real Estate Website Design

The first decision: how do listings get onto the site?

Every other choice follows from this one, so settle it before you look at designs. There are three routes.

Choose the widget only as a stopgap. As a rule of thumb, choose the feed if you have more than a few dozen listings. Choose manual entry for a developer with a limited number of units or an agent with a small, high-value portfolio. Test whatever you pick: use the URL Inspection tool in Google Search Console on a listing page and check that the rendered page shows the property text.

Design the search around how buyers actually filter

Visitors narrow by location, price, bedrooms and property type, and then go back and forth between a list and a map. Build for that loop.

• Put the filters on the left on desktop and in a bottom sheet on a phone, with the thumb in mind.
• Show the result count and active filters at the top, with a one-tap reset.
• Keep the map and list synchronized, so tapping a pin highlights the card.
• Remember the visitor's last filters when they return from a listing.
• Offer saved searches by email, which is also a low-cost way to capture a lead.

Faceted search and crawling

Filters create URLs, and combinations multiply fast. Google warns that faceted navigation based on URL parameters can create effectively infinite URL spaces, which wastes crawling on useless pages and slows discovery of useful ones. Its options include blocking filtered URLs in robots.txt, pointing them to a canonical page (less effective over time), and adding nofollow to links, which only works if every link to the URL carries it. If you do want some filtered pages indexed, such as "2 bedroom apartments in [town]", make those specific combinations proper pages with their own text, and return a 404 for combinations with no results.

The anatomy of a listing page

Lay the page out in this order from top to bottom:

1. A large lead photo and a gallery link, with the price, status and address beside it.
2. Key facts: bedrooms, size, floor, year built, energy rating where relevant, and service charge.
3. A sticky contact bar with click-to-call, WhatsApp and a viewing request, so the next step is always on screen.
4. Your own description, written for a specific kind of buyer.
5. Floor plan, then features.
6. A map with nearby transport and schools.
7. Similar properties.

Label each listing page with the RealEstateListing type from Schema.org, and mark up only what a visitor can see on the page. Every listing also needs a status field that changes the page: available, under offer, sold. A visitor who finds a sold property with no explanation leaves, and one who finds a sold property with five similar options may not. Our SEO for real estate agents guide explains what to do with pages after a sale.

Photos without slow pages

Photos win enquiries and can wreck page speed. Of Google's three Core Web Vitals, the first is the one a gallery threatens: a largest contentful paint of 2.5 seconds or less counts as good. The other two targets are 200 milliseconds or less for interaction to next paint and 0.1 or less for layout shift, all measured at the 75th percentile of page loads.

Here is a worked example with illustrative numbers. A listing has 30 photos at 400 KB each, or 12,000 KB in all. If the page loads every photo at once, a visitor downloads about 12 MB before the gallery settles. If it loads only the first three photos and fetches the rest when the visitor opens the gallery, the first load is 1,200 KB, about 90% less.

Practical rules:

• Serve modern image formats and a size that matches the screen.
• Load the lead photo first and the others when needed.
• Set a width and height on every image so the layout does not jump while loading.
• Keep video behind a click rather than autoplaying it.

Our Core Web Vitals explainer covers how to measure.

Capture the enquiry and follow up

A property enquiry goes cold fast. Provide three ways in: a viewing request form, a click-to-call number and a WhatsApp link. Make the form short, ask which property and when the visitor is free, and send a confirmation at once. Plan who replies and how soon before you launch. If staff cannot answer within a few hours, an automated first reply helps, and our guide to automating lead follow-up explains the options.

What drives the cost

We do not publish prices and we quote in writing. These are the items to ask any provider to price separately:

For typical cost ranges and what moves them, see our guide to the cost of building a website. To start a project, read about our web design service.