おすすめ記事

おすすめ記事一覧

【2020年確定版】ノーコードツールWebflowの最強説を唱える

最終更新日:2021.02.09
記事作成

皆さんはWebサイトの制作に時間や労力などのコストをかけすぎていませんか?そんな時は、コード書かずに簡単に構築できるノーコードツールの一つである「Webflow」が非常に役立ちます。今回はタイトルにもある通り、「Webflow」がいかに最強かを示す記事になるのではないかと思います。どうぞ最後までお付き合いください。

個人のデザイナーさんチャンスです

Webサイトを構築していくためには、HTML&CSSなどのフロント言語やデザイン分野の知識が必須になってくると思います。多くの学習をこなして、やっと初めてよりデザイン面が洗練されたWebサイト制作の案件がこなせるようになると思われがちですが、今の時代はそんなにコストをかけなくても良い時代が既にやって来ています。ノーコードツールの「Webflow」を使えばコードを書かずに比較的容易にデザインが整ったWebサイトを構築できるようになります。よって、特にコードは書きたくないが、個人で高速に案件をこなしたい、または自ら運用したいと考えるデザイナーさん及びWebサイトを構築したい人に、非常に有益な記事になっていると思います。

そもそもノーコードとは?

「ノーコードとは何ぞや!?」と疑問に思う方もいると思うので、前提知識として、「ノーコード 」について軽く説明していきます。

「ノーコード(NoCode)」とは、一言で言えば、ソースコードを書かずにWebサイト/アプリを開発するための開発手法及びそのツールのことを指します。前述したように、基本的に開発の過程でソースコードを書く必要が全くないことから「ノーコード」と呼ばれています。ノーコード開発ツールの最大の特徴は、あらかじめ用意されたパーツを画面上にドラッグ&ドロップするだけで、エンジニアではない人でも簡単にアプリケーションを構築できることです。

ノーコードのメリット

NoCodeを使って開発を行うことで、より短期間で低コストでWeb/スマートフォンアプリを開発することができます。実際、アプリ開発会社に開発を依頼した場合、3ヶ月~6ヶ月かかることが多いですが、NoCodeの開発ツールを利用すれば、わずか2週間でアプリが完成することもあります。しかし、NoCodeの開発ツールを使えば、わずか2週間でアプリが完成するケースもあります。また、開発工数の削減は、大幅なコスト削減にもつながります。このようなメリットを考えると、NoCode開発は、新規事業開発やMVP(Minimum Viable Product)設計における仮説検証に適した開発手法と言えます。

多様化するノーコードツール

現段階で既に世界中には、沢山のノーコードツールが誕生し、今後もその勢いや成熟度は益々増していくでしょう。ノーコードツールで有名な「Bubble」ではより複雑なWebアプリを構築でき、「Adalo」ではスマホアプリを構築できるというように、それぞれのノーコードツールの強みは割とはっきりしています。今回紹介する「Webflow」はHPなどのWebサイト制作に特化したノーコードツールになっています。

「Webflow」のご紹介

アメリカのサンフランシスコを拠点とする「Webflow, Inc.」が提供する「Webflow」は、「Dreamweaver」や「Bind」などのアプリケーションや、「Wix」や「Jimdo」、「STUDIO」などのWebベースの開発環境など、コードを書かずにWebサイトやWebアプリケーションを作成できるツール中でも、最もポピュラーな開発ツールの一つです。これ1つのツールでサイト作成から公開までを完結させることができます。HTMLやCSSの知識があればいいのですが、実際の作業ではコードを書く必要はなく、基本的にはボタンをクリックするだけでOKなのです。特に最近コーディングを少しお休みしているデザイナーやディレクターの方にオススメです。

どんなデザインにも仕上がる

静的ページのコーディングに関しては、この「Webflow」で基本的にできないWebサイトのデザインはほとんどありません。デザインを作成する際には、あなたの創造性を存分に発揮しましょうまた、視差効果などのエフェクトも簡単に追加することができます。今までエンジニアに任されていたものが作れるのは素晴らしいことです。
これがエンジニアではない人がWebflowを使う醍醐味だと言っても過言ではありません。また、優秀な無料テンプレート集が豊富に用意されているので、多様なデザインを想像する選択肢が増えるのは大きいのではないでしょうか。

1つのツールでCMSを完成させる

更新のしやすさから外部ツールとの連携に泣かされていたCMSが、「Webflow」ひとつで簡単に作成できるようになりました。データテーブルを作成したら、写真やタイトルを追加していくことができます。CMSとは、Content Management Systemの略で、ホームページを管理・更新できるシステムのことを指しますが、簡単に言えば、ホームページを簡単に更新できるツールのことです。そのメリットは、更新がしやすい、管理・運用がしやすい、問い合わせなどの管理ができるなどです。ホームページとなると、HTMLタグを使って更新しなければならなかったり、サーバーを使っている限りセキュリティが心配だったり、問い合わせの数で効果を測ったりと、初めての方には少し気が引ける作業がたくさんあります。しかし、CMSは担当者の負担を大幅に軽減できるツールです。「Webflow」が最強と言われる一つの要因がこれに当たります。

注目すべき項目

・Googleフォント、Adobeフォント、カスタムフォント(任意のフォントをアップロード)が使用可
・ECサイトの作成が可能
・HTML、CSSのソースコード出力が可能
・SEO対策に使いやすい
・開発環境が不要で使いやすい

有料プラン

