10
10 Comments

Why we rebuilt our website entirely in Notion

As a service enabling others to build websites with Notion, it didn't feel right that our own website wasn't built with it, so we decided to put out product where our mouth is, and rebuild our site using nothing but Notion and a some custom styles.

If you want to skip on the details and have a look: https://super.so

Over the last few months, we've seen a few posts cautioning the use of using Notion as a website. I'll be covering how using Super to create your Notion website solves all of these. There are typically three main points against doing this, all of which are legitimate concerns.

  1. Performance (page speeds)
  2. Security (URL hijacking)
  3. Discoverability (SEO)

Performance

Firstly, and most importantly, is performance. There's lots going on within your Notion pages, things like 3rd party scripts, unoptimized assets and images, and lots more that are all contributing to slow page speeds and loading times. With Super, we transform your Notion pages into static sites served from a CDN. Unlike the dynamic pages on notion.so, which make one request to load the page and a few more to load the data, our static sites serve the page with all its data in the first request. This makes all Super sites (that are using our static method) load near instantly. We're committed to doing our part to make a better and faster web, which is why our static sites don't have any external scripts to run on page load (analytics, trackers, etc.) other that what you decide to add, and assets like images and fonts are optimized for maximum performance.

Lighthouse scores from our default Notion page:

Lighthouse scores from that same page hosted on Super:

Security

Before we had static sites, we used proxy sites like Fruition or Hostnotion. Apart from the terrible performance of these sites, there are pretty concerning security flaws. Any public Notion page could be loaded on these proxy sites regardless of the page owner. This opens up issues like phishing attacks and Google indexing pages on your site which you don't own. Our static sites provide a solution to this problem by only allowing pages that belong to your site to load on your site, naturally. Since we generate the page ourselves, we have the ability to fix common security issues like these to provide people with the security they expect from a modern website.

Discoverability

Another issue with proxy sites is that pages that shouldn't be pages are indexed! Any Notion block from text block to a callout block to an image can be viewed as its own page. Even if you don't link to these blocks as pages, Google's crawler does. This create a lot of search engine pollution and can give people a bad impression of your site when searching for it on Google. Our static sites fix this issue by returning a 404 on any page which is not actually a page. Since search engines tend to favor fast, statically-generated websites, SEO scores on static Super sites should be near perfect. If you're using our pretty URL feature for your child pages, we'll even generate a sitemap for your site, so it looks and performs great on search engines.

Aside from all of the above, there's some pretty interesting things we allow you to do with your Notion sites:

Let me know if I can answer anything else! Feel free to browse our Templates, Guides, Showcase, and join us on Twitter for updates.

posted to Icon for group Notion
Notion
on December 10, 2020
  1. 1

    Sorry @traf I clicked the Super.so site and found my answer.
    I'll see if I can learn it via the awesome guides.

  2. 1

    Non Techie here.
    So I have a few website ideas I want to make around curricula and also my photography website/portfolio:
    To move it to Notion or Wordpress (Elementor).

    Do you have a step by step guide to make a Portfolio website/agency/consulting etc via Notion using Super?
    Thanks @traf

  3. 1

    is there a way I can add JS to manipulate DOM ?

    1. 1

      Definitely. We have a full code editor with live previews.

  4. 1

    This is amazing!

    I’ve a few naive questions - I noticed you’ve a navbar and some nice UI card features, are these components powered by Super?

    Thanks @traf

    1. 1

      Hey @felix12777! The navbar is a custom html element integrated using our code injection feature. We'll actually be releasing navigation bars as a theming feature soon. The other UI card elements are Notion's default gallery + bookmark blocks, styled with a bit of custom CSS.

      1. 1

        Oh cool! The nav bar will be a critical feature. Thanks for doing this. Excited to join Super!

  5. 1

    I like what you've done there. Is this sort of template coming soon?

Trending on Indie Hackers
How I Closed My First SaaS Client Without Writing a Single Line of Code User Avatar 13 comments Why Building in Public Changed My SaaS Journey Forever User Avatar 13 comments Meme marketing for startups 🔥 User Avatar 12 comments From $0 to $10k MRR: My Indie Hacker Journey – Part 1 User Avatar 6 comments From $0 to $10k MRR: My Indie Hacker Journey – Part 2 User Avatar 5 comments Protect your momentum like your life depends on It User Avatar 5 comments