STUDIOでホームページ作成｜無料プラン・使い方・SEOを解説

「制作会社に頼むと数十万円かかる」「かといって自分で作ると、思いどおりのデザインにするのが難しい」——ホームページ作りでこの2つの間に悩む方は少なくありません。その悩みに応えてくれるのが、ノーコードツールのSTUDIO（スタジオ）です。

STUDIOは、プログラミングの知識がなくても、まるで制作会社に依頼したかのようなオリジナルデザインのサイトを自分で作れるサービスです。デザインの自由度はWixやJimdoより高く、日本発のサービスならではの分かりやすい管理画面と日本語サポートも魅力です。

この記事では、STUDIOの料金プランの中身から、初心者が最初の1ページを公開するまでの手順、そして実際に使ってみて分かるメリット・デメリットまで、導入前に知っておきたいことを順番に解説します。

STUDIOとは？他のツールとの違い

STUDIO（スタジオ）は、2018年にリリースされた日本発のノーコードWeb制作ツールです。「ノーコード」とは、HTMLやCSSといったコードを一切書かずに、画面を見ながら操作するだけでWebサイトを作れる仕組みのこと。専門知識がなくても、プロ品質のサイトを自分の手で作って公開できるのが特長です。

最大の違いは「白紙からデザインできる」自由度

WixやJimdoは、テンプレートをベースにカスタマイズしていく使い方が中心です。手軽な反面、レイアウトの自由度には限界があります。STUDIOは、何もない白紙のキャンバスから自由にデザインを組み立てられる点が、これらのツールとの一番の違いです。要素の位置や余白を細かく調整でき、スクロールに合わせた動きなども設定できます。だからこそ、「テンプレート感」のないオリジナルのサイトを、コードを書かずに実現できるのです。

その分、後述するように操作には少し慣れが必要ですが、「見た目にこだわりたい」「他社サイトと差をつけたい」という方にとっては、有力な選択肢になります。

主要ツールとの比較

STUDIO・Wix・Jimdo・WordPressの4つを、選ぶときに気になる項目で比べてみました。それぞれ得意分野が違うので、自分が何を一番重視するかを基準に見てみてください。

項目	STUDIO	Wix	Jimdo	WordPress
デザイン自由度	非常に高い	高い	テンプレート中心	テーマ次第
操作のしやすさ	中〜やや難	易しい〜普通	とても易しい	慣れが必要
SEOのしやすさ	高い	中〜高	中	非常に高い
日本語対応	完全対応	対応	対応	テーマ次第
ブログ機能	あり	あり	あり	あり
表示の速さ	非常に速い	普通	普通	テーマ次第

表のとおり、手軽さを最優先するならJimdo、ブログ記事を大量に積み上げたいならWordPressに分があります。STUDIOが光るのは「デザインの自由度」と「表示の速さ」。この2つを重視するなら、有力な候補になります。

STUDIOの料金プラン｜無料でどこまでできる？

STUDIOは無料プランから始められるのが大きな魅力です。ただし、プランによって「独自ドメインが使えるか」「STUDIOのロゴが表示されるか」などが変わります。まずは全体像をつかんでおきましょう。

料金プランの全体像

STUDIOのプランは、個人向けと法人向けに分かれています。下の表は、年払いにした場合の月あたりの料金の目安です（月払いはこれより割高になります）。なお、料金やプラン構成は見直されることがあるため、契約前には必ず公式サイトで最新の内容を確認してください。

プラン	月額（年払いの目安）	主な特徴
Free（個人向け）	0円	全デザイン機能、STUDIOサブドメイン、ロゴ表示あり
Mini（個人向け）	約590円	独自ドメイン、STUDIOロゴの非表示 ※公開2ページまで（LP向け）
Personal（個人向け）	約1,190円	アクセス数の上限が増加、パスワード保護
Business（法人向け）	約3,980円〜	大規模アクセス対応、外部連携やリダイレクト

このほかに、より大規模なサイト向けの上位プラン（Business Plusなど）も用意されています。個人やスモールビジネスであれば、名刺代わりの1〜2ページのサイトはMini、複数ページのホームページはPersonalが目安です（Miniは公開できるページ数が限られるLP向けプランです）。

無料プランでできること

STUDIOの無料プランは、「お試し版」と侮れない充実ぶりです。デザイン機能に制限はなく、有料プランと同じように白紙からのデザインができます。具体的には、次のようなことが無料の範囲で可能です。

