WordPress を使った制作案件の今後。オリジナルでつくるか、無料/有料テーマを使うか

(追記)前提条件

なんか意図せずはてブに載っちゃったり、議論が白熱したいる感じがありまして、言葉足らずで誤解を生むとあれなので、この記事の前提条件を追記しておきたいと思います。

  • ブロックエディターになったことで、これまでよりも開発・保守の難易度があがる。
  • これまでなんとなく WordPress を触っていた制作会社は使いやすい編集画面をつくるのが難しくなるかも。
  • それを既存のブロックプラグインで補うというのは全然アリ。
  • ブロックエディターにちゃんと追従している無料/有料テーマがちゃんとあって、それらを使うとエディターがめちゃ快適。
  • ただし、すべての無料/有料テーマがブロックエディターに対応しているというわけではもちろんなくて、エスケープすらまともにしていないようなテーマも未だにある。
  • つまり、オリジナルも無料/有料テーマもダメなものはダメで、良いものは良い。
  • この記事はあくまで「WordPress を使った制作案件」の話であって、すべての制作案件を WordPress でするべきという話ではありません。

ここから

僕は日々「Snow Monkey」でエゴサしているのですが、昨晩そこに興味深いツイートのやりとりが流れてきました。多分出発点は TAK さんのこのツイート。

そして新進気鋭の有料 WordPress テーマ SWELL の開発者、了さんが反応。

そしてこれにともすたたにぐちまことさんが反応。そしていろいろな方の意見がでてきます。

オリジナルでつくるか、無料/有料テーマを使うか

要するに、WordPress がブロックエディター(Gutenberg)時代に突入した今、これまでどおりオリジナルでテーマをつくって納品するのか、それとも無料/有料テーマをベースにカスタマイズを施して納品するのか、どちらが主流な(ベターな)選択肢になっていくのだろうかというやりとりですね。

僕は今はほぼ Snow Monkey 専業ですが、それまではバリバリの WordPress 受託開発者でした(「WordPress を使ってサイトをつくって納品する」というよりも「WordPress のテーマをつくって納品する」「WordPress のプラグインをつくって納品する」という感じが多かったので、一般的な Web 制作者の皆さんとはちょっと違うかもしれませんが…)。

そのときはまだブロックエディターではなくクラシックエディター(TinyMCE)の時代でして、僕も無料/有料テーマを使うということはほとんどなく、ほぼ100%オリジナルでテーマをつくっていました。そして、ちょうどこれから WordPress がブロックエディターになりますよーという話がでてくるちょっと前から Snow Monkey の開発をはじめて、ちょうどもうブロックエディターになるよーというところで Snow Monkey 専業になったため、現在の現場はどのような状況になっているのかはあまり把握できていないのですが、ずーーっと WordPress やブロックエディターと向き合ってきての感想としては、僕も上の皆さんの意見と同じく、今後は「無料/有料テーマをベースにカスタマイズをする」というやり方の割合が増えていくのではないかなぁと感じています。

なんでそう感じているのかということをちょっと詳しく書いてみたいと思います。

クラシックエディター(TinyMCE)時代のサイト・ページ制作

多分下記のようなフローが多かったのではないでしょうか。

  1. Photoshop などのデザインツールでカンプをつくる
  2. カンプをもとにコーディング(静的コーディング → WordPress 組み込み or 直接オリジナルテーマにコーディング)
  3. ページの内容については「ページテンプレートに直書き」or「クラシックエディターをテキストモードにして HTML を貼り付け」or「カスタムフィールドを駆使したオリジナルのページ編集画面をつくる」

どうですかね?

ブロックエディター(Gutenberg)時代のサイト・ページ制作

さて、そしてブロックエディター時代になりました。まだまだ上記のフローで制作をおこなっている方も多いと思いますが、ブロックエディターがでてきたことで、次のような UX の向上がありました。

  • ページ編集画面で「見たまま編集」できるようになった
  • ブロックごとの HTML が「確実に」保持される(テキストモード ↔ ビジュアルモードの切り替えで一部の HTML が消えてしまったり、ビジュアルモードでページ編集をおこなうことで意図しない位置に HTML が挿入されてしまうという現状とはオサラバ)
  • 動的な要素もショートコード無しで挿入できる(もちろんちゃんとプレビューされる)

