Twenty Twenty-Oneは2021年版のデフォルトテーマ

Twenty Twenty-Oneとは

WordPressテーマTwenty Twenty-Oneは、2021年のWordPressのデフォルトテーマとしてリリースされました。

主な特徴は以下の通りです。

ブロックエディターとの連携に特化

Twenty Twenty-Oneは、WordPressのブロックエディター(Gutenberg)を最大限に活用することを前提に設計されています。これにより、直感的な操作で柔軟なページレイアウトを作成できます。あらかじめ用意されたブロックパターンを使えば、美しいデザインのセクションを簡単に挿入し、カスタマイズすることが可能です。

ミニマルで汎用性の高いデザイン

シンプルでミニマルなデザインが特徴で、ポートフォリオサイト、ビジネスサイト、個人ブログなど、様々な用途に対応できる「空白のキャンバス」のようなテーマです。柔らかな色合いと時代を超越したデザインは、コンテンツを引き立てるように設計されています。

アクセシビリティへの配慮

高いアクセシビリティ基準を満たすように開発されており、様々なユーザーが利用しやすいように配慮されています。例えば、ハイコントラストモードやダークモードに対応しており、キーボードナビゲーションもサポートしています。

ダークモード対応

デフォルトテーマとしては初めて、ダークモードに対応しています。カスタマイザーから簡単に切り替えることができ、サイトの背景色に応じて文字色も自動的に調整されるため、視認性が保たれます。

カスタマイズの柔軟性

パステル調のカラーパレットが複数用意されており、背景色を変更することも可能です。また、サイトのロゴやナビゲーションメニュー、フッターウィジェットなども柔軟に設定できます。

その他の特徴

  • シングルカラムレイアウト: 基本的にシンプルな1カラムのレイアウトです。
  • システムフォントスタック: 追加のフォントファイルを読み込む必要がないため、ページの読み込み速度向上にも貢献します。
  • 子テーマの作成が容易: CSSカスタムプロパティが多用されているため、子テーマを開発する際も比較的簡単にカスタマイズできます。

Twenty Twenty-Oneは、WordPressの最新の機能であるブロックエディターを最大限に活用したいユーザーにとって、非常に優れた選択肢となるテーマです。

Twenty Twenty-One の基本的な使い方

WordPressのデフォルトテーマであるTwenty Twenty-Oneは、シンプルでミニマルなデザインが特徴で、ブロックエディター (Gutenberg) を最大限に活用できるように設計されています。ここでは、その使い方とカスタマイズのポイントを解説します。

Twenty Twenty-One は、あなたのアイデアを表現するための「真っ白なキャンバス」として機能します。コンテンツの作成は、主にWordPressのブロックエディターで行います。

  • ブロックエディターの活用: Twenty Twenty-Oneはブロックエディターとの連携が非常に強く、ブロックエディターの機能を使って自由にレイアウトをデザインできます。
  • ブロックパターン: テーマに付属しているブロックパターンを活用すると、あらかじめデザインされたブロックの組み合わせを簡単に挿入でき、瞬時に美しいレイアウトを作成できます。ポートフォリオ、ビジネスサイト、個人ブログなど、様々な用途に対応可能です。
  • シンプルなデザイン: 柔らかなパステル調の色合いと、時代を超越したデザインが特徴です。コンテンツそのものを際立たせることに重点が置かれています。

Twenty Twenty-One のカスタマイズ方法

Twenty Twenty-Oneのカスタマイズは、主に外観 > カスタマイズから行います。

1. 背景色の変更

Twenty Twenty-Oneでは、独自の背景色を選択できます。選択した背景色に基づいて、アクセシビリティを考慮したテキスト色が自動的に選択されるため、訪問者にとって見やすい色のコントラストを保てます。

  • 設定場所: 「カスタマイザー」→「
  • 方法: 好みの背景色を選択するだけで、サイト全体の配色が自動的に調整されます。

2. サイトロゴの追加

