Canvaでホームページを作成する手順を画像付きで分かりやすく解説|初心者でも1日でサイト作成~公開までできる完全ガイド

Canvaでホームページを作成する手順を画像付きで分かりやすく解説

「ホームページを作りたいけど、HTMLもCSSもわからない」

「パッと手軽に素敵なデザインのホームページを作る方法はないの?」

 

あります!

デザイン性の高いホームページを自力で簡単に作りたいのであれば、Canvaの利用をおすすめします。

Webの知識がなくても、デザイナー・コーダーのような専門職じゃなくても、Canvaを使えばあっという間に素敵なホームページを作ることができるのです!

>>Canvaの公式サイトはこちら

 

高品質なテンプレートが複数用意されているので、あとは自分好みにカスタマイズするだけでOK!

完全オリジナルのホームページを外注することなく完成させられます。

 

本記事の手順に沿って進めていけば、初心者でも1日で自分だけのホームページを公開できますよ!

ぜひ最後までご覧ください!

あわせて読みたい

Canvaホームページを作成してみよう|豊富なテンプレートを使えば専門知識・スキルがなくてもOK

ホームページを作成するなんて、デザインもコーディングも分からない初心者には無理!!

そんな気がしますよね。ですが、そんな人にこそCanvaが最適なんです。

 

Canvaは「デザイン作成ツール」なので、ホームページのデザインテンプレートもおしゃれで高品質。ホームページの美しい見た目は、訪問したユーザーの信頼感や安心感に直結します。

そして、各テンプレートは既にコーディングがなされているため、テンプレートを利用すれば、HTMLやCSSなどの専門知識・スキルがなくても大丈夫なのです!

自分でコードを書いたり読んだりする必要もありません。

 

つまり、初心者がゼロからデザインやHTML/CSSを調べてホームページを作成するよりも、Canvaを利用した方が美しく高品質なホームページができるというわけです。

 

高いお金を払ってプロに頼んだり、時間を使って自力でゼロから作成したりする前に、ぜひCanvaを試してみてください。

>>Canvaの無料トライアルはこちらから

 

ホームページを作りたい場合、Canva Pro(Canvaの有料版)へ登録していただく必要がありますが、【無料トライアル】を利用すれば30日間無料で有料機能を使い放題です。有料版はいつでも解除できるため、まずはトライアル登録してみましょう。

あわせて読みたい

Canvaでホームページを作る方法を画像付きで徹底解説

ここからは、実際にCanvaでホームページを作成する手順について、ひとつひとつ画像を用いて説明していきます。

手順に沿って手を動かしていただくだけで、簡単にホームページができあがることを体感してもらえるはずです!

手順1:使いたいテンプレートを選ぶ

Canvaのホーム画面にある検索バーに【ウェブサイト】と入力します。

 

ウェブサイトのテンプレートが複数表示されますので、

左側のサイドバーで、お好みの【スタイル】や【テーマ】でフィルタをかけましょう。

Canvaのテンプレートはどれも高品質なので、フィルタで絞らないとテンプレート選びでかなり時間を使ってしまいます…!

 

フィルタで絞られた候補の中から、希望のテンプレートをクリックして選択してください。

【このテンプレートをカスタマイズする】をクリックすると、テンプレートの編集画面が表示されます。

 

手順2:文字と画像を変更

文字(文章)と画像を希望のものに変更しましょう。

画像はCanvaに元々ある素材も利用できますし、ご自身でアップロードしたものを使うこともできます。

Canvaには1億点以上の素材が準備されているので、ご自身で用意せずとも多様なニーズに応えられるはずです!

>>Canvaの無料トライアルはこちらから

 

画像を変更する場合

テンプレートの画像を変更する場合、

①画像をクリックして選択されている状態(紫色の枠)で、

②希望の画像をドラッグする

これだけでOKです。

 

新しい画像に瞬時に上書きされます。

 

自分で撮った画像を使いたい場合は、左側メニューから【アップロード】を選択し、画像または動画をアップロードしてください。

 

アップロードが完了したら、あとは同じようにドラッグするだけで設定できます。

文字を変更する場合

文字を変更する場合は、文字をクリックした後、希望の文字を入力するだけです。文字数が多いと枠に収まらないので、サイズや文字数を調整してみてください。

文字と画像を削除する場合

テンプレートの削除したい文字や画像をクリックして選択すると、ゴミ箱マークが表示されます。

 

ゴミ箱マークをクリックして、【画像を削除】を選択すると削除完了です。

 

文字も画像と同じ方法で削除できるので試してみてください。

手順3:ボタンの追加

ボタンを工夫することで、特定のアクションを起こす確率を上げることができます。特定のアクションとは、「予約する」「購入する」「資料請求する」などを指します。

専門用語では、CTA(Click to Action)と呼びます。行動を促すためのボタン、ということですね。

 

テンプレートにあるボタンを変更して、ユーザーのクリックを促しましょう。

 

まずは左側のメニューから【素材】をクリックし、検索窓に【ボタン】と入力します。

 

気に入ったボタンをドラッグするだけでボタンの配置は完了です。

 

左側のメニューから【文章】を選択し、【予約する】と入力します。

 

次にボタンをクリックした時に遷移するページの設定をします。

 

ボタンが選択されている状態で、右上【リンク】をクリックしてください。予約ページのURLを入力すれば、ボタンのリンクは完了です!

