ここ数年で一気に勢いがでてきたStudio、Framer、Wixなどのノーコード制作。
数々のサービスがありますが、国産で、初心者の方にも分かりやすいと評判のStudioをずっと触ってみたかったので、良い本が出たらしいと聞いてデモサイトを作ってみました。
今回購入した本は以下です!

Studioについて詳しくは公式サイトをご覧ください。
ななふがStudioの良いと思った点です。なんといってもアカウント作成すれば、無料でサイトが公開できちゃう点かなと思います。
当たり前の話ですが、無料プランには各種制限があります。
公式の料金プランを事前によく確認しましょう!
- ページビューやCMS、お問い合わせフォームの利用数に制限があり、超えたら有料プランに変更が必要
- Studioのロゴが常に表示される
- Google系ツール(サーチコンソールなど)への接続は有料プランのみ
- お問い合わせフォームのスパム対策(reCAPTCHA)も有料プランのみ対応可能
- Instagramの連携は基本外部サービスの有料プラン契約が必要(無料プランだと直接Instagramにリンクできない)
WordPressは管理の負担がある
WordPressでホームページ、ブログ制作をしている中で、管理が大変だな⋯面倒だな⋯と思う局面があります。
自分でサーバー/ドメインの契約が必要ですし。
パスワード強度が甘かったり、放置したりするとマルウェア感染の被害にあってしまうこともあるので、セキュリティについても気にしなくちゃいけません。
WordPress自体も、メジャーアップデートで仕様が大きく変わる。
テーマやプラグインも更新があるのでその対応も必要。
などなど。

マイナス面ばっかり書いているけど勿論Goodな点もありますよ!!
Studioなら、管理は自分でする必要がない
Googleアカウントを持っていれば、Studio公式ページですぐにアカウント作成が可能で、サイト制作が始められます。
画面のレイアウトもHTMLやCSS、JavaScriptを書かずに部品を並べていく感覚で作っていけます。
(WordPressもブロックテーマなら同様にできそうだけど、、、)
Studioのショーケースに掲載されているようなすごいサイトを作るには、コーディングの知識がないと厳しい感じがします。
カスタムコード追加がバリバリに必要と思います。(無料プランでも追加は可能)
作ったサイトのデータは、Studioの会社のサーバーで管理されるので、自分でサーバーを契約する必要がありません。
独自ドメインを使用する場合は自分で契約が必要です
本を見て作ったデモサイト
さてここからは、以下購入本を見て作ったデモサイトについてです。

架空のWebデザイナー、「RIMA YOSHIOKA」さんのポートフォリオサイトを制作できます。
ひとつひとつの工程を丁寧に解説されているので、躓く点はほぼ無かったと思います。
ななふ作成デモサイトをご紹介
作成したデモサイト、noindexで公開しています。
もし良かったらご参考までに見てみてください。(予告せず閉鎖する可能性あり)
※注 お問い合わせフォームは動作しています。イタズラ送信はご遠慮ください。
本を見ながら作りましたが、追加でアニメーションを入れたり、一部画像を差し替えています。
Studioのコミュニティも参考に
また、このデモサイトでは、WORKS一覧の画像の表示について、画面の幅が変わっても画像の比率(CSSのaspect-ratioに相当)が変わらないように変更してます。
こちらについてはStudio Community Japanで検索して、以下を参考にしました。
Cocoonフォーラムと一緒で、Studio Community Japanにも先人の知見が詰まっているので、いきなり質問せずに、自分でよくよく検索してみるといいかなと思いました。
Studioをまだ触り始めたばかりですが、管理人も今後ココナラにStudioでの制作サービスも出品したいなと思いました。
イベントのランディングページなど、期間限定公開のサイトにすごく向いているんじゃないかなと思っています!
最後に。WordPressの良いところを述べて終わりにします
WordPressだってもちろん良いところあります⋯!!
サーバー、ドメインを契約し続ける限り、サイトを育てていくことができます。
当方はココナラでCocoon関連のサービスを展開していますので、もしご自身でカスタマイズが難しいなどお悩みがありましたらご相談くださいませ!

grayishのカスタマイズご相談など、お待ちしております〜!
今回は以上になります。