Canva WebサイトでLPを制作したらかなり良かった話

こんにちは、エキサイト株式会社3年目デザイナーの山﨑です。

今回は、「CanvaのWebデザインツールでLPを制作したらかなり良かった話」について記していきたいと思います。

弊社ではLP制作の依頼が来た場合、基本的にはデザイナーとフロントエンドエンジニア、デザインとフロント実装どちらも出来るデザイナーがアサインされます。

大体はWordPressでの実装ケースが多いのですが、設定やカスタマイズに時間がかかります。

今回の案件は締め切りがタイトでWordPressでの実装だと納期が遅れる可能性があった為、実験的に「同時編集可能」「デザインしたらそのままWebに反映できるのでフロントスキルが不要」「テキスト・画像変更が容易にできる」Canva Webサイトを採用してみることにしました。

WordPressはFigmaとWordPressという2つのツールを横断するのに対し、Canva Webサイトは1つのツールで完結するのでフロントスキルのないデザイナーでも1人でWebサイトを実装することができます。

添付画像は製作時のワークスペースになります。

普段のバナーやZoom背景などを作る時のCanvaと同じような操作感でWebサイトをデザインすることが可能です。

Webサイトの公開も、右上の「Webサイトを公開」ボタンでサクッと実行することができます。

実際にCanva WebサイトでLPを制作してみた上で、ざっくり出来ることをまとめてみました。

1.同時共有で編集出来る

共有リンクを渡すことで同時編集ができるので、例えば急なテキスト編集・画像変更なども発注側で対応してもらうことができ「テキストや画像を変更したい人が自分で変更できる」という「誰かに依頼しなくても、自分1人でやりたい事ができる」という点が非常に便利だなと思いました。

また、Canvaは直感的な操作でデザイン制作できるツールなので、学習コストをあまり払うことなく簡単にCanvaを扱うことができる点もハードルを下げる一因になってくれていると思いました。

2.コメントで修正点を指摘・その場で修正出来る

共有リンクを渡せばコメントで指摘事項をいただけるので、修正指示の入ったものを見逃すことなく対応することができました。

3.自動でモバイルサイズのデザインを作ってくれる

Canva Webサイトは、PCサイズのデザインを作るだけで自動でモバイルサイズのデザインを作ってくれます。

ただし、デザインによってはコンテンツの順番が想定とは違うデザインになってしまうので注意が必要です。

もしモバイルサイズを自動でCanvaで作ってもらう場合は、プレビューでモバイルサイズのデザインを確認しながらPCデザインを作ることをオススメします。

Canva Webサイトはフロントスキルのない人でも簡単にWebサイトが作れる画期的なツールなのですが、何点か注意が必要です。

1. ボタンそのものとリンクを紐付けで出来ない

LPなどを作るときは必ず「無料で相談する」などの遷移ボタンを挿入するのですが、Canvaではボタンそのものにリンクを紐づけることはできません。

ボタンそのものではなく「無料で相談する」というテキストにリンクを紐づける必要があります。

2.モバイルサイズのデザインが出来ない

先ほども書いたのですが、モバイルサイズのデザインはCanvaで自動的に組み合わせてもらうので、デザインによっては崩れてしまうことがあります。

PCサイズとモバイルサイズのデザインをどちらもやりたい所なのですが、現状CanvaではPCサイズしかデザインする事が出来ません。

3.アンケートツールの埋め込みが出来ない

右の赤枠のような、個人情報を記入する欄をCanvaでは設置することができません。

別でフォームを作り、遷移させる必要があります。

4.タグの埋め込みが出来ない

Canva Webサイトでは計測タグなどの埋め込みが出来ず、Google Analyticsなどの連携が不可能なのが現状です。

代わりに、インサイト機能でサイトの閲覧数やURLのクリック数などを確認することができます。(※このインサイト機能は一部有料プランのみ利用可能です。)

実際にCanva WebサイトをLPを制作してみたことで、出来ることや現状出来ないことを知ることができて非常に勉強になりました。

個人的意見ではありますが、Canva Webサイトはホームページなどの複数ページで成り立つものよりも、1ページ完結のLPの採用が適しているのではないかと思います。

最後に、エキサイトではデザイナー、フロントエンジニア、バックエンドエンジニア、アプリエンジニアを絶賛募集しております！

興味があればぜひぜひ連絡ください！🙇