2025/2/4
[ 初回公開日:
2021/7/8
]
コーポレートサイトをWordPressからSTUDIOに移行したワケ

こんにちは、IT+ デザイナーの溝口です。
(2022/7/27 追記)
ついにSTUDIOがWordPressからの記事のインポートに対応しました!!!
https://blog.studio.design/ja/posts/wp-import
数年おきに時代や事業の整理と合わせてリニューアルを行うことが多いコーポレートサイト。
最近弊社ではWordPressから、ずっと気になっていた日本発のノーコードWebデザインツール「STUDIO」への移行を行いました。
今回は、なぜWordPressから移行したのか、なぜSTUDIOを選択したのか、ざっくりお話したいと思います。
※STUDIOとWixの比較ついては
ノーコードWebデザインツール「WiX」と「STUDIO」をデザイナー目線で比較してみた
という記事をご覧ください。
移行の背景
2-3年ごとにリニューアルをしていた弊社コーポレートサイト。
今まではデザインの自由性、ブログや実績の更新のしやすさ、SEOなどの観点からWordPressで構築をしていました。WordPress自体の利用は無料であること、様々なプラグインによるカスタムや拡張ができることなど、WordPressはとても便利です。
ただ、デザイナーの観点では以下の点をネックに感じていました。
日々必要となる本体・プラグインのアップデートの手間
ページのレイアウト変更にコーディングの知識が必要
そこで、時代の流れも考慮し、そろそろデザイナーでもページの更新がしやすい「ノーコードツール」に乗り換えよう!となったのが今回のリニューアルのきっかけでした。
ノーコードツールを選択するにあたり、特に重視していたポイントは以下の2つ。
元のサイトを再現できる、デザインの自由度
ブログ / 実績ページの運用を前提とした、CMS機能の使いやすさ
WiXやWebflowを使ってみた中で、なぜSTUDIOを選んだのか、についてご紹介します。
ノーコード:HTMLやCSSなどのコーディングの専門的な知識を必要とせず、ドラッグ&ドロップでWebサービスやアプリなどのソフトウェアを開発できるサービス
STUIDIOを選んだ理由