サイトのブランディングのために、ロゴを追加できます。

  • 設定場所: 「カスタマイザー」→「サイト基本情報
  • 方法: 「ロゴを追加」ボタンをクリックし、メディアライブラリから画像を選択またはアップロードして設定します。

3. ソーシャルアイコンの追加 (フッターメニュー)

Twenty Twenty-Oneは、フッターのすぐ上にサブメニューを設定するオプションがあります。これを活用して、ソーシャルメディアのプロフィールへのリンクをアイコンとして表示できます。

  • 手順:
    1. まず、ソーシャルリンク用のメニューを作成します。(外観 > メニューから作成できます)
    2. 作成したメニューに、ソーシャルメディアのURLをカスタムリンクとして追加します。
    3. 次に、「カスタマイザー」→「メニュー」に進みます。
    4. メニュー位置」パネルを選択し、作成したソーシャルリンクメニューを「ソーシャルリンクの位置」に割り当てます。

4. フォントとレイアウトの調整

Twenty Twenty-Oneのデフォルトのフォントサイズやコンテンツ幅は、ブロックエディターの機能を使って個別に調整することも可能です。

  • コンテンツ幅: 標準のコンテンツ幅は比較的狭く設定されていますが、ブロックエディターの「幅広」設定を使うとヘッダーと同じ幅(1240px)に、さらに「全幅」設定を使うと画面いっぱいに表示できます。
  • フォントサイズ: ブロックごとにフォントサイズを変更できます。

5. その他のカスタマイズ

  • 子テーマの利用: より詳細なカスタマイズを行いたい場合は、Twenty Twenty-Oneの子テーマを作成し、functions.phpstyle.cssを編集することをおすすめします。これにより、テーマのアップデート時にカスタマイズが失われるのを防げます。
  • プラグインの活用: Twenty Twenty-Oneの機能を拡張するためのプラグインも活用できます。例えば、日本語向けのカスタマイズを簡単に行えるプラグインなどもあります。

Twenty Twenty-Oneは、シンプルながらもブロックエディターの機能を最大限に引き出し、柔軟なサイト構築を可能にするテーマです。まずはカスタマイザーを触ってみて、どのような設定ができるのか確認してみるのがおすすめです。

Twenty Twenty-Oneの注意点

Twenty Twenty-OneはWordPressのデフォルトテーマであり、シンプルで使いやすいのが特徴ですが、利用する際にはいくつかの注意点があります。以下に主な注意点を挙げます。

Twenty Twenty-Oneテーマの主な注意点

  1. 機能のシンプルさ:
    • カスタマイズの限界: Twenty Twenty-Oneは非常にシンプルに設計されているため、高度な機能や複雑なレイアウトを実現しようとすると、追加のプラグインやCSSによるカスタマイズが必須になります。
    • ブロックエディタ(Gutenberg)への依存: このテーマはブロックエディタでの利用を前提としています。ブロックエディタに慣れていない場合や、従来のクラシックエディタを主に使用したい場合は、使いづらく感じるかもしれません。
  2. デザインの汎用性:
    • 個性が出しにくい: デフォルトテーマであるため、多くのサイトで利用されており、そのままでは他のサイトとの差別化が難しいことがあります。独自のブランディングを強く打ち出したい場合は、デザインのカスタマイズが不可欠です。
    • カラーパレットの限定性: デフォルトのカラーパレットはシンプルで落ち着いたものですが、より鮮やかで目を引くデザインにしたい場合は、カスタマイザーでの調整や追加CSSが必要になります。
  3. パフォーマンス:
    • 概ね良好だが、コンテンツ次第: Twenty Twenty-One自体は軽量な部類に入りますが、画像や動画などの重いコンテンツを多用したり、多数のプラグインを導入したりすると、サイトの表示速度に影響が出る可能性があります。これはどのテーマにも言えることですが、シンプルだからと油断せず、パフォーマンス最適化を心がけることが重要です。
  4. セキュリティとメンテナンス:
    • WordPress本体との連携: デフォルトテーマであるため、WordPress本体のアップデートと同時にテーマも更新されることが多く、セキュリティ面での心配は比較的少ないです。しかし、常に最新のWordPressバージョンとTwenty Twenty-Oneテーマを使用することが重要です。
    • 子テーマの利用推奨: テーマファイルを直接編集すると、テーマのアップデート時に変更が上書きされてしまいます。カスタマイズを行う場合は、必ず子テーマを作成してその中で変更を加えるようにしましょう。これにより、将来のアップデートでもカスタマイズ内容を安全に保持できます。
  5. SEO対策:
    • 基本的な構造はOK: Twenty Twenty-OneはSEOに配慮した基本的な構造を持っています。しかし、それだけで上位表示されるわけではありません。適切なキーワード選定、質の高いコンテンツ作成、画像へのalt属性設定など、一般的なSEO対策は必須です。

