Webサイト制作というと、HTML・CSSを使ったコーディングやWordPressを思い浮かべる方も多いのではないでしょうか。
最近では、コードを書かずにWebサイトを制作できる「ノーコードツール」も増えており、その中でも国内で利用が広がっているのが「STUDIO」です。
私はWeb制作会社で、実際にSTUDIOを使ったWebサイト制作に携わってきました。
「ノーコードで本当にWebサイトが作れるの？」
「WordPressやコーディングと比べてどうなんだろう？」
「実務でも本当に使えるの？」
最初は私自身も、このような疑問を持っていました。
実際に仕事で使ってみると、制作スピードが速く便利な一方で、思っていた以上にWeb制作の知識が必要だと感じる部分もあります。
この記事では、Web制作会社でSTUDIOを使って感じたメリット・デメリットや、STUDIOで実際にどこまでWebサイトを作れるのかについてご紹介します。
STUDIOは、コードを書かずにWebサイトを制作できるノーコードのWeb制作ツールです。
画面上で文字や画像、ボックスなどを配置しながらレイアウトを作り、そのままWebサイトとして公開することができます。
例えば、次のようなWebサイトを制作できます。
また、CMS機能も備わっているため、お知らせやブログ、制作実績など、公開後に継続してコンテンツを追加するサイトにも対応できます。
「ノーコード」と聞くと、簡単なホームページしか作れないのではないかと思う方もいるかもしれません。
私自身も、実際にSTUDIOを使うまではそのようなイメージを持っていました。
しかしSTUDIOでは、独自ドメインを接続したWebサイトの公開だけでなく、CMSを使ったブログ運営や、Google Analytics、Google Search Consoleなどを利用した公開後のサイト運用にも対応できます。
ブログや複数ページのWebサイトを制作するのであれば、Personalプラン以上を選択肢として考えやすいと思います。
Personalプランでは複数ページのサイトを制作でき、CMSも利用できるため、例えば次のような構成の企業サイトにも対応できます。
一般的な企業サイトや店舗サイトであれば、STUDIOだけでも十分対応できるケースは多いと感じています。
有料プランでは、独自ドメインを接続してWebサイトを公開できます。
例えば、無料で発行されるSTUDIOのURLではなく、
example.com
company.jp
といった独自ドメインでサイトを公開できます。
企業サイトや店舗サイトとして運用するのであれば、独自ドメインを設定できることは大きなポイントです。
STUDIOには「Studio CMS」というコンテンツ管理機能があります。
例えばブログの場合、一つひとつ新しいページを作成してデザインする必要はありません。
あらかじめ記事ページのデザインを作っておけば、CMSから必要な情報を登録して記事を追加していくことができます。
例えば、次のような情報を管理できます。
WordPressの投稿機能に近いイメージです。
ブログだけでなく、お知らせ、施工事例、制作実績、スタッフ紹介など、同じデザインで継続的に追加していくコンテンツにも利用できます。
STUDIOでは、Google AnalyticsやGoogle Search Consoleを利用したサイト運用も可能です。
Google Analyticsを設定すれば、サイトにどのくらいアクセスがあるのか、どのページが見られているのかなどを確認できます。
Google Search Consoleでは、どのようなキーワードで検索されているのか、Google検索でどのくらい表示されているのかなどを確認できます。
そのため、STUDIOはWebサイトを作って公開するだけではなく、公開後のアクセス解析やSEO改善にも活用できます。
STUDIOはノーコードツールですが、コードをまったく使えないわけではありません。
有料プランでは、サイト全体や個別ページのheadやbodyにカスタムコードを追加することができます。
また、Embedボックスを使用すると、HTML・CSS・JavaScriptを含むコードをページ内に追加することもできます。
例えば、
といった使い方ができます。
ただし、WordPressや通常のコーディングサイトのように、STUDIOが生成しているHTMLやCSSそのものを自由に編集できるわけではありません。
あくまでSTUDIOでサイトを制作しながら、必要な部分にコードを追加して補うイメージです。
HTML・CSS・JavaScriptの知識がある人であれば、STUDIOの標準機能だけを使うよりも、対応できることの幅が広がると思います。
STUDIOを使っていて特に感じるメリットは、制作スピードの速さです。
通常のWeb制作では、デザインを作成したあとに、HTMLやCSSなどを使ってWebサイトとして実装していきます。
例えば、次のような工程があります。
STUDIOの場合は、画面上でレイアウトを組みながらそのままWebサイトを制作できるため、デザインから実装までの時間を短縮できます。
特に、数ページ程度の企業サイトや店舗サイトなどはSTUDIOとの相性が良いと感じます。
納期が短い案件や、制作予算が限られている案件でも使いやすいのではないでしょうか。
STUDIOでは、実際のWebサイトに近い状態を見ながらデザインを調整できます。
文字サイズや余白、画像サイズなども画面上で確認しながら変更できます。
通常のコーディングでは、CSSを変更してブラウザで確認し、また修正するという作業を繰り返すことがあります。
STUDIOでは視覚的に調整できるため、デザインを担当している人にとっても比較的操作しやすいツールだと思います。
WordPressでWebサイトを制作する場合は、レンタルサーバーを契約し、WordPressをインストールして運用するケースが一般的です。
さらに、次のようなものについても管理する必要があります。
STUDIOの場合は、STUDIO上で制作したWebサイトをそのまま公開できます。
一般的なレンタルサーバーを別に契約してWordPressを設置する必要がないため、公開後の管理が比較的シンプルです。
これは制作側だけでなく、クライアント側にとってもメリットだと思います。
Webサイトは、公開したら終わりではありません。
公開後に、次のような情報を追加していくサイトも多くあります。
STUDIOのCMSを利用すれば、Webサイトのデザインそのものを編集しなくても、新しいコンテンツを追加できます。
そのため、公開後はクライアント自身にお知らせやブログを更新してもらう、といった運用も可能です。
毎回Web制作会社へ更新を依頼する必要がなくなる点もメリットだと思います。
STUDIOには、さまざまなWebサイトのテンプレートがあります。
ゼロからすべてデザインするのではなく、テンプレートをベースにカスタマイズして制作することもできます。
例えば、次のような部分を変更できます。
特に短納期の案件では、テンプレートをうまく活用することで制作時間をかなり短縮できます。
ただし、文章と写真だけを変更しただけでは、ほかのWebサイトと似た印象になってしまう可能性があります。
テンプレートをそのまま使用するのではなく、クライアントのサービスやブランドに合わせてデザインをカスタマイズすることが重要だと思います。
便利なSTUDIOですが、実際に制作してみると、すべてが簡単というわけではありません。
ここからは、仕事で使用して感じたデメリットについてご紹介します。
STUDIOは「ノーコードで簡単」と紹介されることがありますが、最初から思い通りのサイトを作れるわけではありません。
特に、次のような考え方を理解する必要があります。
最初は、「なぜここに配置できないの？」「なぜBoxの高さが変わるの？」と戸惑うこともあると思います。
HTML・CSSを学んでいる人であれば、Flexboxなどと似た考え方もあるため、比較的理解しやすいと感じます。
STUDIOを使ったからといって、PCで作ったデザインが自動ですべての画面サイズできれいに表示されるわけではありません。
例えば、次のようなことがあります。
そのため、PC・タブレット・スマートフォンそれぞれの表示を確認しながら調整する必要があります。
STUDIO制作でも、レスポンシブWebデザインの基本的な知識は持っていた方がよいと思います。
STUDIOはかなり自由にWebサイトをデザインできます。
カスタムコードを使えば、標準機能ではできないことを補うこともできます。
しかし、HTML・CSS・JavaScriptを使ってゼロから制作するWebサイトと、まったく同じ自由度があるわけではありません。
STUDIO自体が生成するHTMLを直接編集することはできないため、複雑なシステムや特殊な機能が必要なWebサイトには向いていない場合があります。
そのため、
「STUDIOが使えるからSTUDIOで作る」
のではなく、
「このサイトはSTUDIOで制作するのが適しているのか？」
を最初に考えることが大切です。
実際に仕事でSTUDIOを使って、特に感じたことです。
STUDIOはコードを書かなくてもWebサイトを制作できます。
しかし、きれいで使いやすいWebサイトを作るためには、次のような知識が必要です。
つまり、「STUDIOの操作方法を知っている＝良いWebサイトを作れる」ということではありません。
STUDIOはWebサイトを作るためのツールであり、大切なのは、そのツールを使ってどのようなWebサイトを設計するかだと思います。
STUDIOを使ってみて感じるのは、STUDIOとWordPressには、それぞれ向いているWebサイトがあるということです。
例えば、STUDIOは次のようなWebサイトと相性が良いと思います。
一方で、次のようなWebサイトでは、WordPressやオリジナルでの開発を検討した方がよいケースもあります。
どちらかが優れているというより、「そのWebサイトに何が必要なのか」によって使い分けることが大切だと思います。
これからWeb制作を学ぶ方にとっても、STUDIOを触ってみる価値はあると思います。
特に、
「まずは自分でWebサイトを1つ完成させてみたい」
という人には始めやすいツールです。
画面上でWebサイトを組み立てられるため、Webサイトがどのような構造で作られているのかを視覚的に理解できます。
ただし、Web制作を仕事にしたいのであれば、STUDIOだけではなくHTML・CSSの基本も学んでおくことをおすすめします。
HTMLやCSSを理解していると、
といったことを考えやすくなります。
さらに、STUDIOではカスタムコードやEmbed機能も利用できるため、HTML・CSS・JavaScriptを理解していることで対応できることも増えます。
ノーコードとコーディングは、どちらか一方を選ぶものではないと思います。
両方を理解しておくことで、案件に合わせて適切な制作方法を選べるようになります。
Web制作会社で実際にSTUDIOを使ってみて感じたのは、
「STUDIOだから簡単にWebサイトが作れる」
というより、
「Web制作の知識があれば、かなり効率よくWebサイトを作れるツール」
だということです。
独自ドメインでのサイト公開だけでなく、CMSを使ったブログ運営、Google AnalyticsやGoogle Search Consoleとの連携、カスタムコードの追加などにも対応しています。
特に、次のようなWebサイトではSTUDIOのメリットを活かしやすいと思います。
一方で、複雑な機能や高度なカスタマイズが必要なサイトでは、WordPressやコーディングによる制作の方が適している場合もあります。
Web制作では、一つの制作方法にこだわるのではなく、「このWebサイトの目的を達成するためには、どの方法が一番適しているのか」を考えることが大切です。
私自身も、STUDIO・WordPress・HTML/CSSそれぞれの特徴を理解しながら、案件に合わせて使い分けていきたいと思っています。