2024年05月10日(金曜日)
2024年5月10日(金)にアウトプット共有会・社内カンファレンスをリモートを併用して開催しました。
今回のテーマ:WEBデザイナーがプロジェクトで使用するCMS(WordPress、Wix、Shopify)について
(1)そもそもCMSとは?
「Contents Management System:コンテンツ・マネジメント・システム」の略で、Webサイトのコンテンツを構成するテキストや画像、デザイン・レイアウト情報(テンプレート)などを一元的に保存・管理するシステムのこと。
データベースに保存されている記事、写真、テンプレートのデータをCMSが組み合わせて動的にページを生成してくれる。
(2)プロジェクトで使用していたCMS
・Wordpress
現時点(2024年)でCMSシェア率64.2%、国内シェア率は84.4%とシェア率1位のCMS。国内サイトだけで言うと5つの内4つのサイトがWordPressで構築されている事になります。シンプルかつバージョンアップを続けた事により10年以上トップシェアを維持し続けています。
・Shopify
WordPressに次いでシェア率の高いCMS。
WordPressのような記事メインサイトというよりは、ECサイトとして利用されるシーンが多く、代表的なサイトとしては「MIKI HOUSE」「オリオンビール」「ゴーゴーカレー」「東京ラスク」「john masters organic」など。
(3)2022年時点でのCMSのシェア
[世界シェア]
WordPress
Shopify
Wix
[日本シェア]
WordPress
Adobe Systems
EC-Cube
[番外編]
・hubspot
MAツール(マーケティングオートメーション)の一つで、html、cssなどマークアップ言語が分からなくてもパーツを組み合わせる事でページの作成ができるツール。頻度は少ないが、プロジェクトで使用する機会があった。
(4)プロジェクトで使用していたWordPressプラグイン
・All-in-One WP Migration and Backup
WordPressのDBデータなどをローカル環境からテスト環境や本番環境に移行する際に便利なプラグイン。
WPを使用するプロジェクトの際は基本的にこのプラグインを入れていた。
・Contact Form 7
問い合わせフォームのプラグイン。日本人が開発しており、こまめに更新もされているため比較的安心して使用できる。
使用の際に参考になるサイトや、開発ブログが多くある点も安心。
・MW WP Form
自由度・デザイン性が高くcontactform7と同じくらい使用していたが、2023年9月に開発者の方が開発終了の旨を発表した。
後継の制作会社が一般ユーザー向けに脆弱性対策のみする形になっていくようだが、法人ユーザー向けでは無いため、プロジェクトなどで使用する際は注意が必要。
・Advanced Custom Fields
投稿や固定ページで同じ項目を入力する必要がある際に使用していた。(例えば、店舗一覧や問い合わせ先一覧、同じ形式で入力する必要のある記事など)
・All in One SEO
無料版・有料版があり、無料版でも必要なツールはほぼ使用することが可能。
業務で使用する際は、無料版で可能なサイトタイトル・ディスクリプション・キーワードの設定にのみ使用していたが、他にもGoogleアナリティクスとの連携も可能。
有料版になるとローカルSEOに対応可能になったり、Googleニュースに対してサイトマップを送信したり、Googleニュースに検出されやすくなる。
(5)WordPressの環境構築方法
1.MAMP/XAMPP
ローカル環境を作ったことのある方なら知っている人も多いMAMP/XAMPP。macユーザーの場合はMAMP、winユーザーの場合はXAMPPを使用する。
WordPressに限らず、静的サイトのローカル表示をすることも可能。
一昨年位に自身のmacをOSアップデートしたところ、MAMPでのWordPress環境が作れなくなってしまったので(セキュリティ周りの問題?)直近はLocalにてWordPress環境を作成していた。
2.docker
dockerを使用した事がある人や、複数人で開発環境を同じにする場合などはdockerでの開発がおすすめ。
dockerダウンロード後、docker-compose.ymlファイルにWordPress情報などを入力し、その後立ち上げる。慣れてしまえばdockerでの環境構築の方が簡単な場合もある。
3.Local
WordPress環境構築ツール。
無料で使用する事ができ、ドメインやサーバーの知識がなくとも簡単にWordPressの環境構築をする事が可能。複数のWordPressローカル環境を作ることも可能なので、初めてWordPressに携わる方にもおすすめ。
デメリットとしては、WordPressデータやテーマファイルをgit管理している場合、どういった環境作りにするかをあらかじめ決めておく必要がある。(テーマファイルのみシンボリックリンクするなど)
[質疑応答]
Q. 2024年4月にWEBアクセシビリティの義務化が決まったが、現在のCMSで対応するプラグインなどはある?
→現状はプラグインなど無いので、サイト制作時にアクセシビリティに配慮するUI設計を気を付けている(ポールアンドジョ―のショッピングサイトが様々なアクセシビリティに対応していて参考になる)
ガジュマルでは今後も定期的に共有会・勉強会、カンファレンスや、エンジニアの交流イベントを開催していきます。
興味がある方、参加してみたいという方は、以下の公式LINEを友だち追加のうえ、お気軽にお問合せください。
LINE登録はこちらをクリック
今回のテーマ:WEBデザイナーがプロジェクトで使用するCMS(WordPress、Wix、Shopify)について
(1)そもそもCMSとは?
「Contents Management System:コンテンツ・マネジメント・システム」の略で、Webサイトのコンテンツを構成するテキストや画像、デザイン・レイアウト情報(テンプレート)などを一元的に保存・管理するシステムのこと。
データベースに保存されている記事、写真、テンプレートのデータをCMSが組み合わせて動的にページを生成してくれる。
(2)プロジェクトで使用していたCMS
・Wordpress
現時点(2024年)でCMSシェア率64.2%、国内シェア率は84.4%とシェア率1位のCMS。国内サイトだけで言うと5つの内4つのサイトがWordPressで構築されている事になります。シンプルかつバージョンアップを続けた事により10年以上トップシェアを維持し続けています。
・Shopify
WordPressに次いでシェア率の高いCMS。
WordPressのような記事メインサイトというよりは、ECサイトとして利用されるシーンが多く、代表的なサイトとしては「MIKI HOUSE」「オリオンビール」「ゴーゴーカレー」「東京ラスク」「john masters organic」など。
(3)2022年時点でのCMSのシェア
[世界シェア]
WordPress
Shopify
Wix
[日本シェア]
WordPress
Adobe Systems
EC-Cube
[番外編]
・hubspot
MAツール(マーケティングオートメーション)の一つで、html、cssなどマークアップ言語が分からなくてもパーツを組み合わせる事でページの作成ができるツール。頻度は少ないが、プロジェクトで使用する機会があった。
(4)プロジェクトで使用していたWordPressプラグイン
・All-in-One WP Migration and Backup
WordPressのDBデータなどをローカル環境からテスト環境や本番環境に移行する際に便利なプラグイン。
WPを使用するプロジェクトの際は基本的にこのプラグインを入れていた。
・Contact Form 7
問い合わせフォームのプラグイン。日本人が開発しており、こまめに更新もされているため比較的安心して使用できる。
使用の際に参考になるサイトや、開発ブログが多くある点も安心。
・MW WP Form
自由度・デザイン性が高くcontactform7と同じくらい使用していたが、2023年9月に開発者の方が開発終了の旨を発表した。
後継の制作会社が一般ユーザー向けに脆弱性対策のみする形になっていくようだが、法人ユーザー向けでは無いため、プロジェクトなどで使用する際は注意が必要。
・Advanced Custom Fields
投稿や固定ページで同じ項目を入力する必要がある際に使用していた。(例えば、店舗一覧や問い合わせ先一覧、同じ形式で入力する必要のある記事など)
・All in One SEO
無料版・有料版があり、無料版でも必要なツールはほぼ使用することが可能。
業務で使用する際は、無料版で可能なサイトタイトル・ディスクリプション・キーワードの設定にのみ使用していたが、他にもGoogleアナリティクスとの連携も可能。
有料版になるとローカルSEOに対応可能になったり、Googleニュースに対してサイトマップを送信したり、Googleニュースに検出されやすくなる。
(5)WordPressの環境構築方法
1.MAMP/XAMPP
ローカル環境を作ったことのある方なら知っている人も多いMAMP/XAMPP。macユーザーの場合はMAMP、winユーザーの場合はXAMPPを使用する。
WordPressに限らず、静的サイトのローカル表示をすることも可能。
一昨年位に自身のmacをOSアップデートしたところ、MAMPでのWordPress環境が作れなくなってしまったので(セキュリティ周りの問題?)直近はLocalにてWordPress環境を作成していた。
2.docker
dockerを使用した事がある人や、複数人で開発環境を同じにする場合などはdockerでの開発がおすすめ。
dockerダウンロード後、docker-compose.ymlファイルにWordPress情報などを入力し、その後立ち上げる。慣れてしまえばdockerでの環境構築の方が簡単な場合もある。
3.Local
WordPress環境構築ツール。
無料で使用する事ができ、ドメインやサーバーの知識がなくとも簡単にWordPressの環境構築をする事が可能。複数のWordPressローカル環境を作ることも可能なので、初めてWordPressに携わる方にもおすすめ。
デメリットとしては、WordPressデータやテーマファイルをgit管理している場合、どういった環境作りにするかをあらかじめ決めておく必要がある。(テーマファイルのみシンボリックリンクするなど)
[質疑応答]
Q. 2024年4月にWEBアクセシビリティの義務化が決まったが、現在のCMSで対応するプラグインなどはある?
→現状はプラグインなど無いので、サイト制作時にアクセシビリティに配慮するUI設計を気を付けている(ポールアンドジョ―のショッピングサイトが様々なアクセシビリティに対応していて参考になる)
ガジュマルでは今後も定期的に共有会・勉強会、カンファレンスや、エンジニアの交流イベントを開催していきます。
興味がある方、参加してみたいという方は、以下の公式LINEを友だち追加のうえ、お気軽にお問合せください。
LINE登録はこちらをクリック