【STUDIO】ノーコードでつくれる Webサイト制作で副業デビュー♪

こんにちは！ Shinobuです。
普段はグラフィックデザイナーやPCの講師として活動をしています。

在宅ワークや副業が当たり前の世の中になってきて、「私も何かはじめたいな！」と考えている方も多いのではないでしょうか。

そんな中、人気なのは「Webデザイン」。その理由は、「Webサイトは私たちにとって身近な存在である」ということや、「パソコンひとつで始められる」という、取っつきやすさにあります。

しかしWebデザインの勉強を始めるにあたって、「コーディング」に対しての敷居の高さを感じている方もいらっしゃるのではないでしょうか。「HTMLやCSSを勉強してみたけどちゃんと作れるようになるまで時間がかかりそう」とか、「一人で学ぶには限界があるかも…」「もっと簡単にできるならやってみたいけど」というようなお悩みはありませんか？

今回は、そんな悩めるあなたにおすすめの「ノーコード」についてご紹介します！

※実際の操作を見てみたい方は記事の最後で【STUDIO×Winスクールコラボセミナー】の動画を無料でご覧いただけますのでぜひ参考にしてみてください。

ノーコードって?

「ノーコード」とは、その名の通り「コードを書かない」とか「コーディング無し！」と読み換えていただいて大丈夫です。

そうなんです、今はコードを書かなくても、Webサイトを作ることができる時代になっているのです！

ノーコードは、MicrosoftのWordやPowerPointで、図形をレイアウトする感覚に似ています。そういう操作なら「自分にもできるかも」って思いませんか？

DX時代にノーコード！

ノーコードの技術は、近年になっていきなり出てきたわけではありません。

例えばMicrosoftのExcelなんかは、プログラミングをすることなく、誰でも表計算やグラフ作成を行うことができるので、ノーコードと言ってもいいと思います。

さて、国内でのノーコードへの注目度は年々増しており、現在さまざまなWeb制作会社や大手企業のホームページでも、ノーコードを使ってのWeb制作が進められています。

その大きな理由の一つに、「DX」があります。

経済産業省が推し進める「DX（企業全体がIT・デジタル化によって変革すること）」。「2025年の崖」がすぐそこまで迫っている中、国内でのDXに拍車がかかっていることは事実です。IT人材の不足などが紛糾される中、コーディングやプログラミングのような専門知識がなくてもWeb制作ができてしまうツールの登場は、まさに救世主と言えるでしょう。

では具体的に、ノーコードにはどのようなメリットがあるのでしょうか。

ノーコードでWebサイトを作るメリット

ノーコードでWebサイトを作るメリットは、主に以下のものが挙げられます。

コーディングをしなくていい
制作時間の短縮
コストの削減

まず「コーディングをしなくていい」は、ノーコードの最大の特徴ですね。コーディングの作業が無いということは、「制作時間の短縮」につながります。

一般的なWebサイト制作の流れは、以下のような流れになっています。

発注
打ち合わせ
見積書作成
マーケティング・サイト設計
サイトマップ作成
サーバやドメインの準備
ワイヤーフレームの作成
サイトデザイン
素材収集・原稿作成（撮影なども含む）
コーディング
デバッグ
テスト公開
公開
更新・修正

伝統工芸並みの工程の多さにビックリですね！

ノーコードの場合、以下のようなステップにまで削減することができます。

発注
打ち合わせ
見積書作成
マーケティング・サイト設計
サイトマップ作成
原稿作成（撮影なども含む）
ノーコードでレイアウト
公開
更新・修正

さらに自分のサイトを作るだけなら、「サイト設計」→「ノーコードでレイアウト」→「公開」の３ステップで済んでしまいます。

こういった理由で、「制作時間の短縮」や「コストの削減」にもつながる、というわけです。

また、専門的な知識が無くても、簡単にサイトを立ち上げることができます。初心者さんにはちょっと心配な「レンタルサーバー」なんかも、サービス側におまかせ。サイトのデザインが仕上がったら、レンタルサーバを借りなくても、ボタン一つでサイトを公開することができちゃうんです。

ノーコードのデメリットは？

ノーコードのデメリットは、「無料プランだと広告が出る」ことです。ツールによっては、目立つ場所に表示されるものもありますので、要チェックです。

また、ノーコードのツールのサービスが停止すれば、もちろんWebサイトも表示されなくなります。このようなリスクがあるということは、知っておかなければなりません。

ニーズに合わせて判断してください。

で、ノーコードってどうやって使い始めるの？

Googleなどの検索エンジンで、「ノーコード　webサイト」などで検索してみてください。

