How To Successfully Hand Off Websites To Your Clients
Learn how to structure your project workflow on Tilda to build long-term client relationships
Being a designer isn't just about creating stunning visuals or intuitive interfaces. It's also about technical know-how, attention to detail, and truly caring about your clients. One of the most important stages in a project is the handoff—making sure the client can confidently manage their website without constantly relying on you for support.
Contents:
What a Website Handoff Really Means
A typical website project goes through several stages: Concepting, prototyping, design, development, testing, and finally, the handoff. Designers often build a website in their own Tilda account and only transfer it to the client once everything is ready. But the handoff doesn't start at the final stage; it begins way earlier. Every decision you make should lead toward one goal: A fully functional website that the client can run on their own.
This includes making sure everything works properly (forms, animations, shopping carts), SEO settings are in place, and the client has all the instructions they need. A proper handoff gives them confidence to update content—like blog posts, schedules, or pricing—without fear of breaking anything.
This includes making sure everything works properly (forms, animations, shopping carts), SEO settings are in place, and the client has all the instructions they need. A proper handoff gives them confidence to update content—like blog posts, schedules, or pricing—without fear of breaking anything.
Why It Pays To Think Ahead
Sure, a designer could just build the website and move on. But putting in a little extra care can go a long way—both for your client relationship and your reputation.
Builds trust
Clients love working with people who think one step ahead. A well-organized website, clearly labeled pages, and thoughtful instructions show that you're a pro who respects their time (and your own). That kind of approach leaves a lasting impression: They're more likely to come back or refer you to others.
Prevents future headaches
Simple guidance and on-page comments help your client avoid mistakes and manage the website confidently. That means fewer panicked messages and rushed fixes.
Promotes your work
Even after the project ends, your design keeps speaking for you. The longer the website stays well-maintained and consistent, the better it reflects your skills. A once-gorgeous portfolio project loses value if future clients see it in disarray.
Clients love working with people who think one step ahead. A well-organized website, clearly labeled pages, and thoughtful instructions show that you're a pro who respects their time (and your own). That kind of approach leaves a lasting impression: They're more likely to come back or refer you to others.
Prevents future headaches
Simple guidance and on-page comments help your client avoid mistakes and manage the website confidently. That means fewer panicked messages and rushed fixes.
Promotes your work
Even after the project ends, your design keeps speaking for you. The longer the website stays well-maintained and consistent, the better it reflects your skills. A once-gorgeous portfolio project loses value if future clients see it in disarray.
How To Structure Your Project So It's Easy For The Client To Use
1
Turn off indexing and set up a temporary domain
The first thing to do after creating a new project on Tilda is to prevent it from being indexed by search engines. Why? Because without proper SEO settings or a custom favicon, your client might see their website show up in search results with the wrong page title, a generic description, and Tilda's logo instead of their own. If a website gets indexed prematurely, updating the metadata can take days or even weeks.
How to do it: Site Settings → SEO → Prevent search engines from indexing this website.
The first thing to do after creating a new project on Tilda is to prevent it from being indexed by search engines. Why? Because without proper SEO settings or a custom favicon, your client might see their website show up in search results with the wrong page title, a generic description, and Tilda's logo instead of their own. If a website gets indexed prematurely, updating the metadata can take days or even weeks.
How to do it: Site Settings → SEO → Prevent search engines from indexing this website.
2
Create a clear temporary domain
During the design process, you'll probably send your client preview links to get feedback. To avoid confusion, update the default auto-generated domain to something clear and recognizable. For example, instead of site-3949584.tilda.ws, go with something like greenstudio.tilda.ws.
How to do it: Site Settings → Main Settings → Custom Subdomain On Tilda.
During the design process, you'll probably send your client preview links to get feedback. To avoid confusion, update the default auto-generated domain to something clear and recognizable. For example, instead of site-3949584.tilda.ws, go with something like greenstudio.tilda.ws.
How to do it: Site Settings → Main Settings → Custom Subdomain On Tilda.
3
Add custom fonts and set up typography
Before using a font in a project—especially a commercial one—always make sure it's properly licensed. Using unlicensed fonts can lead to legal trouble for your client, from payment demands to cease-and-desist letters.
Before using a font in a project—especially a commercial one—always make sure it's properly licensed. Using unlicensed fonts can lead to legal trouble for your client, from payment demands to cease-and-desist letters.
Tilda Sans is a free font family available to all Tilda users, suitable for both personal and commercial projects. It comes in 7 weights—from Light to Black—and supports 134 languages.
Set global font settings for your website. The parameters you set will be automatically applied to all blocks and pages, helping you keep the website visually consistent. This is especially useful for elements like product cards, where text styling can't be adjusted manually.
How to do it: Site Settings → Fonts and Colors.
How to do it: Site Settings → Fonts and Colors.
4
Keep things organized in the dashboard
To help your client easily navigate the website structure, use Tilda's built-in organization tools—folders, comments, and labels.
Folders are great for grouping related pages. For example, all pages related to a product catalog can go into a "Catalog" folder.
How to do it: Page Settings → Additional → Create new folder.
Pro tip: Create an "Archive" folder for drafts or pages your client decides not to use (at least for now). Mark it as an archive folder in the settings so these pages don't get published. That way, if the client changes their mind, you can easily bring them back.
Say you built a page with reviews, but the client wasn't ready to publish it. If they come back later wanting to add reviews, just pull the page out of the archive and publish it with a click.
Page comments make it easier to identify what each page is for. For instance, if a page is titled "Reach Out 24/7" but it's actually a contact form, add a comment like "Contact Page" to make it clear. Comments are only visible in the Dashboard.
Labels act as tags for pages. You can group pages like "About Us," "Reviews," and "Contacts" under a label called "Company Info." Clicking a label shows all the pages with that tag—super helpful when working on large websites.
If you're working on a large multi-page website with hundreds of pages, it's important to create a clear labeling system so your client can navigate the pages easily. Be sure to include a short guide that explains the grouping logic behind the labels—whether it's by section, user journey, content type, or something else—so the structure makes sense even without your direct help.
To help your client easily navigate the website structure, use Tilda's built-in organization tools—folders, comments, and labels.
Folders are great for grouping related pages. For example, all pages related to a product catalog can go into a "Catalog" folder.
How to do it: Page Settings → Additional → Create new folder.
Pro tip: Create an "Archive" folder for drafts or pages your client decides not to use (at least for now). Mark it as an archive folder in the settings so these pages don't get published. That way, if the client changes their mind, you can easily bring them back.
Say you built a page with reviews, but the client wasn't ready to publish it. If they come back later wanting to add reviews, just pull the page out of the archive and publish it with a click.
Page comments make it easier to identify what each page is for. For instance, if a page is titled "Reach Out 24/7" but it's actually a contact form, add a comment like "Contact Page" to make it clear. Comments are only visible in the Dashboard.
Labels act as tags for pages. You can group pages like "About Us," "Reviews," and "Contacts" under a label called "Company Info." Clicking a label shows all the pages with that tag—super helpful when working on large websites.
If you're working on a large multi-page website with hundreds of pages, it's important to create a clear labeling system so your client can navigate the pages easily. Be sure to include a short guide that explains the grouping logic behind the labels—whether it's by section, user journey, content type, or something else—so the structure makes sense even without your direct help.
Did you know?
On Tilda, there's a built-in note-taking tool Tilda Docs that you can use to easily create and organize project documentation as part of your website handoff.
To set a label, go to the Page Settings → Additional → Comment For Page / Label.
5
Use alias blocks for repeating content
Once the website is live, the client might want to update recurring elements, like a contact form or a class schedule. Make it easy for them by using Alias blocks for repeated sections.
An Alias block is a mirrored copy of an original block. When you update the original, the changes appear everywhere the alias is used after you re-publish the website. This makes it easy to keep things up to date without editing every page manually.
Alias blocks also help maintain consistency across the website and reduce the risk of layout issues during content updates.
How to do it: Block Library → Other → Alias Block (T213).
Once the website is live, the client might want to update recurring elements, like a contact form or a class schedule. Make it easy for them by using Alias blocks for repeated sections.
An Alias block is a mirrored copy of an original block. When you update the original, the changes appear everywhere the alias is used after you re-publish the website. This makes it easy to keep things up to date without editing every page manually.
Alias blocks also help maintain consistency across the website and reduce the risk of layout issues during content updates.
How to do it: Block Library → Other → Alias Block (T213).
6
Upload a Favicon
Don't skip the favicon—it's a small but powerful detail that makes your website instantly recognizable. Favicons show up in browser tabs, bookmarks, and search results, helping users quickly spot your website. Without one, the website looks unfinished and easily gets lost among open tabs.
Also, keep in mind: Many users browse in dark mode or on mobile. You can upload different versions of your favicon to make sure it looks great on any background.
How to do it: Site Settings → SEO → Favicons → Manage.
Don't skip the favicon—it's a small but powerful detail that makes your website instantly recognizable. Favicons show up in browser tabs, bookmarks, and search results, helping users quickly spot your website. Without one, the website looks unfinished and easily gets lost among open tabs.
Also, keep in mind: Many users browse in dark mode or on mobile. You can upload different versions of your favicon to make sure it looks great on any background.
How to do it: Site Settings → SEO → Favicons → Manage.
7
Set a default background color
On Tilda, the default background on the editor canvas is white, but that's not automatically applied to the live website. If you don't assign a default background color, blocks may appear transparent on certain devices or in dark mode. Clients don't know this, and if they add new blocks later, it could break the visual consistency of the website. Setting a default background color ensures design consistency and prevents these kinds of visual errors.
How to do it: Site Settings → Fonts and Colors.
On Tilda, the default background on the editor canvas is white, but that's not automatically applied to the live website. If you don't assign a default background color, blocks may appear transparent on certain devices or in dark mode. Clients don't know this, and if they add new blocks later, it could break the visual consistency of the website. Setting a default background color ensures design consistency and prevents these kinds of visual errors.
How to do it: Site Settings → Fonts and Colors.
8
Add badges
A badge, which is often also referred to as an Open Graph image, defines how your link appears when shared on messaging apps or social media. Without them, the platform might pull in a random image or snippet of text, which often looks messy and confusing.
These badges are set per page, not for the entire website, so don't forget to add them across all key pages.
How to do it: Page Settings → Badge.
A badge, which is often also referred to as an Open Graph image, defines how your link appears when shared on messaging apps or social media. Without them, the platform might pull in a random image or snippet of text, which often looks messy and confusing.
These badges are set per page, not for the entire website, so don't forget to add them across all key pages.
How to do it: Page Settings → Badge.
9
Test all forms
Connect your forms to a data collection service—like email, Google Sheets, or a CRM—and make sure everything works properly. Double-check that form submissions go through and show your client what the submitted messages will look like. This way, they'll know exactly where to look for new inquiries and won't miss any important messages.
Tips:
Connect your forms to a data collection service—like email, Google Sheets, or a CRM—and make sure everything works properly. Double-check that form submissions go through and show your client what the submitted messages will look like. This way, they'll know exactly where to look for new inquiries and won't miss any important messages.
Tips:
- Submit a test form and ask the client to confirm they received it.
- For eCommerce websites, set up order confirmation emails so customers receive purchase details.
- Add a custom success message or redirect to a "Thank You" page after form submission.
10
Set up basic SEO settings
Once the design is complete, it's time to fine-tune your SEO settings. This helps the website appear in search results faster and more accurately. At a minimum, configure: Title and Description for every page.
The Title is what shows up in browser tabs and search engine results. It should be unique, relevant, and include your main keywords. The Description complements the title and gives a summary of the page content.
If you skip meta tags, it will be harder for the website to rank well in search engines.
Once the design is complete, it's time to fine-tune your SEO settings. This helps the website appear in search results faster and more accurately. At a minimum, configure: Title and Description for every page.
The Title is what shows up in browser tabs and search engine results. It should be unique, relevant, and include your main keywords. The Description complements the title and gives a summary of the page content.
If you skip meta tags, it will be harder for the website to rank well in search engines.
Image tags
Alt tag is the text that describes an image. It appears when an image fails to load and helps users understand what was supposed to be shown. Alt text also boosts SEO—if you include keywords, the image may appear in image search results.
Title tag is a tooltip that shows when a user hovers over the image. It's useful when an image needs extra explanation.
Image tags improve SEO and make your website more accessible for users with visual impairments.
Alt tag is the text that describes an image. It appears when an image fails to load and helps users understand what was supposed to be shown. Alt text also boosts SEO—if you include keywords, the image may appear in image search results.
Title tag is a tooltip that shows when a user hovers over the image. It's useful when an image needs extra explanation.
Image tags improve SEO and make your website more accessible for users with visual impairments.
H1 and H2 headings
These tags help structure your content by importance. H1 title is the main heading of a page—it highlights the most important information. You should only use one H1 tag per page. H2 title is a subheading that supports the H1, and organizes the page content into readable sections. Search engines use headings to understand the hierarchy of your content and how well it matches user search queries.
For example, on this page, the H1 is "How To Successfully Hand Off Websites To Your Clients", and the H2s are the section titles like "What a Website Handoff Really Means" and "Why It Pays To Think Ahead".
These tags help structure your content by importance. H1 title is the main heading of a page—it highlights the most important information. You should only use one H1 tag per page. H2 title is a subheading that supports the H1, and organizes the page content into readable sections. Search engines use headings to understand the hierarchy of your content and how well it matches user search queries.
For example, on this page, the H1 is "How To Successfully Hand Off Websites To Your Clients", and the H2s are the section titles like "What a Website Handoff Really Means" and "Why It Pays To Think Ahead".
How to set heading tags: Block's Settings → SEO: Title Tag.
Don't forget to enable indexing once the website is ready for launch.
Don't forget to enable indexing once the website is ready for launch.
11
Test across devices
Your website may look and behave differently across devices. Make sure it works well on various screen sizes. Use emulators to test different breakpoints or, better yet, check it on real devices whenever possible.
Ensure buttons are clickable, text is readable, and nothing breaks in layout or navigation.
Your website may look and behave differently across devices. Make sure it works well on various screen sizes. Use emulators to test different breakpoints or, better yet, check it on real devices whenever possible.
Ensure buttons are clickable, text is readable, and nothing breaks in layout or navigation.
12
Transfer the project to the client's account
You can only transfer a project to a paid Tilda account. Projects cannot be moved to Free plans, so make sure your client has an active subscription before starting the transfer.
How to do it: Site Settings → Actions → Transfer website.
You can only transfer a project to a paid Tilda account. Projects cannot be moved to Free plans, so make sure your client has an active subscription before starting the transfer.
How to do it: Site Settings → Actions → Transfer website.
Once transferred, log in to the client's account and accept the project. Then, connect Tilda CRM within their account—it's linked to the user account, not the project.
Even if your client only wants to receive form submissions via email, Tilda CRM is a great backup. It stores all incoming leads, helps with future email campaigns, and ensures no request gets lost.
How to do it: Site Settings → Forms → Tilda CRM.
Even if your client only wants to receive form submissions via email, Tilda CRM is a great backup. It stores all incoming leads, helps with future email campaigns, and ensures no request gets lost.
How to do it: Site Settings → Forms → Tilda CRM.
13
Record video tutorials
Create short video tutorials to walk your client through how to manage their website—how to change content, update product info, or tweak text blocks. This makes onboarding easier, reduces errors, and saves you time answering repeated questions.
Tips:
Create short video tutorials to walk your client through how to manage their website—how to change content, update product info, or tweak text blocks. This makes onboarding easier, reduces errors, and saves you time answering repeated questions.
Tips:
- Keep videos short and focused, e.g., "How To Change Text" or "How To Add a Product."
- Use tools like OBS Studio or Loom for screen recording.
- If the client has multiple admins, create a hidden page with all the videos in one place.
More Expert Tips On Website Handoff
Work in your own account
Even if the client already has a Tilda account, start the project in yours. It keeps the workflow clean and secure, and prevents clients from editing the project mid-development or copying it.
Even if the client already has a Tilda account, start the project in yours. It keeps the workflow clean and secure, and prevents clients from editing the project mid-development or copying it.
Create a "Website Info" page
Include this in a hidden page of the project or as a public Tilda Docs page. List your contact info, who developed the site, and links to instructions. This helps clients find you if they need future support.
Include this in a hidden page of the project or as a public Tilda Docs page. List your contact info, who developed the site, and links to instructions. This helps clients find you if they need future support.
Offer ongoing support
Whether it's a one-time request or a retainer, offer to keep the website updated. Clients often don't have time to manage content themselves—and ongoing maintenance ensures the website stays current and functional.
Whether it's a one-time request or a retainer, offer to keep the website updated. Clients often don't have time to manage content themselves—and ongoing maintenance ensures the website stays current and functional.
Use the Tilda Referral program
If your client signs up using your referral link, you'll receive bonus credits. These can be used to pay for your Tilda subscription or future projects.
If your client signs up using your referral link, you'll receive bonus credits. These can be used to pay for your Tilda subscription or future projects.
If you liked the article, share it with your friends. Thank you!
Read also:
Free coursebook on how to design, set up, and run
high-conversion landing pages
high-conversion landing pages
Free practical guide to web animation with examples, techniques,
and tips on how to use them