手順4:お問い合わせフォームをリンク

残念ながら、Canvaのテンプレートにはお問い合わせフォームが実装されていません

無料の外部サイトをリンクして、お問い合わせにも対応可能なウェブサイトを作りましょう。

 

ここでは「formrun(フォームラン)」というサイトを使用します。

 

まずは、【3:ボタンの追加】項目の手順と同じように、ボタンと文字(お問い合わせ)を入力します。

 

次に、「formrun(フォームラン)」で作ったお問い合わせフォームのURLをリンク先に指定します。

 

お問い合わせボタンが選択されている状態で、右上【リンク】をクリックして、「formrun(フォームラン)」で作ったお問い合わせフォームのURLを入力すれば完成です!

手順5:YouTubeや各種SNSの埋め込み 

CanvaではYouTubeや各種SNSとの連携も簡単にできます。

 

左側のメニューから【アプリ】をクリックして、YouTubeやInstagramなどを選択して連携します。

 

例えば、YouTubeを選択すると、連携したい動画を検索できる画面が表示されます。

 

また、Instagramを選択した場合、連携するアカウントを指定するよう促されます。

アカウントを指定することで連携することができます!

 

使いたい用途に合わせてYouTubeやSNSと連携してみてください。

手順6:プレビューして公開

公開前の注意事項が2点あります。

 

  1. ファイル名を変更
  2. プレビュー確認

 

ファイル名は、上部中央をクリックすると変更できます。ウェブサイトの名前として使用されるので、慎重に名前を決めましょう。

 

名前が設定できたら必ず公開前に、右上【プレビュー】をクリックして全体的なデザインのチェックをしてくださいね。

Canvaで作ったウェブサイトの「ドメイン」はどうなる?|無料(Canvaのサブドメイン)と独自ドメインを選択可能

ウェブサイトを公開する際に、ドメインを選択する必要があります。

ドメインとは、ウェブサイトの住所のことです。有名なものに、「.com」「.jp」などがあります。

 

 

Canvaでは、以下の3つの選択肢があります。

 

  • 無料ドメイン
  • 新しいドメインを購入する
  • 既存のドメインを使用する

 

Canvaのサブドメインを利用すれば、無料でドメインが利用できます

以下のように、canvaのドメインの派生版のようなURLを使うことができ、●●●部分を自分の好きな文字列に設定できます

https://●●●.my.canva.site

通常、ドメインを使用する場合はお金がかかるのですが、Canvaのサブドメインを使用する場合は無料で済みます。

 

もし、新しいドメインが欲しい場合は、ドメイン代を支払えば使用可能です。また、すでに作ってあるドメインを使用することもできます。状況に合わせてお好みのものを選択して、ウェブサイトを公開してください。

 

現時点で新しいドメインや既存ドメインがない方は、Canvaの無料トライアルで始めるのをおすすめします。

>>Canvaの無料トライアルはこちらから

 

あわせて読みたい

まとめ

Canvaプロのウェブサイトテンプレートを使用すれば、初心者でも簡単にウェブサイトが作れることが分かりました。

 

高品質なテンプレートがあるので、ウェブサイト全体のデザインもまとまっていて素敵ですよね。

 

WordPressやWixなどよりも操作が簡単で分かりやすいので、無料でウェブサイトを作ってみたい方はぜひチャレンジしてみてくださいね!

 

>>Canvaの公式サイトはこちら

 

>>Canvaの無料トライアルはこちらから

 

あわせて読みたい
  • この記事を書いた人

dice

Adobe製品のお得な買い方、スキルアップのためのオンライン学習プラットフォーム情報、デジタルマーケティングの基礎知識など、大人の学びに役立つ情報を発信していきます。コストパフォーマンス高いスキルアップ・リスキリングのお供に。

人気記事

デジハリでAdobeCCを安く購入する方法 1

デザインや動画編集などのクリエイティブな作業に必要不可欠なAdobe Creative Cloud (以下、AdobeCCと略します)を契約すると、IllustratorやPhotoshopなど複数の ...

Canva_有料版と無料版の違いは?_Pro版を使うメリットを解説 2

Canva は、誰でも簡単にプロのようなデザインができるツールです。 バナーやSNS投稿、 名刺やポスター、プレゼン資料、YouTubeサムネイルにいたるまで、豊富なテンプレートを使って誰でも簡単にデ ...

SocialDogの評判、料金プランやメリット・デメリットを徹底解説 3

Twitterのアカウント運用はSNSマーケティングの王道です。 Twitterで注目を集めることで、ビジネスの成長・マネタイズにつなげられます。 とはいえ、Twitterのアカウントを運用するのは簡 ...

AdobeXDのスタータープランは無くなった?誤報です!正攻法でダウンロードする方法を解説 4

Adobe XD はWebサイトやスマホアプリのワイヤーフレーム・モックアップ・プロトタイプなどの作成に使用されるデザインツールです。 WebデザイナーやUI/UXデザイナーにとっては不可欠なツールの ...

【Canva】画像から人物を切り抜きたい!背景の削除と透過方法について画像つきで解説 5

Canvaには、「画像から人物を切り抜いて、背景なしの状態で保存する」機能があります。 ワンクリック操作で画像の切り抜きができるため、初心者にも優しい便利機能です。   この記事ではCanvaの「背景 ...

-Canva, Webデザイン
-