Webサイトビルダーマップを作ってみた

⚠この記事が公開されたのは 2022年9月21日で、内容が古く、間違っている可能性があります。

WordPressの流行の後、最近はビジュアルエディターやJavascriptフレームワークなど様々なツールやサービスが増えてきました。

製作者のスキルや目的によってなにを使うべきか分かれると思ったのでわかりやすくポジションマップにしてみました。

CMS

いわずと知れたWordpressで有名になったCMS(Contents Management System)です。

サーバーサイドはPHPであることが多く、データベースを伴うことがほとんどです。

この点で開発コストや仕組みの複雑さを嫌い、利用者はノーコードへ、開発者はJamstackへとCMSを離脱しての2極化がすすんでいるとみています。

WordPressもこれを見逃さずにFSE(フルサイトエディタ)を導入することで改善しようとしています。

Shoppifyは正確にはEC向けのCMSですが、海外の人気は高く利用者は多いので掲載しています。

MovableTypeやJoomlaはCMSでもレガシーの部類です。

ノーコード

ビジュアルエディタと言い換えても差し支えはないです。

既存のテンプレートを使用して制限のある範囲でコンテンツを入力していきますが、高機能なものはレイアウトやフォントなどデザインも細かく変更できるもの増えてきました。

WixやJIMDOの人気は依然高いですが、最近はSquarespace、webflowも人気のようです。

STUDIOは国産ということもあり日本国内の人気が高いです。

WordPressもFSE(フルサイトエディタ)対応テーマであれば同様の構築が可能です。

Jamstack

本来はJavascript + API + MarkupでNext.jsなどのJavascriptフレームワークを直接指しません。(APIを使わない場合もあるようです)

Next.jsやNuxt.jsなどのJavascriptフレームワークはSSR(Server Side Rendering)やSPA(Single Page Application)、制的サイトジェネレーター(Static Site Generator)など柔軟な開発が可能です。

ヘッドレスCMS

Jamstackの中の一手法としてヘッドレスCMSがあります。

フロントエンドが存在しないコンテンツ配信システムなのでそう呼ばれます。

フロントエンドとCMSが独立しているのでバックエンドを気にせず運用・開発コストを削減できます。

レガシー

DreamweaverはエディタではなくIDEと呼ばれる統合開発環境の一種です。

インターネット黎明期はコードはエディタを使用して直接タイピングし、FTPクライアントでファイルをアップロードすることでWebサイトを構築していました。

CMSが登場した今ではこの方法は効率が悪く、今では縮小傾向です。