STUDIO(https://studio.design/ja)
ノーコードのWebデザインツールとして最も有名なのはイスラエルで開発された「WiX(ウィックス)」ですが、弊社では日本発のノーコードWebデザインツール「STUDIO」を選びました。
STUDIOを選んだ理由が以下の5つになります。
「1.デザインの自由度が高い」

今回移行するにあたって、重要なテーマの一つだった「以前のデザインを再現できるか」。
テンプレートを使わず、完全オリジナルで全てを作りたいという要望がありました。
このコンテンツデザインの自由度が、STUDIOを選んだ大きな理由の一つです。
STUDIOは「ボックスレイアウト」という手法を使いながら、ドラッグ&ドロップでサイトを組み立てます。触り始めた当初は慣れない使い方に少し苦戦しましたが、YouTubeにSTUDIOのチュートリアル(https://www.youtube.com/channel/UCh4_wCvICgiHg0utNFziOoQ)が豊富に容易されているので、これを見てざっくりと覚えることができました。
ボックスレイアウトに慣れてくると、白紙のキャンバスに自由にデザインができるようになります。
グローバルナビの設計
ちょっとずらしたような表現
要素の固定やモーダル画面の作成
各デバイスごとのレスポンシブの調整
などなど、ノーコードでもここまでできるのか、と感動するほど自由度が高いです。
と言いつつ、まだまだ使いこなせてはいない機能はたくさんあると思いますが、、、w
どの程度のことができるのか気になる方は、2021年7月にリリースされた、STUDIOで作られた優れたWebサイトを集めたギャラリーサイト「STUDIO Showcase(https://showcase.studio.design/ja)」を見るだけでもSTUDIOの可能性を知ることができるのではないでしょうか。
ちなみに、私が今年制作させてもらった下記サイトもありがたいことに掲載いただくことができました。
STUDIO Showcase アイティプラス
「2.モリサワと提携しているから日本語フォントが豊富」

Webフォントがよく使われるようになってきた昨今、日本語のフォントが微妙だと、かなりサイトのイメージも変わってしまいますよね。
ノーコードツールでかっこいい日本語フォントなんて、と思っていたら、なんと、STUDIOならモリサワと提携しているため、デフォルトでモリサワのWebフォントが使用可能です。
これは本当にすごい。。
Google Fontsが搭載されていることが多くても、モリサワのフォントがこんなに簡単に使えるなんて中々ないのではないでしょうか。
いやー、本当にありがたい。。
「3.CMS機能もデザインの自由度が高い」

ブログや実績などを更新・運用していくにはCMS機能が必須。
STUDIOなら、カテゴリーや記事の表示形式などを自由にデザインできます。
SEOの観点やWordPressと比べるとまだ足りない部分はありますが、その点を理解した上で利用する分には十分充実した機能といえます。
ブログ / 実績など、複数の投稿タイプを追加して使える
カテゴリーページ / 詳細ページを自由に設計できる
表示する項目(フィールド)をカスタムして設計できる
こういった使い勝手の良さがあり、実際に触っていくと「なるほど、便利だな」と思う場面が多いです。
「4.アニメーションの設定が豊富」

サイトを作るうえで、画像を横から出したり文字を下からふわっと表示させたり、色が切り替わってから別の要素を登場させるなど、動きによる演出を取り入れたい場合も多いですよね。
STUDIOでは以下のように、細かいアニメーション設定をノーコードで行うことができます。
表示する方向や速度
マウスオーバー時の動きや色の変化
表示までの遅延タイミング
特にトップページのメインビジュアルなど、こだわりたい部分の演出に大いに役立ちます。
「5.今後への期待」
最後まで「WiXで作ったほうがいいのでは?」と悩んだのも事実です。
デザイン面ではSTUDIOが優位でしたが、細かい部分の機能やメディア関連の管理、プラグイン拡張などはWiXに分がある場面もあります。
それでもSTUDIOを選んだ理由としては、
日本初のノーコードWebデザインツールで、デザイナー目線で作られている
弊社のコーポレートサイトの場合、SEOよりもデザインや見た目の優先度が高かった
完全に日本語対応で、今後も機能拡張が進む見込みがある
という点が大きいです。STUDIOとWiXの比較はまた別の記事で詳しく書きたいと思います。
※STUDIOとWixの比較ついては
ノーコードWebデザインツール「WiX」と「STUDIO」をデザイナー目線で比較してみた
という記事をご覧ください。
移行の際に大変だったこと
今回移行をするにあたって一番のネックだったのがSEOを含めたブログの移行でした。
(2022/7/27 追記)
ついにSTUDIOがWordPressからの記事インポートに対応しました!!!
https://blog.studio.design/ja/posts/wp-import
しかし、それまではWordPressからSTUDIOへのブログ移行は全て手作業となり、メタ情報などを含め一記事ずつコツコツ移す必要がありました。記事数が多い場合はかなり大変でしたが、地道に作業するしかありませんでしたね。
今後、インポート機能がさらにアップデートされるととても嬉しいです。
STUIDIOで実現できなかったこと
デザイン面では満足度が高い一方、細かい部分で手が届かない機能もありました。
今回移行してみて特に感じたのは、主にブログ部分(CMS機能)で以下ができなかったことです。
サイト内検索機能がなかったカテゴリーの第二階層が作れない(※今後対応予定との情報があり)
ページャーを作れない
記事ごとの関連記事の自動表示ができない
目次などのページ内リンクが作れないPDFファイルのアップロード(メディアの追加)ができない
(2022/11/29 追記)
以下の機能がついに対応しました!!
サイト内検索機能
目次機能
https://blog.studio.design/ja/posts/cms-search
https://blog.studio.design/ja/posts/table-of-contents
SEOをより重視する場合、現時点ではWordPressの方が優秀かもしれません。ただ弊社の場合、ダッシュボードでの高度なデータ分析やプラグイン活用よりも、見た目やデザイナー視点の表現力を優先したためSTUDIOを選択しました。
移行してみて良かったこと
数ヶ月運用してみた結果、ネックに感じていた部分は解消され、非常に満足しています。
特に良かった点は次の3つです。
WordPress本体・プラグインなどのアップデートを気にしなくていい
ちょっとした修正ならデザイナーがすぐ直せる
実案件でも「STUDIO」が一つの選択肢になった
まとめ
いかがでしたでしょうか?
今回は弊社の事例として、WordPressからSTUDIOへ移行した理由や背景をご紹介しました。
全部STUDIOがいい! というわけではなく、リニューアルの目的や内容によって「何で作るべきか」を見極めることが重要です。
世の中には様々なWeb制作のコンテンツ管理・運用ツールがあり、どれを選択するかは案件ごとに大きく異なります。重視すべきポイント(SEO・デザイン・ユーザビリティ・予算など)を明確にした上で、最適な方法を選んでいただければと思います。
最後までお読みいただき、ありがとうございました。
※STUDIOとWixの比較ついては
ノーコードWebデザインツール「WiX」と「STUDIO」をデザイナー目線で比較してみた
という記事をご覧ください。
また、弊社ではWebサイトの戦略策定やデザイン、コンサルティングの支援も行っております。気になる方はお気軽にご相談ください。
この記事を書いた人




