• デザイン機能はすべて利用できる（機能制限なし）
• STUDIOのサブドメイン（〇〇.studio.site）でサイトを公開できる
• テンプレートを使って作り始められる
• スマホ・PC両対応のレスポンシブデザインに対応
• 簡単なブログ（CMS）機能も使える

無料プランの制限

一方で、ビジネスで本格的に使うなら気になる制限もあります。下の点が引っかかる場合は、有料プランへの切り替えを検討するタイミングです。

• 独自ドメインが使えない（URLが「〇〇.studio.site」になる）
• サイトにSTUDIOのロゴ（バナー）が表示される
• 月間のアクセス数に上限がある

操作を試したり試作したりする段階なら、無料プランで十分です。会社やお店の「顔」として公開するなら、独自ドメインが使えてロゴも消せる有料プランにすると、ぐっと信頼感のある見た目になります。まずは無料で作り込み、公開のタイミングで有料に切り替える、という進め方が無駄がありません。

STUDIO初心者の始め方｜5ステップで最初のページを完成

STUDIOは、次の5つのステップで最初の1ページを公開できます。順番に見ていきましょう。

Step 1：アカウントを作る（約2分）

まずはSTUDIOの公式サイトから、メールアドレスかGoogleアカウントで無料登録します。クレジットカードの登録は不要で、その場でエディタ（編集画面）が使えるようになります。「とりあえず触ってみる」のに費用も手間もかからないので、気軽に始められます。

Step 2：テンプレートを選ぶ（白紙から始めてもOK）

最初は「テンプレートから始める」のがおすすめです。コーポレートサイト、LP（1枚もののページ）、ポートフォリオなど、目的別のひな形が用意されているので、自分の用途に近いものを選びましょう。完成形に近い状態から手を入れられるため、ゼロから作るより断然ラクですし、デザインの完成度も保ちやすくなります。操作に慣れてきたら、白紙のキャンバスからオリジナルデザインに挑戦してみてください。

Step 3：「ボックス」の考え方に慣れる

STUDIOのデザインは、「ボックス」という箱を組み合わせて作ります。大きな箱の中に小さな箱を入れ子にしていくイメージで、この箱の中に文字や画像を入れていく、というのが基本の考え方です。最初は少し戸惑うポイントですが、ここを理解すると一気に思いどおりのレイアウトが組めるようになります。公式のチュートリアルでこの仕組みを一度なぞっておくと、その後がスムーズです。

Step 4：文字・画像・色を自分のものに差し替える

テンプレートの文字をクリックして自社やお店の情報に書き換え、写真を差し替え、色を自分のブランドカラーに変更していきます。たとえば、トップに入っている見出しを「〇〇市の△△教室」に変え、ロゴやイメージ写真を入れ替えるだけでも、グッと自分のサイトらしくなります。文字の大きさや余白は、画面右側のパネルで細かく調整できます。

Step 5：スマホ表示を整えて公開する

仕上げに、画面上部のボタンでPC・タブレット・スマホそれぞれの見え方を確認します。今はホームページを見る人の多くがスマホからなので、スマホでの見やすさは必ずチェックしましょう。文字が小さくないか、ボタンが押しやすいかを整えたら、「公開」ボタンを押すだけでサイトがインターネット上に公開されます。

STUDIOのメリット5選

メリット1：デザインの自由度が圧倒的

テンプレートに縛られず、思い描いたデザインをそのまま形にできるのがSTUDIO最大の強みです。デザインツール「Figma」で作ったデザイン案を、ほぼそのまま再現することも可能。「ここはもう少し余白を空けたい」「この見出しだけ大きくしたい」といった細かなこだわりにも応えてくれます。

メリット2：表示速度が非常に速い

STUDIOで作ったサイトは、表示が速いことで知られています。ページの表示が速いと、訪れた人が待ちきれずに離脱してしまうのを防げますし、Googleの評価（SEO）にも好影響があるとされています。せっかく見つけてもらっても、「重くて開かない」で帰られてしまう機会損失を減らせるのは、地味ですが大きな利点です。

メリット3：日本発サービスで安心して使える

管理画面もヘルプも、そしてサポートへの問い合わせも、すべて日本語で完結します。細かなニュアンスまで日本語のまま理解できるので、操作やトラブル対応で迷いにくいのが実利です。日本のWebデザインの流行に合ったテンプレートが揃っているのも、日本発サービスならではの安心感です。

メリット4：複数人で同時に編集できる

1つのサイトを、複数のメンバーで同時に編集できます。Googleドキュメントのように、誰がどこを触っているかを見ながら作業を進められるので、たとえばデザイン担当と原稿担当が手分けして同時に進める、といった使い方ができます。修正のたびにファイルをやり取りする手間がなく、チームでの制作がスムーズです。

