A Landscape or Interior Design Studio Website: Portfolio First, Then the Inquiry

Design studios are the one segment in our cluster where the page matters most and the checklist is shortest. A contractor’s site has to carry licenses and a quote form; a studio’s site has to carry its taste. This page is about letting the work do that without making the visitor wait. It belongs to our cluster on what a website costs a trade business; the general case is on websites for design studios.

Portfolio first

The home page opens on a project, not a welcome. One strong photograph, large, with a caption that names what it is and where, for example “Hillside garden, Altadena” or “Kitchen and dining room, Craftsman bungalow, Pasadena.” Under it, the other projects in a grid, each linking to its own page.

A project page tells the story in the order a prospective client would ask it:

1. The brief. Who the client was, what they wanted, in two or three sentences.
2. The result. Eight to twelve photographs, the best first.
3. What you did. Design only, design and installation, selection of furnishings, planting plans.
4. The place. The city or neighborhood and the type of property.

Show fewer projects, in better photographs. A visitor judges a studio by the weakest photograph on the page.

One line on what the studio does

Directly under the first photograph: what you design, for whom, where. “We design residential gardens in Southern California” is enough. The same sentence belongs in the title of the home page and the first line of the Business Profile. A visitor who cannot tell in five seconds whether you do their kind of job will not scroll to find out.

Where it works

State the cities or the region in words, and keep it true. A studio that works across a county says the county; one that travels says it travels. If you want a page for each city, see service area pages that are not doorway pages; for a design studio, a project page that names the city does more than a city page without a project.

Image sizes and loading

A portfolio is heavy, and its weight is the cost of the thing a visitor came for. The rules are few and they come from Google’s own documentation.

• Serve different sizes. The srcset attribute gives the browser a list of possible sources for one image, and sizes tells it how large the image will appear, so it can pick the most suitable file. The <picture> element is for the cases where you want control, such as different aspect ratios or formats. A phone should not download a photograph made for a desktop display.
• Compress and optimize. Google’s guidance says images are often the largest part of a page’s weight and should be optimized so that pages still load quickly. Google Search supports BMP, GIF, JPEG, PNG, WebP, SVG and AVIF; check that the file extension matches the file type.
• Do not lazy-load what is on screen. Adding loading="lazy" defers an image until it nears the viewport, which suits a long gallery. The advice is not to lazy-load images likely to be in view when the page loads, especially the largest one, because the browser cannot defer an image until it knows where it sits on the page.
• Give every image a width and a height. Without them the image has no reserved space and the page shifts as it arrives.
• Aim at the Largest Contentful Paint. The target is 2.5 seconds or less at the 75th percentile of page loads, segmented by mobile and desktop; 2.5 to 4.0 seconds needs improvement, and over 4.0 is poor¹. On a studio’s home page the largest element is nearly always the first photograph, which is why it is the one that must not be lazy-loaded.
• Name and describe the files. Short descriptive file names and descriptive alt text help the image be understood; Google calls alt text the most important metadata. “Cedar pergola over a terraced garden, Altadena” is better than “IMG_4471.”

Good to know Test the home page on a phone on mobile data before you decide it is fast enough. Google’s thresholds are measured on real visits, not on your office connection.

The inquiry, without a form

A form asks a prospective client to describe a project in a box. Many will not. We suggest the plainer route: an email address and a phone number, on every page, with a short line about what to send. “Tell us the address, the size of the space, what is not working, and a rough budget range. A few phone photographs help.” A mailto link with that text pre-filled costs nothing and gives you the information you need to say yes or no. If you prefer a form, keep it to name, email, city and a message, and say what happens next and when.

This is our practice and not a rule. If you do use a form, tell visitors who sees it and what you do with the details.

Press

List the publications, the date and a link, and only what is real. A press page is a list of titles and links, not a logo wall; a logo without a link cannot be checked. If you have no press, leave the page out.

The people page

Clients hire a person. Photograph, name, role, a paragraph in the first person about how you came to the work. If your studio installs landscaping in California, the Contractors State License Board requires the license number in all forms of advertising, and its guide counts any website that solicits business on the Internet. If you design only, check with a licensed professional whether any of the title rules for your profession apply to the words on your page; this page says nothing about them.

What we do about it

A studio site is the clearest case for a theme written for it, with no page builder, because the photographs are the page. We write ours ourselves. Client sites have run seven to ten years, and Australian clients since 2014; the garden designer’s portfolio since 2017 and an interior studio’s site since 2015 are among them. If your site is slow because of the photographs, the fix is often sizing and loading, not a new design.

When to get help

If your portfolio takes more than a few seconds to open on a phone, ask for help with the images first. If you are planning a new site, the order is the photographs, the one line, the project pages, then everything else. The consultation is free.

Frequently Asked Questions

What should a landscape design website show first?

A strong photograph of a finished project with a caption that names the place and the work, then the other projects.

How large should portfolio images be?

Serve different sizes with srcset or <picture> and compress the files; Google notes that images are often the largest part of the page’s weight.

Should I lazy-load my portfolio images?

Lazy-load the gallery below the first screen, not the images likely to be in view when the page loads, especially the largest one.

Do I need a contact form?

No. An email address, a phone number and a line about what to send work for many studios. We suggest that route and offer a short form if you prefer one.

Does a design studio need a contractor license number on its website?

If it installs landscaping in California, the Board’s guide says the license number goes in all forms of advertising, including a website that solicits business. A studio that only designs should ask a licensed professional.

Sources