検索エンジンのインデックス化をの防止、カスタムコードでのnoindexの設定、転送パスワードの設定などの機能を使いたい場合は、有料プランも考えてみてはどうでしょうか。詳しくはこちらを参照してください。

具体的にどのようなプランに申し込めばいいのでしょうか?海外のサービスなので、ちょっとわかりづらいですよね。Site plansから一つとAccount plansから一つの両方に申し込む必要があります。つまり、Site plansとAccount plansのどちらか一方だけを契約すればいいように思われるかもしれませんが、ここで注意が必要です。

学習方法

とりあえず、まずは無料プランでWebflowを使ってみましょう。海外のサービスなので、日本語で説明している記事が少なく、最初は少し戸惑うかもしれません。しかし、ご安心ください!以下のページを参考にして勉強してみてください。

NoCode School(ノーコードスクール)
https://www.youtube.com/playlist?list=PLiDMHhMXhuXQiLGSyf6OwoJiEHyTufLLv
シンジの解説動画です。まずはこちらをオススメします!

Webflow University
https://university.webflow.com/
公式チュートリアルです。英語ですが、Google翻訳を使えば大体のことは理解できます。

フォーラム
https://forum.webflow.com/
使い方がわからない方はこちらもチェックしてみてください。(もちろんGoogle翻訳)

無料テンプレート
https://webflow.com/templates/free-website-templates
無料でダウンロードできますので、自分で作る際の参考にしてみてください。

良い口コミ

その種の最高のツール…

市場で群を抜いて最高のツールです。ある程度の学習が必要ですが、Webflow Universityを使用すると、非常に簡単になります。(出典:https://www.trustpilot.com/reviews/5fda9c38755dc10b48256861)

サービスが大好き!

サービスが大好き!誰かがコードに触れることなくウェブサイトを完全にカスタマイズするための素晴らしい方法です!
組み込みの要素のいくつかはより良く、より多くのカスタマイズを可能にするかもしれませんが、少し創造的な思考でほとんどのことが可能になるはずです。
ただし、いくつかの大手広告会社やGDRP機能との統合がさらに強化されていれば素晴らしいと思います。
100%人々にお勧めします!(出典:https://www.trustpilot.com/reviews/5dca84b1c845450a84916af4)

5つ星!!

コーディング能力のないデザイナーにとって非常に便利な素晴らしいサイト。少しバグがありますが、それが提供するものには価値があります!(出典:https://www.trustpilot.com/reviews/5c0854259d37800098869c26)

悪い口コミ

無料プランは大きなサイトには向いていません。

それは大きなサイトには良くなく、2ページしか許可されておらず、比較するとほとんどのウェブサイトビルダーよりも悪いです:(。
Webflowはデザインを素晴らしいものにすることでこれのバランスをとろうとしますが、それでも、大きなサイトや中規模のサイト、そしていくつかの小さなサイトはそうではありません我慢できます。(出典:https://www.trustpilot.com/reviews/5ee4981a7dd7530828bfcda3)

良くない

明らかな理由もなく高すぎる。ビルダーは複雑で、学習曲線が大きくなります。しかし、一度習得すれば、かなり簡単になります。無料プランは役に立たず、2ページに制限されています。ビルダーを効率的に使用するには、有料プランにアップグレードする必要があります。(出典:https://www.trustpilot.com/reviews/5f2825aa1a5a690a041e7b05)

まとめ

いかがでしたでしょうか?「Webflow」の強みがはっきりしたのではないでしょうか。個人的にやはりCMSをこのツール一つで完結させるのは圧巻だと感じました。口コミにもある通り、無料プランでの制限があることで満足度が高くないケースもあると思うので、そんな時は有料プランにサクッとあげちゃうのも一つの手だと思います。しかし、無料プランでも豊富にテンプレートが存在しているため、試す価値はあります。デザインが洗練されたWebサイトを比較的容易に構築可能な「Webflow」の最大の恩恵を皆さんで受けてみませんか?

臼井 崇

臼井 崇

テコンドー学生チャンピオン|2010年(H22年)に野村證券入社 ⇒ 5年半ザ・野菜を経験 |2015年10月からみずほFGにて金融商品のリスク管理業務に従事|2020年7月からファウンダーズに|金融からIT 、大手からベンチャーとそれぞれの観点からお役に立ちそうな情報を発信します!
日本に限らず海外のSaaSの紹介や、SaaS特集記事を取り上げていきます!
ご相談・お問い合わせは下記ボタンよりお願いします。







関連記事

  1. Adalo Resource・ユーザーが他の人をフォローできるようにする方法、フォームにステータス(…

  2. 特集記事

    【編集・加工】画像編集ソフト Luminar4をご紹介!

  3. Adalo Resource・Appleを使ってサインイン(スクリーンとコンポーネントセクション)に…

  4. 会社ロゴ

    .bubble

  5. 記事画像

    【2020年最新】CRM(顧客管理)ツールおすすめ5選!【比較】

  6. 記事作成

    Bubbleのプラグイン基礎を徹底解説!!

  7. 記事画像

    不動産業界でテレワークを実現するための方法を解説!

  8. 特集記事

    【EC業界オススメ】企業が導入している行動分析ツールAmplitude!【個人にもオススメ】

  9. 記事作成

    Bubble・オプションセット、エレメントカスタムステート

人気記事

  1. topimage
  2. 記事画像
  3. 特集記事
  4. top_image

おすすめ記事一覧

  1. top_image
  2. 記事画像
  3. 飲食店 会計
  4. 記事画像
  5. 記事画像
PAGE TOP