⚡

Notion と Super を使ってWebサイトを10分で公開する方法（導入編）

2022/03/12に公開

はじめに

最近Notionが話題ですね。
ドキュメント管理はもちろんのこと、データベース作成や連携、多様な外部サービスとの接続とサービスの自由度が高く多くの場面で使われるようになってきました。

（Google trendにおけるNotionの推移。直近での伸び率がすごいですね。）

近頃はNotionをWebサイトとして公開する企業も増えてきているようで、「ノーコードツール」としての役割も果たせそうな感じがしています。
特に採用ページやコーポレートサイトなどシンプルなページはNotionで制作されることが増えてきていそうです。

今回はNotionとNotionをWebサイト化させるSuperというツールを利用してWebサイトを20分で作成していきたいと思います。

SuperはNotionをWebサイト化させるツールです。
単にNotionをWeb上に公開するだけであれば、Notionだけでも可能ですがSuperを使うとより本格的なWebサイトとして仕上げることができます。

下記が具体的な機能となります。

- レスポンシブ対応
- 独自ドメインの当て込み
- SSL認証
- SEO強化設定(metaタグ設定,サイトマップの自動生成等)
- Notionコンテンツを静的サイトとして読み込みの速度向上
- カスタムフォントの利用
- 独自CSS設定
- GoogleAnalyticsのタグ埋め込み

SEO対応、SSL認証等本格的なWebサイトを作成する上で難しい設定に対応することが可能になっています。
特に独自CSSを当てられることから、デザインなども比較的自由に構成することが可能になっており本格的なWebサイトが作成できることがわかります。

値段は1Webサイトあたり月12ドル(約1,400円)の利用料がかかりますが、近しい機能を持つペライチのレギュラープランが月2,178円(2022/3/12現在）なので、それと比べるとさらにお安く済ませられるのではないかなと思っています。

まずはNotionで公開したいページを作ってみましょう。一旦ラフにコンテンツを作成していきます。

ある程度コンテンツができたら、Notionページを公開状態にしましょう。
ページ右上の「Share」ボタンから「Share to Web」の状態に設定します。

次にSuperに登録します。
https://app.super.so/　でアカウントを作成しましょう。
右上の「New Site+」ボタンを押すと下のポップアップが表示されます。

上に好きなWebサイト名（とりあえずなんでもいいです）を入れて、下に準備②で作成したNotionページのURLを貼りましょう。

これでもう公開状態になりました！PC、スマホ両方に対応できるサイトになっていることがわかります。

ここまででNotionとSuperでとりあえずのWebサイトを公開することができました。
ただ、これだとまだNotionをWebサイト上に公開しているのと変わりがありません。

次回はここからコンテンツ、CSSテンプレートを利用したデザインの修正などを行っていきます。