un tronc
ホームページ制作

Studioでホームページ制作ってどうなの?宿のサイトを運用して分かったメリットと注意点

こんにちは!アントロンのNaokoです。

「ノーコードなら、専門知識がなくても簡単にホームページを作れるのでは?」

Studioを検討していると、そんな印象を持つかもしれません。

私は、制作を担当している宿のサイトをStudioで作り、公開後の改修も続けています。結論からお伝えすると、Studioでのサイト制作は十分「あり」です。ただ、「少しだけ直したい」ときに、思ったより手間がかかる場面がありました。

この記事では、宿のサイトで実際によかったことと、手間がかかったことを紹介します。

※機能とプランについては、2026年9月時点の情報です。

Studioとは?

Studioは、コードを書かずにWebサイトをデザインし、公開・運用できるノーコードのWeb制作サービスです。デザインの編集画面のほかに、CMS、フォーム、アクセス解析、公開する環境もそろっています。お知らせやブログ、制作実績などはCMSで管理できるので、制作する人と更新する人を分けることもできます。詳しい機能はStudio公式サイトで確認できます。

宿のサイトでよかったこと

  • サーバーのことを考えずに公開できる:LP3本を含む宿のサイトを、画面上で組んでそのまま公開している
  • 最初のHTMLに中身が入っている:JavaScriptを実行しない取得でも、よくある質問・料金・アクセスの文章が全部取れた。ページの元のHTMLに、文章がそのまま入っている
  • 埋め込み(Embed)で自作のコードも動く:LPのカードの中に、自作のスクリプトで動くコピーボタンを置いている。予約の画面も、非公開のページに埋め込みで試作し、ライブプレビューで動きを確かめられた
  • アクセス解析が最初から付いている:Studioのアナリティクスで、ページごとのアクセスを見ている

お問い合わせフォームも、フォーム用のパーツで置けます。宿のサイトでも、送信すると完了のページへ進む形で使っています。送信内容はStudioのダッシュボードで確認でき、通知メール、CSV出力、Googleスプレッドシートとの連携にも対応しています。ただし、問い合わせをした人への自動返信メールは標準機能ではありません。Google Analyticsとの連携は、Miniプラン以上で使えます。

Studioの編集画面でお問い合わせフォームを選んだところ

Studioの編集画面で、お問い合わせページのフォームを選んだところです。左のレイヤーに、フォームの中の入力欄と送信ボタンが並んでいます。

手間がかかったこと

Studioは、触ればすぐに思いどおりになる道具ではありませんでした。宿のサイトで実際に手間がかかったのは、次のような所です。

  • CMSの記事は、サイトを公開しただけでは反映されない:宿泊プラン3件のCMSに、検索結果に出す説明文(meta description)を入れたとき、サイトを3回公開し直しても空のままだった。CMSの記事ごとに「アイテムを公開」を押す必要があった
  • スマホの表示は、実際の画面幅で確かめる:スマホ用の設定は幅540pxを基準に作るが、実際のスマホ(幅375px前後)では見出しが折り返した。改行が崩れたページは、スマホだけに出す見出しを別に用意した
  • 色や文字の設定が、あとから増える:LP1本の中で使っている色を数えると42色あった。登録した色にまとめ直して21色にした
  • ページごとのタイトルと説明文が一覧で見づらい:別に表を作って管理し、手で入力していたが、続けるのが大変になった。いまは全ページのタイトルと説明文を1か所で直せるツールを作って使っている。入力欄が空のときは、サイト全体の設定値が薄い文字で出るので、入っているかどうかを画面だけで見分けにくい
  • noindexにしたページは、sitemap.xmlからも外れる:宿のサイトで、お知らせのページをnoindexにしたときに確かめた
Studioに登録した文字スタイルの一覧

宿のサイトのStudioに登録した文字スタイルの一覧です。使用状況が「未使用」のスタイルも残っています。

ページごとのtitleとdescriptionを一覧にした自作ツールの画面

自作のツールで、宿のサイトのページごとのtitleとdescriptionを一覧にした画面です(文字と数値はぼかしています)。

ノーコードは「学習が不要」という意味ではありません。コードを書く代わりに、Studioの決まりと操作を覚える必要があります。

Studioではコードを使えない?

「Studioではコードが使えない」という説明は正確ではありません。

Embedボックスを使うと、HTML、CSS、JavaScriptをページの中に埋め込めます。有料プランでは、サイト全体やページごとに、headタグやbodyタグへカスタムコードを追加できます。ただし、カスタムコードは編集画面やライブプレビューでは動かず、公開した環境で確かめる必要があります。

また、Studioが作ったページのHTMLを直接編集したり、外へ書き出したりはできません。詳しくはHTMLとカスタムコードに関する公式ヘルプをご確認ください。

プランによって使える機能が違う

たとえば、古いURLから新しいURLへ転送する301リダイレクトは、Businessプラン以上の機能です。宿のサイトの設定画面にもリダイレクトの項目は無く、使わなくなったページは非公開(開くと404)にして、Search Consoleで検索結果からの削除をリクエストしました。

最新の条件はStudio料金プランで確認できます。公開の仕組みや、サイトを引っ越すときの注意は、StudioとWordPressはどっちがいい?両方で運用して分かった手間の違いにまとめています。

Studioが向いているサイト

  • LPや、小規模な会社・お店のサイト
  • サービス紹介サイト、ポートフォリオ
  • サーバーの管理をしたくないサイト

反対に、独自の機能を足す予定がある、外部のシステムと複雑につなぎたい、といった場合は、Studioでできる範囲を制作の前に確かめた方が安全です。

まずは「公開後に誰が何を直すか」を書き出す

Studioを選ぶか迷ったら、公開したあとに誰が、どのページの何を直すかを書き出してみてください。更新する人と範囲が見えると、Studioのプランや作り方を決めやすくなります。

アントロンでは、サイトの目的や更新の体制を伺ったうえで、制作方法をご提案しています。「Studioで作れる内容なのか知りたい」という段階でも、お問い合わせフォームからお気軽にご相談ください。

最後まで読んでくださりありがとうございました!

コメント