Crafting A First No-Code Webpage: A Step-by-step Guide Using Notion

By: TextSpeakPro Editorial Staff

Published: 2024-04-23

a person holding a smartphone displaying a Text to Speech app with a digital brain graphic

If you don’t need to know how to code, Notion is the place to go. It’s one of the best programs for taking notes and getting things done, and you can also use the same tools to make a landing page that tells your customers or followers where to find you. If you have yet to try it, it’s like using a regular word processor. You can make your no-code website in Notion by following this step-by-step guide.

Starting Your No-code Notion Website

Go to the bottom left corner of your screen and click on the New page. Then, click on the Empty page to start creating your webpage. Choose a title that tells people what your page is about, like the name of your business, product, or service. People need to know they’re in the right place. You can change it later if you come up with something better.

How To Add A Cover Picture To Your Notion Page

Cover photos are a great way to help people who follow or buy from you remember your page. To include one more:

  • If you move your mouse over any part of the title, the option “Add cover” will show up.

  • The notion will put a random picture at the top of your page.

  • Select Change Cover when you move your mouse over the picture.

  • In the cover menu, you can add a picture from the Notion gallery, upload your own, link to an image, or search Unsplash to find one.

  • To use one from the gallery, click on the picture, color, or gradient you want.

  • If not, go to Upload, Link, or Unsplash and follow Notion’s steps.

You can choose a picture that fits your business’s color scheme or make one using free photo editing software like Canva, even if you don’t have an image that represents your brand. From the cover menu, go back and click Remove in the upper right corner if you don’t want the picture. You can return to this later if you can’t decide what image to use.

How To Add Text And Headers To Your Notion Page

When you’re making a webpage, you often want to make it as big as possible. But think about how you usually read. There is more work to do to find the message when there is much information on one page or walls of text.

You want your page to be easy to skim and have just the correct information for people to follow you or buy something. Also, putting that information under headers makes it easier for them to find. Colors, bolding, italics, and Callout or Quote blocks can draw attention to important text. Also, if the font with Notion doesn’t work for you, you can change it.

The notion makes it easy to add text anywhere on the page. All you have to do is click and type. Before you type, you can use commands to change a block to a header. If you want to change it after you type, you can highlight the text and use the formatting toolbar to make the change.

You can pick from 1, 2, or 3 sizes. H1 is the biggest, and H3 is the smallest. The size of your heading helps show the order of the pages on your site. Since H1 is your main and most important title, you should use H2 for titles and H3 for subtitles all over the page so they don’t clash with it.

Good SEO practices also say that if you have a Personal Pro account and turn on Search engine indexing, you should use headers to organize your content and only use one H1 heading per page.

Creating Links For Your Notion Page

To add text links, select it and click on Link in the toolbar for formatting. To like an email, type mailto and then your address. This will open the composer for your potential client and put it in for them. Make sure you check it twice to make sure you spelled it right. You can join links to your social media pages, portfolio pages, or other helpful websites where people who want to work with or follow you can find you.

Adding Images And Videos To Your Notion Page

Making a website without writing code doesn’t mean it has to be simple. Using commands, you can add pictures and videos to any part of your page.

  • After pressing the forward slash (/) key on your keyboard, you can type an image or video.

  • From the block menu, choose it.

  • If you want to add an image, pick Upload, Embed Link, or Unsplash, and then follow Notion’s steps.

  • If you want to add a video, choose Embed or Upload. The notion will then show you how to do the rest.

The six-dot handle to the left of your block lets you drag and drop your picture or video anywhere on your page. It can also be put next to another block to make a column. Move your mouse over the block and use the guides on either side to change the size of the columns. Change the layout and pictures until you find what you like.

Sharing Your No-code Notion Website

Go to the top right corner of your screen, click Share, and then turn on Share to Web. This will launch your website. Don’t let people edit, comment, or copy your work if you don’t want someone to use your site as a model. Recheck your page for any links to other Notion pages that you don’t want other people to be able to see.

Suggestions For More Pages You Can Create In Notion

If you know how to use Notion to make no-code pages, here are some other pages you might want to add:

  • Portfolio

  • Product

  • Service

  • Story

  • Gallery

  • Reviews

  • News

Make sure that every page you add has a purpose, message, and current and relevant information. When creating a website, “less is more” can be used in more ways than text and pictures.

Social Media Icons by Freepik
Copyright © 2024 TextSpeakPro.com. All rights reserved.
*By clicking the affiliate link you acknowledge that we may receive a commission if you decide to make a purchase through these links.