つまり、ページ編集時に HTML のことを「一切」気にしなくて良くなったということです。他にもいろいろな利点はあると思いますが、僕がこの点がブロックエディターの最大の利点だと考えています。納品された WordPress サイトを使って情報発信する直接のユーザーは多くの場合 HTML のことを知らないだろうし、考えたくもないという方が多いと思います。そのような方たちに HTML のことを一切考えずに、確実に制作者の意図したとおりの HTML 構造で情報発信ができるというのはかなり素晴らしいことではないでしょうか?というか制作者もページつくったり記事書くたびにいちいち HTML / CSS を書きたいですかね?僕は書きたくないです!

別軸の話として、「ブロックエディターはエンドユーザーには難しい!クラシックエディター最高!」という意見も見受けられますが、僕は多くの場合ただそのテーマのブロックエディター対応がクソなだけで、ブロックエディター自体が使いにくいというパターンはかなり少ないと考えています。Snow Monkey のユーザーさんにもただ情報発信をしたいだけで HTML や WordPress のことはよくわからないという方がたくさんいますが「クラシックエディターからブロックエディターになって直感的にページがつくれるようになりうれしい」という意見を多数頂いています

さて、そんなブロックエディターですが、前述したようにまだまだ「クラシックエディター(TinyMCE)時代のサイト・ページ制作」のフローで制作をおこなっている現場は多いと思います。おそらくこれはクラシックエディター→ブロックエディターになったことで開発の難易度が爆上がりしたことが原因ではないでしょうか。

この動画がわかりやすいです。

ブロックエディターはその名のとおり「ブロックを組み合わせる」ことでページをつくっていきます。このブロックは WordPress そのものにも多数同梱されていますが、web 制作の現場ではこの既存のブロックだけではデザインを再現できない・表現性が低いという問題があります。なので自分でオリジナルのブロックをつくる必要がでてきます。

これまでの WordPress によるサイト制作では、PHP でテンプレートをつくることが主でした(ですよね?)。ですが、カスタムブロックをつくるには JavaScript や React の知識が必要になってきます。WordPress で使う PHP は、簡単なサイト制作の場合はほとんどコピペで済むようなものが多いので、実際ググってコピペしてという行為をおこなっている方もかなりいると思うのですが、JavaScript や React となるとビルドが必要になるのでコピペしただけでは動かないし、設計思想自体がそもそも違ってくるのでハードルが一段も二段も高いのです。

加えて、ブロックエディター自体については「後方互換性を超大事にする」という WordPress の開発方針からちょっと(いや、かなり)ズレているように感じています。バージョンあがるとエディターの DOM が変わって CSS が効かなくなったり、API が廃止されて書き換えが必要になったり…。つまり保守(名ばかり保守ではなく、ずっとつきあって開発・メンテンナンスをする本当の保守)が必要になったのです。

そうなると開発工数も上がるし、そもそも対応自体できないという方もいると思うので、クラシックエディターをインストールしてこれまで通りの開発フローで…となる現場も多いのではないかなぁと思っています。

シンプルなデザインが主流になった・まともに使える無料/有料テーマが増えた

エディターからちょっと視点を変えて。外部要因として、

  • シンプルなデザインが主流になった
  • まともに使える無料/有料テーマが増えた(まだ多くはないけど)

というものがあります。僕はもう15年近く web 制作をおこなっていますが、昔は画像を多用してつくり込むようなサイト制作がすごく多かったです。トレンドもそうですし、技術的にも CSS や JavaScript で実現できる表現の幅が狭かったからかなと思います。でも、現在はテキストと写真が主体のシンプルなデザインのサイトが多いですよね。画像を多用してつくり込むようなサイトの場合、無料/有料で配布するような汎用化されたテーマをつくることができません。結局画像は利用者が作ってね、としないといけないので。でもテキストと写真が主体のシンプルなデザインの場合であれば、汎用化されたテーマをつくることは充分に可能です。

