Carrd Tutorial for Beginners: How To Make a Carrd Website

Creating a website with Carrd.co is easy and efficient. Follow this step-by-step Carrd tutorial to learn how to build your own stunning Carrd website.

Tempeld → Build Websites & Landing Pages Faster with our Customizable Free & Premium Carrd Templates

1. Introduction to Carrd.co

Carrd Dashboard

Carrd.co is a user-friendly website builder designed for simplicity and elegance. It’s perfect for personal portfolios, landing pages, small businesses, and more.

2. Planning Your Website

Define your website’s purpose and target audience.
Plan the structure: What sections will you need?
Collect images, text, and other content before you start.

Tips for Planning Your Website

1. Define Purpose and Audience

Clearly establish the main goal of your website and identify the specific group of people who will benefit from it.

2. Plan Sections / Containers

Hero: Headline and CTA (call to action). Introduction and welcome message.
About: Personal background and design philosophy.
Benefits: Showcase with descriptions.
Services: List of offered services.
Products: Sell your physical or digital product. Accept payments with Gumraod, PayPal, and Strip.
Testimonials: Client feedback and success stories.
Contact: Contact form and contact information.
Newsletter: Add a way for people to subscribe.
Social Media: Link to all the ways people can follow you.

Wondering if Carrd is right for you? Read: Why Use Carrd? 12 Reasons I Like Building Carrd Websites

3. Getting Started

Sign Up for Carrd.co

Visit Carrd.co and sign up for an account.
Choose a subscription plan (Free or Pro).

Try Carrd Free

Carrd Pricing and Plans Explained

Get 3 free websites when you sign up for Carrd and try it out.

Basic (Free)

Carrd.co’s entry-level plan.
Perfect for getting started without cost.
Includes:
- Limited features.
- Carrd.co subdomain.
- Suitable for personal projects and simple websites.

Carrd currently has three Pro plans to choose from: Pro Lite, Pro Standard, and Pro Plus.

Carrd Pricing and Plans

Pro Lite

Price: $9/year
Affordable upgrade from the free Basic plan.
Ideal for users not needing custom domains or advanced business features.
Includes:
- Improved features over Basic plan.
- Budget-friendly option.
- Suitable for personal use.

Pro Standard

Price: $19/year
Popular mid-tier plan.
Ideal for individuals and businesses with varied needs.
Includes:
- Custom domains for branding.
- Form integration for email collection.
- Suitable for personal and small business sites.

Pro Plus

Price: $49/year
Top-tier plan for power users.
Includes all Pro Standard features, plus advanced developer tools.
Offers custom forms, advanced settings, and access to unminified sources.
Designed for users with technical expertise and specific requirements.

This is just a basic Carrd pricing summary. See all the features that are included in the paid pro plans on Carrd.co.

Choose a Template

Carrd has lots of templates for starting your project. Select one of the categories like; blank canvas, profile, landing, form, portfolio, sectioned, or custom Carrd template.

Browse Carrd’s template library.
Pick a template that aligns with your website’s purpose.
Select the template and start editing.

Choose a blank canvas if you’d rather start from scratch and design your own Carrd website.

4. Building Your Website

The builder is designed to be straightforward and simple. The main starting

The Canvas is the central focus of the Carrd interface. It provides a mostly live preview of your site under construction. Additionally, it serves as a workspace to arrange elements and access two fundamental components present on all Carrd sites:

Background: This defines the site’s backdrop, which can be customized as a solid color, gradient, image, or even a video.
Page: The container for all other elements on the site. It’s flexible in terms of position and style, offering various customization options.

Click > + Menu to add content elements to your website.

Edit design in properties panel – Add content + Menu

Edit the page elements in the properties panel.

Understanding Containers and Sections

Containers and sections are the building blocks of your website.
Common sections: Header, About, Services, Contact, Footer.

Editing Content

Text

Click on a text element to edit.
Use the text editor to modify content.
Format text using the toolbar.

Use Markdown to add more styling and functionality to text.

Images

Click on an image element to replace it.
Upload your own image or select from Carrd’s library.
Adjust the image size and alignment.

Add, edit image

Adding and Removing Sections

Click “+” to add a new section.
Choose the type of section to add.
Use the “x” icon to delete unwanted sections.

Styling Your Website

Fonts and Colors

Go to “Styles” in the top menu.
Choose fonts and set primary/secondary colors.
Customize section backgrounds and button styles.

Page and Background

Layout and style your Carrd site starting with the page and background properties.

Carrd page design background — Carrd page design and background

Click on a section.
Go to the “Background” tab.
Pick a color, image, or gradient.

Add a Container and Columns

Add columns to containers

Click “+” to add a new container.
Choose ‘Type’ and select Columns.
Add and adjust column color and spacing.

Learning and mastering the Background, Page, Containers, columns, settings, spacing and colors will be 80% of what you need to design anything you want in Carrd.

Custom CSS (Pro feature)

Access the “Advanced” tab.
Add your custom CSS for precise styling.

5. Mobile-Friendly Design

Carrd templates are mobile-responsive by default.
Preview and adjust your site for mobile devices.

Click the mobile phone icon ‘Menu’
Scroll down in the properties panel. Click Mobile ‘Manual’ to style your elements to mobile.
Click the ‘Arrows icon’ in the menu to display a longer view to make designing mobile elements consistently a little easier.

6. Setting Up Custom Domain (Pro feature)

Purchase a domain from a domain registrar.
In Carrd, go to “Publishing” and select “Use a custom domain.”
Follow the setup instructions provided by Carrd.

7. SEO Optimization

Page Titles and Descriptions

Edit the “Page Info” for each section.
Use concise, descriptive titles and meta descriptions.

Heading Structure

Use proper hierarchy: h1 for main titles, h2/h3 for subheadings.
Maintain a logical structure for accessibility and SEO.

Image Alt Text

Add descriptive alt text to images.
Describe the image purpose briefly.

Meta Tags

Access “Settings” > “SEO & Social” > “Meta Tags.”
Add meta tags for better search engine visibility.

8. Preview and Publishing

Previewing Your Website

Use the “Preview” button to see your site.
Test on different devices for responsiveness.

Publishing Your Website

Click “Publish” when you’re ready.
Choose a Carrd subdomain or connect a custom domain.

9. Tips for Effective Websites

Keep navigation simple and intuitive.
Create engaging content with clear messaging.
Include contact information for easy communication.
Use a compelling call to action (CTA).

→ Build Websites & Landing Pages Faster with our Customizable Free & Premium Carrd Templates

10. Final Thoughts

Creating a Carrd website is a straightforward process. Remember to keep refining your site over time and analyze its performance to make necessary improvements. Enjoy building your professional online presence with Carrd.co!