Webflow

Webflowを使って初心者でもプロのようなデザインを作る方法

Webflowを使って初心者でもプロのようなデザインを作る方法

今回はこんな疑問に答えていきます。

✓記事の内容

  • 初心者でもプロっぽいデザインを作る方法
  • WebflowでWebサイトを作るのにかかる目安時間
  • 最安、最短でWebサイトを作る方法

この記事を書く私は、WebflowでWebサイト制作を行い月に30万円ほど収益を上げています。またこのブログもWebflowで作成・管理されており、Webflowのテンプレートを参考に作成しています。

このような経験を活かし、初心者でもプロのようなデザインを作る方法を解説します。

Web初心者でもWebflowを使って、プロ同等のデザインを作る方法

手順は下記の5ステップです。

  • 【手順1】WebflowのショーケースからWebサイトをコピー
  • 【手順2】フォントを変える
  • 【手順3】色を変更する
  • 【手順4】写真、ブロックの幅
  • 【手順5】文章を入れる

【手順1】WebflowのショーケースからWebサイトをコピー

Webflowのショーケースからクローン可能なデザインを選択するだけです。

おすすめのショーケースについては「こちら」を参照ください。

【手順2】フォントを変える

クローンしたサイトに日本語のフォントを入れます。
無難なところは「Noto sans」「さわらび」などのGoogleフォントです。

フォントの入れ方については「こちら」をどうぞ。

【手順3】色を変更する

フッターの色は全体よりも暗い色を配色するとバランスがよく見えます。
全体の背景色に悩んだ際は「小林さん」の以下ツイートを参考にするのがおすすめです。
Web制作でスグに使える情報を発信している方で、他にも有益なツイートがたくさんあります。

【手順4】写真を差し替える

僕の場合、先に文章を入れる事が多いのですが、写真がすでに揃っている方は先に写真を入れるのがおすすめです。理由は、Webサイトの構成を一緒に決められるからです。また文章を作るのが少し楽になります。

【手順5】文章を入れる

写真を入れて情報の入れる場所が決まったら併せて文章を入れましょう。フォントサイズが見づらい場合は少し調整します。文字は16pxが平均です。

初心者がWebflowを始めた場合にWeb制作にかかる時間

ステップ1〜5までの時間

上記のステップを使えば、初心者でも1時間程度で完成させることができます。詳しい目安時間はおすすめのテンプレートでテンプレートごとに紹介しています。

素材準備の時間

文章構成やライティング、画像の準備が最も時間がかかります。シングルページで5時間程度を目安に考えると良いでしょう。文章に慣れている方なら1時間〜2時間で終わることもあるでしょう。

初心者がWebflow を使って1番ラクして、1番安くWebサイトを作る方法を2パターン紹介します

二人でWeb制作を進めるイメージイラスト

簡単なテンプレートをコピーする:0円/7時間

上記で紹介した方法を使い自分ですべて作成する方法です。自分で作成しているので金額は0円

所要時間は以下の通りです。

  • ステップ1〜5:1時間
  • ライティング・画像の用意:5時間
  • その他調整:1時間
  • 合計7時間

写真・文章を委託する:3万円〜/1時間

文章と写真の準備を委託するという方法。自分で行うのは簡単なアンケートとステップ1〜5のみでOK

金額は僕に依頼の場合:シングルページのライティング・写真の用意で3万円〜。これは少し宣伝みたくなってしまうのですが、委託先は僕にするのが1番楽です。

というのも、ライターを雇うのは単価によって金額が変動しますし、未経験ライターとプロのライターを見極めるのに苦労します。僕の場合は特にWebflowの説明も必要なく、テンプレートに合わせて文章作成ができます。またWebライターの経験も申し分ないと思います。

とはいってもライターの選定は自由なのでライターを探せる場所を紹介しておきます。

ライターは「ランサーズ」「ココナラ」「クラウドワークス」で探すことができます。委託する際はお金が無駄にならないように、ライターの見極めをしっかりしましょう。

所要時間は僕に依頼の場合:合計30分ほど。

  • アンケート:15分
  • 完成後の確認:15分

まずこちらから簡単なヒアリングシートをお送りします。
それにお答えいただき、Webサイトに合った文章・写真をお送りさせて頂きます。文字量で値段は前後する場合があるので一度お問い合わせ下さい。

まとめ:初心者でもWebflowは使える

初心者でWebflowを使うのは難しいとも聞きますが、
今回紹介したステップを使えば誰でも簡単にWebサイトを作ることができます。

プラスでデザインを少し勉強すれば、さらにいいWebサイトが作れるでしょう。

Webflowは無料で始めることができます。
まずは登録し、使用感を確かめて見ましょう。

「制作途中でわからなくなってしまった」「制作を委託したい」「なんだかダサくなってしまった」という方向けに手直し・制作代行も行っているので困ったことがあれば気軽にお問い合わせ下さい。

よくある質問

初心者がWebflowでWebサイトを作るのにどれくらい時間がかかりますか?

テンプレートをコピーして作る5ステップなら初心者でも1時間程度で完成させることができます。ライティング・画像の用意に5時間、その他調整に1時間で、合計7時間が目安です。

Webflowで使う日本語フォントは何がおすすめですか?

「Noto sans」「さわらび」などのGoogleフォントが無難です。フォントサイズが見づらい場合は少し調整します。文字は16pxが平均です。

初心者が1番安くWebサイトを作る方法は?

ショーケースからクローン可能なデザインをコピーして自分ですべて作成する方法です。自分で作成しているので金額は0円、所要時間は合計7時間です。写真・文章の準備を委託する場合は3万円〜で、自分で行うのは簡単なアンケートとステップ1〜5のみです。

Webflowは無料で始められますか?

無料で始めることができます。まずは登録し、使用感を確かめてみましょう。

Webflowのプロに、直接聞けます。

読んで詰まったら、相談は無料です。

この記事の著者(Webflow解説ブログの筆者)が直接お答えします。当社自身は現在、WebflowからAI制作へ主戦場を移しています。