NotionエディタとWordPressエディタを、「ブログ記事執筆用のエディタとして」比較しています。基本的にNotionびいきなのですが、改めて比較してみるとWordPressもブロックエディタに関してはなかなかの完成度をもっているなと感じました。
目次:
- NotionとWordPressのエディタ両者に共通している機能
- マークダウン記法対応
- スラッシュ(/)によるブロックの呼び出し
- 記事の自動保存機能とオフライン時の挙動
- オブジェクトの埋め込み
- 表の作成。Notionはデフォルトで様々な見た目のテーブルに対応
- NotionにあってWordPressにない機能
- アウトライナーとしてのタブキーインデント、1文単位での配置入れ替え
- アットマーク(@)による自サイト内の記事検索
- Webブックマーク形式でのオブジェクト埋め込み
- Unsplashによるシームレスな画像挿入
- OGP画像設定が不要
- WordPressにあってNotionにない機能
- 見出し4以下のタグ・H4マークダウン記法
- リンクを「新しいタブで開く」に設定する
- リンクにNoFollow属性を付与する
- 画像へのaltタグ設置
- Notionはエディタだけでなく、「書き始め」までの体験が心地よい
- ブロックエディタで可能になるライティングでのメリット
- WordPressエディタでのライティングで不満な点
- Notionが提供する心地よいライティング体験
- Notionは「データベース」とデータの取り扱いに特化。エディタを含め、データの扱いに関する体験が心地よい
NotionとWordPressのエディタ両者に共通している機能
マークダウン記法対応
WordPressのブロックエディタにおいては標準でマークダウン記法が有効になっています。
ただし、WordPressでクラシックエディタを利用している場合、「マークダウンボックス」を選択してマークダウンボックスを作成してから、その中にマークダウン記法で書いていく必要があります。
WordPress公式アプリや、MarsEdit4などサードパーティ製の投稿ツールでは、そのままの形でマークダウン記法に対応しているものもあります。
スラッシュ(/)によるブロックの呼び出し
WordPressではブロックエディタのみ対応。
記事の自動保存機能とオフライン時の挙動
Notion、WordPressともに保存ボタンを押すことなく、自動的に記事が保存されます。
ただし、WordPressのほうが保存ペースは粗く、数秒〜数十秒程度の自動保存されないタイムラグが発生する感覚です。
WordPressにおいては保存ボタンを押すことが想定されているようです。保存ボタンを押さずに記事ページを閉じようとすると、ブラウザから警告が表示されます。
WordPress : 投稿とページのリビジョン – 日本語サポート
ただし、Notionはオフライン時の挙動にやや不安があります。WordPressは接続が切れオフラインとなった際の検知がスピーディですが、Notionは分かりづらく、気づかずにしばらく作業してしまうことがままあります。
Notionはオンライン状態で利用することが前提となっています。接続が切れた状態でも一定は内容がキャッシュに保存されるとはされていますが、印象としては割とすぐに消える、という印象があります。
Notionのデータは全てオンライン上にあり、Evernoteのようにオフラインでも使えるようにする機能はありません。オフラインで使用する唯一の方法は、オフラインになる前にオンライ状態であらかじめ開いておくことです。その場合、データはローカルにキャッシュされているので、オンラインに戻った時に同期されます。
オブジェクトの埋め込み
オブジェクトの埋め込みとは、URLをペーストするだけで自動的にURL元から情報を呼び出す形で記事内にブロックを埋め込むことができる機能です。
たとえば
- YouTube動画の埋め込み表示
- Twitterのツイート埋め込み
- Instagramの投稿埋め込み
などがオブジェクトの埋め込みです。
Notion, WordPressブロックエディタともにオブジェクトの埋め込み表示に対応しています。
オブジェクトの埋め込み | WordPress.org 日本語
表の作成。Notionはデフォルトで様々な見た目のテーブルに対応
従来まではNotionで表を作成しようとすると、いかなる表テーブルもデータベースで作成する必要がありましたが、2021年11月のアップデートでシンプルなテーブルを作成することができるようになりました。
/tableコマンドから呼び出し可能です。
Notionテーブルは通常のシンプルなテーブル以外にも、様々な見た目で実装できることが特徴的。
たとえば下記のような見た目のテーブルを作成することができます。
- カラフルな評価つきテーブル
- 3カラムの価格表
- 価格と機能のグリッドテーブル
- クラスレポートのテーブル
詳細や作り方については、11 Ways To Design And Arrange Basic Tables In Notion — Red Gregory を参考にしてください。
WordPressエディタにおいてもテーブルは利用可能です。
ただし、WordPressエディタでNotionのような多機能なテーブルを用いたい場合には、別途プラグインを導入する必要があるでしょう。
NotionにあってWordPressにない機能
アウトライナーとしてのタブキーインデント、1文単位での配置入れ替え
もともとWordPressで運用していた頃、入稿前までは Roam Research というアウトライナーでメモ・アウトライン作成を行っていました。
アウトライナーに必要な機能としては下記があります。
- インデントによる文章の入れ子構造化
- インデントした箇所をトグルボタンで開閉（表示/隠すの切り替え）
- 1文単位での配置入れ替え
このうち、Notionは2つめのトグルボタンでの開閉には対応していません。したがって論文レベルの長文を書きたい、という場合には向いていないかもしれません。
が、ブログ記事程度の長さを成果物とするアウトライナーとしては十分です。
ライティングにおけるアウトライナーの重要性、アウトライナーとしてのNotionエディタの完成度については下記記事で説明しています。
WordPressもたしかにテキストを入れ替えることは可能ですが、粒度が「1文のかたまり」（パラグラフ）となっており、pタグでまとめられている箇所での入れ替えを想定されています。
クラシックエディタの場合、デフォルトがマークダウンブロックではなく通常のpブロックであることから、入れ替えたい都度にマークダウンブロックをいちいち作成するのは非常に面倒。
ブロックエディタの場合はクラシックエディタに比べると楽に文章の入れ替えが可能ですが、1行単位ではなくあくまで「1文のかたまり」で動かすことを想定されています。
また、現状ドラッグ&ドロップ動作の出来が悪く、操作していて不快に感じることが多いです。
- 文章ブロックをうまくつかめない
- ドロップ時、挿入したい箇所がうまく選択されない
と、WordPressにおける文章配置変更はあまり気持ちの良い体験ではありません。
アットマーク(@)による自サイト内の記事検索
Notionではアットマーク(@)を記述するだけでNotion内の全データベースを瞬時に検索、他記事へのリンクを設置することができます。
これはたとえばSuperやWraptasで公開した場合もaタグとして設置され、内部リンクとして有効に機能します。
対するWordPressで同様のことをしようと思うと、ブロックエディタ・クラシックエディタを問わず「リンクボタン」をクリックする必要があります。
下記はクラシックエディタで、アンカーリンクテキストを入力してからリンクを貼る動作を行う場合。
細かいポイントではありますが、記事が増えてくると自分の記事を検索して内部リンクを貼りたい、という要求は大きくなってくるはずです。
内部リンク設置はSEOの観点からも非常に重要であり、Notionでは設置動作をキーボードから手を離さず快適にできるというのは大きなポイント。
Webブックマーク形式でのオブジェクト埋め込み
WordPressでもオブジェクト埋め込みが可能なことは前述しましたが、Notionでは通常の記事ページへのリンクを設置する際、URLをペーストするだけで「Webブックマーク」というリッチ形式での表示が可能です。
たとえば、私のWordPressブログ「魔法使いの道具箱」の記事をwebブックマークで表示させると下記のようになります。
左側にmeta情報、右側にOGP設定した画像が表示されるというリッチ形式ですね。
Unsplashによるシームレスな画像挿入
WordPressでもプラグインで実現可能？要調査
OGP画像設定が不要
Super.so を利用してNotionをWebサイトとして公開する場合では、記事ページ内ではじめて登場した画像がOGPとして自動的に設定されます。
ただし、記事後半になるとあまり認識されない場合も。
最初に登場するh1またはh2内に設置するようにすれば、問題なく認識されます。
参考: NotionをWebサイトとして公開する方法 : SuperとWraptas（Anotion）
WordPressにあってNotionにない機能
見出し4以下のタグ・H4マークダウン記法
Notionで設定できるのはマークダウン記法かどうかを問わず、H3までです。
Webで公開することを前提とした場合、H4まで欲しいなと思うこともしばしば。
リンクを「新しいタブで開く」に設定する
WordPressブロックエディタであれば、トグルボタンをONにするだけで設定可能です。
リンクにNoFollow属性を付与する
同様。
画像へのaltタグ設置
Notionで画像にキャプションをつけることは可能ですが、altタグを設定する等はできなさそうです。
Notionはエディタだけでなく、「書き始め」までの体験が心地よい
今回はあくまでエディタに関してのみで比較をいたしました。 もっとWordPressを「こき下ろす」つもりだったのですが、こう比較してみると機能としては意外とそこまで大きな差はないように感じます。
これは私が普段利用していたのがクラシックエディタであり、ブロックエディタだと下記のメリットが生じることを知らなかったためでした。
ブロックエディタで可能になるライティングでのメリット
- デフォルト状態でマークダウン記法に対応
- （デフォルトでマークダウン記法に対応しているので）マークダウンで記述したブロックの配置変更が可能
WordPressで利用しているテーマによってはブロックエディタ適用が不可のテーマとなることがあり、私はブロックエディタが利用できないというパターンでした…！
しかしブロックエディタを適用させたとしても、WordPressにおける下記の不備はライティング体験の観点からすると非常に大きな差に感じます。
WordPressエディタでのライティングで不満な点
- インデントができない
- 一文を入れ替えたいときに、ブロック配置変更の挙動がストレスフル
- 自サイト内記事の検索がやや面倒
私は上記をストレスに感じ、WordPressでのライティング体験が嫌になりました。上記の点はNotionでは一切感じることがなく、ストレスフリーなライティングを体験できています。
またエディタそのもの以外に、Notionは下記の点においてWordPressより優れたライティング体験を提供しています。
Notionが提供する心地よいライティング体験
- ログイン状態をしばらく保持
- 原則、手動ログアウトするかアプリをアップデートするまでログイン維持
- WordPressも公式アプリやサードパーティツールを利用すればログイン状態を維持できる
- 非常に軽快な動作でサクサク動く
- iOS, Google Playなどでのネイティブアプリでも同様のサクサク高速体験
- シンプルなUIによって、該当の記事まですぐたどりつくことが可能
- 全文検索と部分検索を組み合わせて記事を探すこともできる
このように、Notionはエディタの便利さのみならず全体的なライティング体験・UXとしても快適なのです。
NotionをWebサイト・ブログとして公開する4つのメリット。最高のライティング体験と高速表示
Notionは「データベース」とデータの取り扱いに特化。エディタを含め、データの扱いに関する体験が心地よい
このような差が生じている背景として、NotionがいわばヘッドレスCMSのような形で「データの取り扱いとその中身」のみに注目していることに対し、WordPressは「Webサイト」全体から出発している設計思想の違いから差が生じているように思いました。
Webサイト全体としての完成度を求める上で記事コンテンツを作っていくならWordPress, 中身のコンテンツに最適化した形でライティングを進めたいならNotion, という分け方ができるかもしれません。
ただ、昨今のWebフロントエンドの流れからするとフロントとバックエンドを切り離し、疎結合の形でコンテンツを届けていく「ヘッドレスCMS」の流れとなってきています。
本サイトでもヘッドレスCMSをNotion, フロント管理を Super としてCMSとフロントを分離させるヘッドレスCMSの構成をとっています。
他にも Notion-blog-nextjs など、Next.jsをベースとしたオープンソースのライブラリも出てきています。
WordPressは基本的にフロントとコンテンツ管理が一体となっているため、ライティングにおいても執筆作業と関係ない設定を行う必要が多く生じてくるのだと思います。
その差が、WordPressとNotionのライティング体験の差としても現れてきているように感じました。
エディタ以外にも、Notionは検索が非常に高速かつ全文検索が可能です。WordPressの標準データベース内検索機能は非常に貧弱かつ遅く、満足な検索結果が得られない印象があります。
これは例えば「関連記事」として記事内にリンクを設置したい際の体験に影響します。
心地よいライティング体験を手に入れたい方、メモ・アウトライナーから発信コンテンツに昇華させたいのになかなか公開まで漕ぎ着けられずに止まってしまっている方。ぜひNotionでメディア運用をはじめてみてはいかがですか。
この記事の気になった箇所を読み返す:
- NotionとWordPressのエディタ両者に共通している機能
- マークダウン記法対応
- スラッシュ(/)によるブロックの呼び出し
- 記事の自動保存機能とオフライン時の挙動
- オブジェクトの埋め込み
- 表の作成。Notionはデフォルトで様々な見た目のテーブルに対応
- NotionにあってWordPressにない機能
- アウトライナーとしてのタブキーインデント、1文単位での配置入れ替え
- アットマーク(@)による自サイト内の記事検索
- Webブックマーク形式でのオブジェクト埋め込み
- Unsplashによるシームレスな画像挿入
- OGP画像設定が不要
- WordPressにあってNotionにない機能
- 見出し4以下のタグ・H4マークダウン記法
- リンクを「新しいタブで開く」に設定する
- リンクにNoFollow属性を付与する
- 画像へのaltタグ設置
- Notionはエディタだけでなく、「書き始め」までの体験が心地よい
- ブロックエディタで可能になるライティングでのメリット
- WordPressエディタでのライティングで不満な点
- Notionが提供する心地よいライティング体験
- Notionは「データベース」とデータの取り扱いに特化。エディタを含め、データの扱いに関する体験が心地よい
Category: Notion