まとめ

Twenty Twenty-Oneは、WordPressを始めたばかりの方や、シンプルなブログ、ポートフォリオサイトなどを構築したい場合に非常に適したテーマです。しかし、より複雑な機能や独自のデザインを求める場合は、カスタマイズやプラグインの導入が必要になることを理解しておく必要があります。特に、カスタマイズを行う際には子テーマの利用を強くお勧めします。

口コミ・評価

WordPressのデフォルトテーマTwenty Twenty-Oneは、シンプルで柔軟性が高く、多くのユーザーから高い評価を受けています。具体的な口コミや特徴をまとめると、以下のようになります。

良い口コミ・評価

  • シンプルでカスタマイズしやすい: 余計な装飾がなく、まっさらなキャンバスのようなテーマです。ブロックエディターとの相性が良く、初心者でも簡単にレイアウトを組むことができます。
  • アクセシビリティが高い: WCAG 2.1 レベル AAAの基準を満たすなど、アクセシビリティに最大限配慮して設計されています。誰にとっても使いやすいサイトが作れます。
  • 軽量で動作が速い: 余計な機能やスクリプトが少ないため、読み込み速度が速く、サイトのパフォーマンスが向上します。
  • ソフトで落ち着いたカラー: 柔らかいパステル調のカラーリングが特徴で、目に優しく、洗練された印象を与えます。
  • ダークモードに対応: 訪問者がダークモードに切り替えるオプションを提供できるため、ユーザーの閲覧体験を高めることができます。

注意点・デメリット

  • 機能が少ない: シンプルさがメリットである反面、はじめから多くの機能は備わっていません。多機能なテーマを求めている場合は、プラグインで機能を補う必要があります。
  • デザインが個性的: 他のデフォルトテーマと比べると、フォントやカラーリングにやや個性があると感じるユーザーもいます。

まとめ

Twenty Twenty-Oneは、「シンプル・イズ・ベスト」という考え方でサイトを構築したい人には最適なテーマです。特に以下のような方におすすめできます。

  • WordPress初心者: シンプルな構造なので、テーマの仕組みを理解するのに適しています。
  • ブログやポートフォリオサイト: コンテンツを主役にしたいサイトにぴったりです。
  • 軽量で速いサイトを求める人: サイトのパフォーマンスを重視するなら、良い選択肢になります。

逆に、多機能なブログパーツや独自のウィジェットなど、はじめから多くの機能が組み込まれたテーマを求めている場合は、プラグインの導入を検討するか、別のテーマを探すのも良いかもしれません。

公式テーマと有料テーマを比較

WordPressの公式テーマ(無料)と有料テーマを比較すると、主に費用機能・カスタマイズ性サポートデザインなどの点で違いがあります。

以下に主な比較ポイントをまとめます。