メリット5：ブログ（CMS）機能でも運用できる

STUDIOには、WordPressのようにブログ記事を投稿・管理できるCMS機能があります。デザインの自由度を保ったまま記事を積み重ねられるので、お知らせの発信や、検索からの集客を狙ったコンテンツ作りにも取り組めます。「デザインは妥協したくない、でもブログでの情報発信も続けたい」という方に向いています。

STUDIOのデメリットと注意点

デメリット1：操作に少し慣れが必要

自由度が高いぶん、WixやJimdoに比べると、操作を覚えるのに少し時間がかかります。特に、Step 3で触れた「ボックス」の考え方には、最初は戸惑うかもしれません。とはいえ、公式のチュートリアルやYouTubeの解説動画が充実しているので、それらを見ながら手を動かせば、基本の操作は比較的すぐにつかめます。最初の1ページを作りながら覚えていく、くらいの気持ちで始めると挫折しにくいです。

デメリット2：プラグインで機能を足せない

WordPressには、予約システムや問い合わせ機能などを後から追加できる「プラグイン」という仕組みがあります。STUDIOにはこの仕組みがないため、高度な機能を足したいときは外部サービスとの連携で対応することになり、選択肢はやや限られます。「あれもこれも機能を追加したい」というサイトより、目的を絞ったシンプルなサイトのほうが向いています。

デメリット3：大規模サイトには不向き

数百ページにおよぶ大規模なサイトや、複雑なデータベースを扱うサイトには、STUDIOは向いていません。逆に得意なのは、数ページ〜数十ページ程度のコーポレートサイトやLP、ポートフォリオといった規模です。自分が作りたいサイトの規模が、この得意分野に収まるかをあらかじめ見極めておきましょう。

デメリット4：コードの書き出しができない

STUDIOで作ったサイトは、HTMLなどのデータを書き出して、別のサーバーへ引っ越すことができません。つまり、STUDIO上で運用し続けることが前提のサービスです。将来的に「別の環境へ移したい」という可能性が少しでもあるなら、契約前にこの点を理解しておくことが大切です。

STUDIOのSEO対策｜無料プランの制限と検索流入の伸ばし方

STUDIOで作ったサイトも、基本的なSEO設定は問題なく行えます。ただし無料プランには検索流入を伸ばすうえで無視できない制限があるため、検索からの集客を本気で狙う場合は有料プランを前提に考えるのが現実的です。

無料プランのSEOに関わる制限

• 独自ドメインが使えない（STUDIOのサブドメインでの公開になる）
• サイト上にSTUDIOのバナーが表示される

特に独自ドメインが使えない点は重要です。後から有料プランで独自ドメインに切り替えるとURLが変わり、それまでに積み上がった検索評価を引き継ぎにくくなります。SEO目的のサイトは、公開時点から有料プラン＋独自ドメインで始めるのが安全です。

STUDIOでできる主なSEO設定

• ページごとのタイトル・説明文（meta description）の設定
• OGP（SNSでシェアされたときの表示）の設定
• サイトマップの自動生成
• スマホ対応（レスポンシブ）と高速表示は標準対応

検索流入を伸ばすのはツール設定よりコンテンツ

SEO設定を整えるだけで順位が上がるわけではありません。検索流入の量を決めるのは、見込み客が検索するキーワードに答えるページ（記事）をどれだけ計画的に用意できるかです。STUDIOのCMS機能でブログを運用し、記事を積み上げていくのが王道です。記事づくり・メディア運営の全体像はオウンドメディア完全ガイドで解説しています。

STUDIOが向いている人・向いていない人

ここまでの特徴をふまえて、STUDIOが向いている人・そうでない人を整理します。自分がどちらに当てはまるか、チェックしてみてください。

STUDIOが向いている人

• 見た目・デザインにこだわりたい企業や個人
• 制作会社に頼む予算はないが、品質は妥協したくない方
• Figmaなどのデザインツールを使った経験がある方
• 表示速度やSEOを重視したい方
• 数ページ〜数十ページ程度のコーポレートサイトを作りたい方

STUDIOが向いていない人

次のような方は、STUDIO以外のツールのほうが目的に合っているかもしれません。それぞれ相性のよいツールも挙げておきます。

• とにかく簡単に、最短で作りたい方 → Jimdoなど
• 本格的なネットショップを作りたい方 → Shopifyなど
• 記事を大量に投稿するメディアサイトを作りたい方 → WordPress
• プラグインで自由に機能を足したい方 → WordPress