# Titles

## Overview

The Title content block lets you implement header tags, creating a structured hierarchy within your design. This is beneficial for both web accessibility and SEO, without the need for custom HTML.<br>

<figure><img src="https://lh7-eu.googleusercontent.com/YcC_ggCJvxrmWnOmQ7ocWhBEulcPc9RWB1IdV1MX33KwpJsQzo5Crf_nk0hOuEjXi7oaO90BTFhTTbmp9v-_MdKtKveJquz0Us00BrEGMXrnAQ_lB_ietM6v0FHePPhTwn5G0-r2AzwmmTY-5ZsAXII" alt="" width="375"><figcaption></figcaption></figure>

## Using Titles

With the Title content block, you can easily insert H1, H2, and H3 tags. This assists in making your content accessible and improves your landing page's SEO.

<figure><img src="https://lh7-eu.googleusercontent.com/uLXVLElcQPWKDqaJbt6FjcYRzUbOKUg2YxOAGWUw4b4WNsTNqJSgKYtLl-yl3HaVEOEzeeaGJpUur_iXPkUGv6lWz4Kentvro6Pex_4Q2NtAeSOtr3J2RM6ObGJes-rgw7i1OzkMLO0RgZkJvu79Ke0" alt=""><figcaption></figcaption></figure>

## How it Works

1. Finding the Block: The title block is located in the sidebar of the builder.
2. Drag-and-Drop: Drag the Title content block onto the builder stage. A toolbar similar to that of the Paragraph content block will become available.

## Use Cases

* Accessibility: Title content blocks enable screen readers to navigate and interpret your content correctly.
* SEO: Headers play a significant role in SEO, as search engines prioritize header content when scanning for keywords and generating search results.

## Accessibility Keys for Title Content Blocks

This section outlines and describes the accessibility keys currently available for navigating the Title content block. In this section, you'll learn about which keys to use to set your focus, customize properties, exit your design, and save your changes.

{% hint style="warning" %}
We are still working on developing our application's accessibility, and you may notice that some actions aren't available yet. Additional accessibility features are coming soon.&#x20;
{% endhint %}

### **Setting Your Focus**

Take the following steps to set your focus:

1. **Locate the Title Block:** Use `ArrowUp` or `ArrowDown` to navigate through the builder and locate the Title content block in the sidebar. A high-contrast border will indicate active focus in accessibility mode.
2. **Activate the Title Block:** Press `Enter` to select the highlighted Title block, activating it for insertion onto the builder stage.
3. **Place the Title Block:** Once activated, use `ArrowUp` and `ArrowDown` to correctly position the Title block within your page layout. Press `Enter` to drop the Title block into the desired location.

### **Editing and Customization**

Take the following steps to edit headers and navigate through properties:

1. **Edit Headers:**
   * With the Title block placed, hit `Enter` to edit the text within the header tags directly. This enables quick input of your desired header content.
   * Use `Backspace` to delete existing text and `Enter` to add new headers.
2. **Navigate Through Properties:**
   * Use `Tab` to navigate through various sidebar properties associated with the Title block, adjusting aspects like font size, style, and alignment to optimize readability and SEO impact. To navigate the properties in reverse order, use `Shift + Tab`. This allows you to adjust settings directly from the keyboard.

### **Exiting and Saving Changes**

Use the following key to exit and save your changes.

* Press `Esc` to exit the editing mode of the Title block. This command also deselects the block, saving any changes made.

### Avoid Double Bolding on Windows

The **Title**, **Paragraph**, and **List** modules let you apply bold in two ways:

* Selecting **Bold** as the font weight in the sidebar
* Using the **Bold** button in the text toolbar on the stage

On **Windows**, combining both results in overly bold text. On **macOS**, it remains visually unchanged.

To ensure consistency across platforms, use only **one** method to apply bold formatting.