比較項目WordPress公式テーマ(無料)有料テーマ
費用無料1万円〜3万円程度の買い切り型、または月額/年額のサブスクリプション型が多い
機能・カスタマイズ性シンプルで基本的な機能に限定されることが多い。高度な機能はプラグインで補う必要がある。多機能で、ドラッグ&ドロップビルダーや豊富なレイアウトオプションなど、高度なカスタマイズ機能が組み込まれていることが多い。
デザインシンプルで、他のサイトとデザインが似る可能性がある。プロフェッショナルで高品質なデザインが多く、独自性を出しやすい。特定の業種に特化したテーマもある。
サポート公式フォーラムなど、コミュニティベースのサポートが中心で、個別対応は期待できないことが多い。テーマ開発者による専門的なサポート(メール、チャットなど)が提供されることが多く、初心者には安心。
アップデート公式ディレクトリに登録されているため、セキュリティや互換性のチェックはされているが、機能追加の頻度はテーマによる。定期的なアップデートがあり、最新のWordPressやプラグインとの互換性、セキュリティ対策がより迅速に行われる傾向がある。
コードの品質・安全性公式テーマは厳格な審査基準をクリアしているため、一定の品質・安全性は担保されている。評判の良いテーマは高品質だが、中にはコードが複雑すぎたり、セキュリティに問題があるものも存在する可能性があるため、選定に注意が必要。
SEO対応基本的なSEO対策はされているが、高度な最適化はプラグインに依存することが多い。内部SEOが最適化されているテーマが多い。

まとめと推奨

あなたの状況推奨されるテーマ
予算をかけたくない個人ブログシンプルなサイトで十分自分でカスタマイズできる知識がある公式テーマ(無料)
ビジネスサイトや本格的なサイトを構築したいデザインの独自性を出したい豊富な機能やカスタマイズ性が欲しい初心者でサポートが必要時間と労力を節約したい有料テーマ

最終的には、あなたのサイトの目的、予算、求める機能、そしてウェブサイト構築のスキルレベルに応じて、最適なテーマを選択することが重要です。有料テーマを選ぶ場合は、評判やサポート体制、アップデートの頻度をしっかり確認することをお勧めします。

テーマ名主な特徴・強み適したサイト
ザ・トール (THE THOR)国内最高クラスのSEO最適化高速表示
プロ仕様の美しいデザインを簡単に実現(着せ替え機能あり)
アフィリエイトに役立つランキング作成機能CTAが充実<記事装飾機能が豊富で、読みやすいコンテンツ作成を支援
アフィリエイトブログ本格的なメディアサイト集客を重視するビジネスサイト
エマノン (Emanon)Web集客・ビジネス利用に特化した機能が豊富
CTA(行動喚起)、LP(ランディングページ)、メルマガ専用ページなどを簡単に作成
企業サイト、オウンドメディアに適したデザイン
WooCommerce対応でネットショップにも利用可能(Premium)
コーポレートサイト企業ブログオウンドメディアリード獲得を目的としたビジネスサイト
ストークSE (STORK SE)「誰が使っても美しいデザイン」を追求したモバイルファースト設計
シングルカラム(1カラム)レイアウトに特化し、コンテンツへの集中度が高い
ブロックエディタに最適化され、直感的な操作が可能
シンプルかつ洗練されたデザインで、汎用性が高い
商品・サービスのブランディングサイト、ミニマルな企業サイトシンプルで美しいブログ
リキッドプレス (LIQUID PRESS)用途別に豊富なテーマ(マガジン、コーポレートなど)が用意されている
高いSEO対策と構造化データ対応
多言語対応機能(LIQUID CORPORATEなど)
カスタマイザーでの直感的な編集が可能
メディアサイト(ブログ)、多言語対応が必要な企業サイト目的に合わせたテーマを選びたいサイト
有料WordPressテーマ

補足情報

  • ザ・トール: SEOと収益化を最重視する設計で、アフィリエイターやブロガーに人気が高いテーマです。
  • エマノン: 特にBtoBサービス業など、Webからの顧客獲得(リードジェネレーション)を重視するビジネスサイト構築に適しています。
  • ストークSE: モバイルでの見やすさに徹底的にこだわり、余計な装飾を排したデザインが特徴です。商品の魅力を際立たせたいサイトにも向いています。
  • リキッドプレス: 豊富なラインナップの中から目的特化型のテーマを選べるのが大きなメリットです。例えば、ニュースサイトならLIQUID MAGAZINE、企業サイトならLIQUID CORPORATEなどがあります。