さらに、これまではクラシックエディターだったために、レイアウト周りの HTML 周りは提供できてもエディター内の HTML については提供できなかったのですが、ブロックエディターになったことでエディター内の HTML についても開発者が意図したものを提供することができるようになりました。そういうことで、Snow Monkey や SWELL をはじめ、これまでには少なかった扱いやすく品質の高い無料/有料テーマがでてきやすくなりました。テーマの費用は制作会社に制作を依頼するのに比べればめちゃくちゃ安いので、じゃあ買って自分でやってみるか、というエンドユーザーの方も増えてくると思います。

そうなってくると、「ブロックエディターで直感的にページをつくる」という経験をした方が増えます。もしこういった方が「売上も増えてきたからプロにオリジナルテーマの制作を依頼しよう」となったらどうでしょうか。依頼を受けた制作会社がブロックエディターに対応した使いやすいテーマを開発できるのであれば win-win でしょうが、クラシックエディターをインストールした旧来のオリジナルテーマをつくり納品したとしたら…。何十万も払ったのに、たかだが数千円〜1・2万程度のものより全然使いにくい!となってしまうことが増えてしまうのではないでしょうか。

まとめ

そういうことで、僕的には

  • ブロックエディター対応の難易度・開発工数の向上
  • シンプルなデザインが主流になった
  • まともに使える無料/有料テーマが増えた

という点から、少しずつ、「オリジナルテーマをつくる」から「無料/有料テーマをベースにカスタマイズする」が増えていくのではないかと思います。

今はまだ「予算が少ないから無料/有料テーマを使う」という選択肢をとる方が増えてきたかなという印象ですが、僕ももっと頑張って「予算がある場合でも無料/有料テーマを使う」という方が増えるような状況にしていきたいなと思います!

余談 – 既存テーマのカスタマイズはやりにくい?

関連のツイートを追っていると

  • 既存テーマはさわりたくない
  • オリジナルでつくったほうがはやい

のような意見も見られました。どういう意味で上記のような意見なのかによって僕は賛否がわかれるのですが、例えば「無料/有料テーマよりオリジナルでつくったほうが品質が高いから〜」という理由であれば僕はかなり疑問です。

まず経験として、仕事で他の誰かがつくった WordPress サイトを触る機会があったときに「これはめちゃくちゃ構造化されていてわかりやすい!」となったことがほぼありません。むしろ「そもそも WordPress のスタンダードに沿ってないからどこでどう処理されているかわからないし、なんでこんな無駄な処理をしているのかマジで謎」なテーマのほうが多かったです。流行りの無料/有料テーマのコードをのぞいたときも「なんやこれ…」となることが多かったですが、別にどっちもどっちであり、オリジナルのほうが品質が良いと断言できるほど素晴らしいオリジナルテーマをみたことはありません。

「オリジナルでつくったほうがはやい」というのもまぁ慣れの問題で、ブロックエディターに対応した無料/有料テーマであれば、カスタマイザーからレイアウトを選択してバーっとブロック流し込んでページをつくることができるので、1からコーディングするのに比べれば初速はかなり速いはずです。というか、「デザインカンプをつくって静的コーディングをして組み込み」というフロー自体が「ブロックエディターで流し込んでワイヤー代わりにする」というフローに取って代わる可能性もあると思っていて、そうすると何を基準に何と比べて「はやい」のかという話になってくるので、一概に「オリジナルは制作スピードはやい」「無料/有料テーマを使うと制作スピードがおそい」とは言えないのではと思います。

↓ほんとこれ。

オチ

安定の低ググラビリティ。

この記事を書いた人

キタジマ タカシ

長崎県長崎市在住。地元のWeb制作会社でWebデザイナー/エンジニアとして従事した後、2015年にフリーランス [ モンキーレンチ ] として独立。WordPress のテーマやプラグイン、ライブラリ、CSS フレームワーク等、多数のプロダクトをオープンソースで開発・公開しています。

Snow Monkey オンラインコミュニティ

Snow Monkey をより良いテーマにするために、今後の機能開発等について情報共有したりディスカッションをしたりする場所です。より多くのユーザーの交流があったほうがより良いプロダクトに育っていくと思いますので、ぜひご参加ください!