すると、ノーコードでWebサイト制作ができるサービスがいくつか候補に挙がります。これらのサービスにアクセスし、会員登録をすれば、無料で直ちにノーコードを使い始めることができます。

どうやってサービスを選んだらいいの？

Web制作のノーコードには、大きく分けて２つの種類があります。

「テンプレートのノーコード」と「１から作るノーコード」です。

「テンプレートのノーコード」は、例えば「Wix」というツールがそれに当たります。

ツール側がテンプレートを用意しており、ユーザーはテンプレートを選ぶだけ。文字や画像を差し替えれば完成です。いくつかの質問に答えるだけで適切なテンプレートを提示してくれるので、パソコンの操作に慣れていない方にはおすすめです。

しかし、自由にデザインすることはできません。

「１から作るノーコード」は、真っ白な状態から自由に作ることができるツールのことです。その代表格が「STUDIO」。簡単な操作で、デザインに集中して作成することができます。もちろんテンプレートを利用することも可能ですので、テンプレートをベースにして作り変えたりしてもいいですね。

「Webデザインに興味はあるけれど、コーディングにちょっと自信ないかも…」という方に、ぜひ使っていただきたいのが、「STUDIO」なのです。

どうしてSTUDIOなの？

実はSTUDIOは日本の企業によって開発されたツールです。
そのため、日本語でのサポートが手厚いこともSTUDIOを選ぶ理由のひとつ。

海外で生まれたツールは、ヘルプページを見に行くと、その多くが英語だった、ということがよくあります。また、日本に上陸したばかりのツールなどは、国内での利用者が少ないと、使い方をまとめてくれているWebサイトや動画が少なくて困ります。

日本語のフォントが充実していることも、日本の企業ならでは。無料利用の範囲でも、多種類のフォントを使わせてもらえるので、とってもありがたいのです。

また、STUDIOのテンプレートはクオリティが高いんです。
ご興味のある方は、こちらから覗いてみてください。自分にも、こんなにおしゃれなサイトが作れると思うと、ワクワクしませんか？

とはいえ、STUDIOのテンプレートは、まだまだ種類が少ない…のですが、2023年3月に「STUDIO STORE」という、テンプレートを売買できるサービスがスタートするそうです。これからのテンプレート増量に期待大！ですね！

そうそう。「ノーコードの最大のデメリットは広告が付く」と先述しましたが、STUDIOの広告は、とーっても小さいから邪魔にならないんですよ。

STUDIOでWeb制作した方がいい人チェック

ではここで、あなたがSTUDIOを使うべきかどうか、チェックしてみましょう。

レイアウトデザインに集中したい
とにかく素早くWebサイトを立ち上げたい
コーディング時間が無いことはもちろんのこと、PowerPointやWordの使用感に似ているので、コーディング学習時間を短縮することができます。
コーディングに自信がない
レスポンシブ対応もしているので、「コーディングを勉強したけど、スマホ対応にするのはちょっと…」という方にもおすすめです。
コストを抑えたい
広告の表示が嫌
フォントにこだわりたい
デザイナーがよく使うモリサワフォントを使うことができます。また、フォントのようにアイコンを選ぶことができるので、ボタンなどもすぐに作れます。
おしゃれなテンプレートを使いたい
テンプレートももちろんですが、フリー素材の画像も簡単に利用することができます。
サーバを借りるなどの手続きが分からない
サイトのアドレスの末尾に「.studio.site」が付きますが、「レンタルサーバ」などを借りなくても、デザインが完了すればすぐに公開できます。
共同で作業をしたい
複数人で同時編集も可能です。
ブログ記事を盛り込みたい
CMS機能を使って記事を投稿することができます。

いくつ当てはまりましたか？
ひとつでも当てはまるならSTUDIOを使わない手はありません。

STUDIOでもっとできちゃうこと

私が初めてSTUDIOを知ったのは４年前。

STUDIO公式のセミナーに参加したことがきっかけでした。当時は「STUDIOすごい、便利！」と感動した一方で、「コード的にどうなっているのかな？検索エンジンでちゃんと上位に上がるのかな？（SEO）」と疑問でした。それから対策や設定をする部分がしっかり整っていることを知り、安心して利用することができています。

また、「お問い合わせフォーム」のようなフォームも作れてしまうんですよ！

「フォームを作って送受信するにはPHPプログラミングとかいろいろまた勉強しないといけないんでしょ…」と、くじけそうになったことがある方は、ぜひ使ってみてください。

さらにさらに！アニメーションもつけることができちゃうんです！

ボタンにカーソルを当てるとボタンの色が変わるとか、スクロールすると「ふわ～」って画像が出てくるとか。そういうことが可能なんです。コーディングだと、JavaScriptなんかが必要ですが、STUDIOを使えば一切不要です。